Change Font Awesome color after making it a clickable link

Design help General
1

I need to change the color my social media icon for both ‘state none’ and ‘state hover’ but for some reason even though I have given it a class it doesn’t work. It is located at the very bottom of my page, could someone take a look and see why?

Thanks!

Here is my site Read-Only: Link
(how to share your site Read-Only link)

Here is the live page: Link

2

I had a look at your read only link and this certainly is a strange one. Might be easier to create a small div with your FB icon as a background. Then for this div’s “on hover” state, replace that FB icon for another one in whichever colour you like. This is what I have done in the past.

3

Thanks @jasondark,

Yes it is strange. I would rather find out if it’s possible with the icons but thanks for the recommendation. I’ll give that a go if all else fails!

4

Hey, when inserting font awesome you don’t need an HTML embed.

  1. Just add the font pack to your fonts in settings. There will be I think 4 to copy and paste. They’re just to get the pack in the code.

  2. Then go to the cheatsheet, find the facebook icon, copy the icon itself, or copy the css content reference.

  3. Add a text component into the canvas, copy the code/icon into that text box. You can add a classname of the css content (f09a).

  4. Then add hover css styles.

That’s all you should need. No embed element is necessary.

5

Sweet, thanks Gary, worked a treat! :+1: