Increase space between products and left border

Store Design
, , , , ,
1

Hello, I am trying to increase the padding / distance between the far left product and the end of the browser screen, aswell as the spacing between the products perhaps.

shopify help.png
shopify help.png1918×911 217 KB

I am unsure how to do it.
I am using the Dawn Theme!

Thank you in advance!

2

Hello @ChrisM187
Our team is ready to help you.
Please share your website URL so that we can check and assist you.

3

Hello, my shop URL is: https://trinitysneakers.com/
thank you in advance!

4
  • Here is the solution for you @ChrisM187
  • Please follow these steps:
  1. Go to Online Store → Theme → Edit code.
  2. Open your theme.liquid file
  3. In theme.liquid, paste the below code before and press ‘Save’ to save it
  • Here is the result you will achieve:

BSSTekLabs_0-1726924291733.png
BSSTekLabs_0-1726924291733.png1899×619 106 KB

  • Please press ‘Like’ and mark it as ‘Solution’ if you find it helpful. Thank you.
5

Increase 5px to a larger number if you want more spacing @ChrisM187 .

6

Hey @ChrisM187

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-1726924598649.png
Moeed_0-1726924598649.png1876×789 139 KB

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

Best Regards,
Moeed

7

Thank you for your reply, but now i have the problem that the products are showing weirdly and not in a sorted way. i tried playing around with the 100px but it didnt change much.

ChrisM187_0-1726925069069.png
ChrisM187_0-1726925069069.png1904×758 114 KB

8

Thank you, that helped! But is it possible to have a different space from the left border and a separate space between the products themselves?

9

You can try this code @ChrisM187

BSSTekLabs_0-1726925356495.png
BSSTekLabs_0-1726925356495.png1900×883 138 KB

10

Great! Thank you very much!
Now the right border does not have the same distance to the far right product as the left side, is it possible to somehow change that aswell?
I’m apologize for the many questions..

ChrisM187_0-1726925562482.png
ChrisM187_0-1726925562482.png1918×622 123 KB

11

Please repalce to this code @ChrisM187

  • Please press ‘Like’ and mark it as ‘Solution’ if you find it helpful. Thank you.

BSSTekLabs_0-1726925709637.png
BSSTekLabs_0-1726925709637.png1917×642 89.8 KB

12

This is perfect! Thank you very much for all the help!

13

Glad to help you. Have a good day @ChrisM187 .