[fabipaoliniParticipant]

Hi! How do I replace the CHAIN LINK icon and dark background that show when you hover a Blog post, with a custom image and background on a masonry type page?
I’ve been looking around in the forum and don’t know how to do it yet…
Let me know!
Thanks!
Fabiana

[RupokMember]

Hi Fabiana,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Meanwhile you can add this under Custom > CSS in the Customizer.

.entry-thumb::before {
  content: '\\f0c1';
}

You can find the UNICODE value for all icons from here – http://fontawesome.io/icons/

You can also add image on the content :

.entry-thumb::before {
  content: url('//path/to/your/image.png');
}

Hope this helps.

Cheers!

[fabipaoliniParticipant]

It worked! Perfect 🙂
Now, how do I change the background color on hover?
Thanks!
fabi

[LelyModerator]

Hi Fabi,

You’re welcome!
Please use this CSS:

.entry-thumb:before{
       background-color: green;/*Change green to your preferred color*/
}

Hope this helps.

[fabipaoliniParticipant]

For some reason this isn’t working…it’s still black…what else could I try?

[fabipaoliniParticipant]

Actually, the small circle around the icon changed color, but the black that covers the image hasn’t changed color…
How do I change that?

[JadeModerator]

Hi Fabi,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

[Author]

Posts