How can I standardize product photo layouts on my website?

Store Design
, , , , ,
1

268AF8C4-BAD2-4505-B745-6FE4B7C0F03B.png
268AF8C4-BAD2-4505-B745-6FE4B7C0F03B.png828×1792 190 KB

618DC71F-1797-4837-ABA0-AB9AEAA57A6A.png
618DC71F-1797-4837-ABA0-AB9AEAA57A6A.png828×1792 214 KB

At the moment the product display has a white border round the images which is annoying I want it right to the screen edges (mobile) and also for some reason on the product photos it’s cut off the sides of the images to make the image thinner for some reason. Is there a way to standardise the image layouts ? Thanks for any help I’ll attach photos

website : DAGNORAK.com

2

Hey @DAGNORAK

Follow these Steps:

  1. Go to Online Store
  2. Edit Code
  3. Find theme.liquid file
  4. Add the following code in the bottom of the file above tag

Moeed_0-1690798553946.png
Moeed_0-1690798553946.png371×664 186 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

3

That just throws up a load of errors

4

Hey @DAGNORAK

If you follow the correct steps then it should work and the result would be as shown in the screenshot. Also, if you’re facing errors then show a screenshot of what error you’re facing

5

@DAGNORAK

Please add the following CSS code to your assets/base.css bottom of the file.

@media screen and (max-width: 767px) {
.section-template--19842186772800__main-padding {
    padding: 0 !important;
}
li#Slide-template--19842186772800__main-34273505542464 {
    padding: 0 !important;
}
}

Thanks!

6

Sorry that was my bad, is there a way of doing it to only effect the product photo not the entire page ? Thanks