found this here:
https://www.tomato-elephant-studio.com/blog/converting-menu-items-font-awesome-icons-drupal-8-menu
I want to preserve this Drupal 9 trick incase it disappears.
If you have already have fontawesome in your theme, like I have in D8W3CSS custom subtheme, you don't need to install fontawesome, you just need to add this menu preprocess function to your themename.theme file:
use Drupal\Core\Render\Markup;
/**
* Implements template_preprocess_menu().
*/function drupal8_w3css_subtheme_preprocess_menu(&$variables) {
// Convert menu to HTML if contains `fas fa-` or `fab fa-`.
foreach ($variables['items'] as $menu_id => $menu) {
$title = $variables['items'][$menu_id]['title'];
if (
(strpos($title, 'fas fa-') === 0)
|| (strpos($title, 'fab fa-') === 0)
|| (strpos($title, 'fa fa-') === 0)
) {
$variables['items'][$menu_id]['title'] = Markup::create('<i class="' . $title . '"></i>');
}
}
}
then to use it, just replace the menu title with the FA code.
so for example, if you put this as menu title: "fa fa-envelope-o", it will get replaced in the HTML output by "<i class="fa fa-envelope-o"></i>", and if you have fontawesome installed the icon will appear.
you may need to adapt strings to your fontawesome version or desired icon version, and don't forget to adapt the name of the function too.
- Log in to post comments
Comments