Add Icon to Sub Item in Nav Bar

Hi, I’m trying to add an icon after the page name for the sub item in the nav bar. I’ve searched the forum and there was some code to add into the ‘Navigation Label’ in the ‘Menu’ in the WordPress admin, but for me it doesn’t work! Here’s the CSS:

<i class="x-icon x-icon-arrow-right"></i>

Hope you can help!

Thanks!

Hi there,

Please try adding the data-x-icon attribute like this:

<i class="x-icon x-icon-arrow-right" data-x-icon="&#xf061;"></i>

Hope this helps.

That’s sorted it, thank you!!!

Sorry, just one more thing, can I change the colour of the icon, so the text link is in one colour and the icon is in another?

Cheers

Hi There,

You can set the color using the style attribute. Refer to the example below.

<i style="color:red" class="x-icon x-icon-arrow-right" data-x-icon=""></i> Blog

Hope that helps.

Hi, I tried the code but it doesn’t change the colour of the icon for me.

I’ll put the URL of the site in a secure note as I’m currently in the middle of building it at the minute.

Thanks!

Hi, please ignore that, it’s really weird, but I’ve just checked the site again and the icon has now changed colour! I did refresh my page before, but it might have just been mega laggy!

Thanks for your help, it’s much appreciated!

You’re most welcome.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.