0

Im using Font Awesome CDN with Joomla and Helix Ultimate framework. Im trying to implement some icons to my navigation, using the shortcodes. For any reason the "utensils" icon is not working - but its implemented in the freeware. Here is my css:

ul.sp-mega-group li.item-189 a:before{
   font-family: 'FontAwesome' !important;
  content: '\f017' !important;
  font-size: 50px;
  color: #5A1F00;
  padding-top: 20px !important;
}

ul.sp-mega-group li.item-195 a:before{
   font-family: 'FontAwesome' !important;
  content: '\f128' !important;
  font-size: 50px;
  color: #5A1F00;
  padding-top: 20px !important;
}

ul.sp-mega-group li.item-196 a:before{
   font-family: 'FontAwesome' !important;
  content: '\f2e7' !important;
  font-size: 50px;
  color: #5A1F00;
  padding-top: 20px !important;
}

ul.sp-mega-group li.item-197 a:before{
   font-family: 'FontAwesome' !important;
  content: '\f279' !important;
  font-size: 50px;
  color: #5A1F00;
  padding-top: 20px !important;
}

The other free icons are working. When I`m using an other shortcode für this menulink its working too, so the problem should be the icon itself. Here is a link to the site, the submenu items under "Parkinfos" is the problem.

Hope someone can tell me whats wrong here.

kweb

Martin Kares
  • 13
  • 2

1 Answers1

1

That icon is not available in 4.7.0, you will need to upgrade to version 5 for that to be available. If you check the icon page here, you will see it was added in version 5. The nearest icon available in your version is 'cutlery' so you can use:

content: '\f0f5' !important;

Also, consider tidying up your CSS:

ul.sp-mega-group li a:before{
  font-family: 'FontAwesome' !important;
  font-size: 50px;
  color: #5A1F00;
  padding-top: 20px !important;
}

Then you only need to add the content style to each menu item.

Jake Dickerson
  • 83
  • 7
  • Hi, thanks for your help. I didnt recognize that cutlery is something diffrent than utensils icon. Kinda wired. Thanks for letting me know, problem solved. – Martin Kares Apr 10 '18 at 09:49