Recent Posts Widget with Post Image

[ericaeide]

I’d like to change the theme’s recent post widget’s image to be the featured image, not author’s avatar. I’m thinking this is accomplished easily but looking for how to do it. Thanks.

[SQadmin]

Hi,
In order to keep the main theme files intact you should add another widget that shows the post image instead of author.
Add this code to your sweetdate-child/functions.php
http://pastebin.com/C8CEuXvz

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[ericaeide]

Awesome – thank you! Only issue is how should I make the featured images in the widget be square instead of round? The author images in the original widget are square (can’t remember if I tweaked something with css for in the admin panel).

[SQadmin]

They should be the same since they have the same class and everything.
There is an site-wide option to switch that in Sweetdate -> Styling -> Use squared avatar images

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[nicholaus1221]

The widget works really well, is there a way to change the pink coloring around the circled image?

Thanks for your help,
Nicholaus

[SQadmin]

Hi, Add this to Sweetdate -> Styling -> Quck css to change the pink color on hover: .latest-blog span.avatar:hover {background:#HEX}
Replace HEX with your color

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[nicholaus1221]

Thanks for getting back so quickly, I added .latest-blog span.avatar:hover {background:#FF9900} to the quick css and it’s still pink 🙁

Any ideas?

Thanks for the help,
Nicholaus

[SQadmin]

Hi,
Sorry, you are right you need to add also border: 3px solid #HEX
ex:
.latest-blog span.avatar:hover {background:#HEX;border: 3px solid #HEX}
What I gave you should take care of the circle when you are hovering it.
For the normal state add another one without the :hover, like this: .latest-blog span.avatar {}

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[nicholaus1221]

Thank you! It worked flawlessly. I really appreciate your swift replies and excellent service. I’ll be rating your theme 5+ stars!

Nicholaus

[SQadmin]

Thank you. Rating does help

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[Author]

Posts