Jump to content

Using Font Awesome Icons For User Profile Items

Joy Rex

Recommended Posts

I'd like to use Font Awesome icons for some of the custom profile fields instead of text.

I've added fields so users can put their SoundCloud and Discogs URLs, but some are far too long and I've managed to standardize them a bit with a hyperlink:


What I'd like to do is replace the "My Discogs" and "My SoundCloud" text hyperlinks with a Font Awesome icon (although SoundCloud was added to FA5, which IPS hasn't implemented yet).

I tried putting the Font Awesome HTML code into the custom field formatting, but it's not working (breaks the layout horribly) - would I need to use the unicodes for the FA icons?

If so, instead of writing something like

<a href="{$content}"><i class="fa fa-user"></i></a>

I would need to do something like (pseudo code; I know that's not the proper way to use content:)

<a href="{$content}"><span style="content:'/f007'"></span></a>


Any advice on how to implement is appreciated.

Link to comment
Share on other sites

7 hours ago, Fosters said:

Have you tried copying the font awesome code?
I'm using this successful 

<i class="fa fa-address-book" aria-hidden="true"></i> - {$content}

results in


Well, I did - let me try again and see if it works or not. Thanks for testing!

Any reason you have the ARIA attribute on it?

Just tried - it works! Must have been a computle gleetch 😀

Link to comment
Share on other sites


This topic is now archived and is closed to further replies.

  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...