Hi, I need help reducing the size of my images.
When I upload my image - it gets stretched into a bigger size and becomes pixelated. How do I resolve this?
Image With Text section - Custom Page - ‘Organic Ajwa Dates’
The image height: Adapt to image - if i put small it crops the image
url: https://pure-date.myshopify.com/
pw: triwhi
I want it to look like this
.image-with-text__media.image-with-text__media--adapt.media {
padding-bottom: 0px !important;
}
Add this code in the bottom of the base.css file
and make your image size: 730x434
Thank you.
@Zworthkey This is what happens - it crops my image & my image is still very zoomed in. I want it to show my full image
Please see attached my full image
@Zworthkey When I make my window smaller - It shows my full image. I want it to show the full image when without changing section height.
@himanshuhkm can you help?
@Riz_bangee
yes i can try but first to remove that previous code i want to see full image i can see only cropped image
@Riz_bangee
Modify your Images Size i have sent above the ratio of image. Either it will cut the Image. because your image height is too big. make proper height of image or modify it.
@Riz_bangee
Open Shopify admin>>>online store>>>Theme>>>action>>>edit code>>>assets>>>base.css
Try this check
#shopify-section-template--14356319928363__16421545010dfc6597 .image-with-text__media.image-with-text__media--adapt.media {
padding-bottom: 80% !important;
}
#shopify-section-template--14356319928363__16421545010dfc6597 .image-with-text__media.image-with-text__media--adapt.media img{
object-fit: contain !important;
}
I have given this code for one page https://pure-dates.com/pages/ajwa-dates let see if its good then we can go for other page too
Hi @himanshuhkm
Thank you for the solution.
I thought you might know the answer to this issue:
I have an “image with text” section at the top of my home page.
How can I minimize the space on the mobile platform:
between the upper part above the image
Between the image to the text below it?
