Font Awesome question

[yingfuli]

Hi,

I’m trying to add an icon from Font-Awesome in a text element. I know what shortcode to use but the number of icons seems to be very limited. I’m looking for the icons of cats and horses and so on and I know they are part of FA’s free version. How do I get them into Pro?

[rad]

Hi @yingfuli,

Thanks for reaching out.

You could use HTML icon instead of shortcode icon, example,

<i class="x-icon" data-x-icon-s="&#xf641;"></i>

Where the icon code f641 (  ) is from https://fontawesome.com/icons?d=gallery.

There are 3 attributes depending on icon,

data-x-icon-s data-x-icon-b data-x-icon-o

It’s for solid icons (like https://fontawesome.com/icons/ad?style=solid ), then for brand icons (like https://fontawesome.com/icons/500px?style=brands), and then for outline and regular icons (like https://fontawesome.com/icons/angry?style=regular).

BUT, not all icons are achievable, especially the new ones that aren’t still integrated to the theme.

Thanks!

[yingfuli]

Hi,

Why don’t all icons work? As it is a font it should automatically add new icons, no? How can I achieve something similar without FA? I just need three icons (horse, cat, male/female) of which only male/female work.

[thai]

Hi @yingfuli,

It seems the FontAwesome in the latest version of X/Pro theme is not up-to-date(it’s 5.0.0 right now).

I’ll forward to our developer and it should be fixed in upcoming updates.

Stay tuned

[yingfuli]

Hi,

I finally found three icons I can use (though not ideal). However, now I get this;

Content editor:

Front end:

Website is www.greeneve.eu and the browser is Safari on Mac.

[thai]

Hi @yingfuli,

I’ve just checked on my local installation and those icons are working fine on both frontend & backend:

• Backend:

• Frontend:

Would you mind providing us with your admin account so we can take a closer look?

Thank you.

[paul.r]

Hi Ying,

I checked but can’t find the page you are referring to.
So I created a test page and added the icons. It seems to work.

When adding your code, pelase make sure you are in Code Editor tab

Thanks

[yingfuli]

Hm, that was it: I used Rich Text. Thanks.

[friech]

We are delighted to assist you with this.

Cheers!