- This topic has 9 replies, 2 voices, and was last updated 5 years, 3 months ago by
.
How do I make these images round like in the demo?
(see screenshot)
Hi @Vivienne,
I hope you are well today and thank you for your question.
Could you please share the page URL from your site where it is displaying so that I can help you?
Best regards,
Shufflehound teamYou can achieve it by adding the following CSS code in the Custom CSS code option of your theme on the below path.
Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code
#page-container .sh-recent-posts-widgets-item-thumb { width: 76px; height: 76px; border-radius: 100px; } #page-container .sh-recent-posts-widgets-item-thumb .sh-ratio { border-radius: 100px; overflow: hidden; } #page-container .sh-recent-posts-widgets-count { top: 2px; right: 2px; }This created another issue with alignment (the images are over the lines dividing posts)
Please also use the below CSS code to resolve this issue.
#page-container .sh-recent-posts-widgets-item-thumb { top: -14px; }Hi again,
The hover element on this is still square ā how can I make it round like in the demo? (See image) ā page is this main page sidebar: http://thisonederfullife.com/
Is there a way of achieving this without custom CSS? I’m surprised it’s not a setting since it is included in the demo here: https://jevelin.shufflehound.com/blog1/
Thank you
Solution for this topic
To achieve this without using custom CSS code, please set the Blog Style to Style 2 in the theme settings as shown in the attached screenshot.
Perfect! Thank you!
You are always welcome here š
