Hello,
On my home page in the BLOGS POSTS Section, the featured image is cropped (because it is square). How can I adjust this so that the square image can be shown properly?
Thanks!
Hey @cdgerard
Pls follow below steps:
- Open your theme editor
2.Find your default blog theme template
3.Choose the section of blog
4.Copy the CSS code to your custom css input textbox on the right side.
.rte img {
max-width: 100%;
object-fit: contain;
}
like below:
Hi @cdgerard
You can change settings of blog to make the image display as Adapt to image from Online Store > Themes > Customize > Blogs > Default blog
Best Regards,
Dan from Ryviu
Hello Sonya_2025,
Thanks for this but it did not solve my issue.
I am referring to the home page, in the Blog Posts Section. The square image I’m using is cropped.
How can this be adjusted?
Hi @cdgerard
It depends which image section your are using. Can you put the image that cropped on the home page?
I think it displays well.
Ah you are looking at the live site which is DEBUT theme.
I am referring to a development site on DAWN theme, here is a link:
Choose the whole image section, And copy the CSS code to your custom css input textbox
.card__media .media img{
object-fit: contain;
}
And it will be display like this. Hope this helps.
Thank you yes it is now showing better - but how can the grey background be changed to white?
Yes, copy the below css code and replace the old one into same input textbox
.card__media .media img{
object-fit: contain;
}
.media {
background-color: white;
}
2 Likes
It works. Thanks so much for your help!