How to add icons on Menu?

I am interested to use Facebook ICON,

So I use,

<i class="x-icon x-icon-heart" data-x-icon="&#xf39e;" ></i>

But it won’t work,

Screenshot - 2020-07-12T124137.529

Am I need to change the class?

Hi Saswata,

Thank you for reaching out to us. You need to replace data-x-icon with data-x-icon-b in your HTML code to make the Facebook icon (or any social icons) work, so your code will look like this:

<i class="x-icon x-icon-heart" data-x-icon-b="&#xf39e;"></i>

As of Font Awesome version 5 they split icons into multiple fonts. This can be fixed by changing instances of the data-x-icon attribute to one of the following:

data-x-icon-b for social icons.
data-x-icon-o for outline icons.
data-x-icon-s for solid icons.

The original attribute data-x-icon will still work for solid icons as a fallback but we’ve updated everything for consistency.

Hope this helps!

1 Like

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