mobile product layout

Retired Boards Appdev Store Design
1

Hey, I have a little trouble with the mobile product card layout. The product pictures are not full width and hight, and it needs to come down a little bit because a small part of the picture is held under the header as you can see in the picture with the badge (new) its not fully visible. and I want to increase the padding on both sides of the rest of the layout (except the product picture) cause the writings are so close to the edge.

IMG_1831.jpg
IMG_1831.jpg1284×2778 135 KB

IMG_1830.jpg
IMG_1830.jpg1284×2778 163 KB

IMG_1829.PNG
IMG_1829.PNG1284×2778 577 KB

2

Hey @abghadban

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

RESULT:

Moeed_0-1729254526866.png
Moeed_0-1729254526866.png375×667 149 KB

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

Best Regards,
Moeed

3

hey thanks for your reply, the body layout worked, how the product image is not full width, there are padding at the sides of the image as well as the top

IMG_1832.PNG
IMG_1832.PNG1284×2778 588 KB

4

I fixed the top padding when changed to 10xp, the image padding left and right, needs to be full width