Shopify themes, liquid, logos, and UX
Hi Shopify Community!
I'd like to expand the margins on my product page to leave more space on either end, and have the products (3 on each row) shows up more towards the center.
I'd also like to reduce the amount of space between the header and the product pictures. There is a lot of white space.
I'm sure this requires edits to the code, but I'm not sure how to do that.
Here is the page I'm referring to - https://rentindus.com/collections/our-garments
Would appreciate any help 🙂 Thanks!
Solved! Go to the solution
This is an accepted solution.
yes please add this code
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
.collection-content {
padding-top: 6px;
}
#CollectionAjaxContent .page-width {
padding: 0;
}
sorry for any issue can you please share issue image so i will give you proper solution
@KetanKumar Apologies! I have attached a screenshot. I've circled the areas I'm referring to with red circles. The area at the top is too large, and the areas on the sides is too little.
can you please confirm this look fine?
Hi @KetanKumar, apologies - I think I forgot to attach the screenshot in my last message.
Please see this Google doc - https://docs.google.com/document/d/1gVjogd0-bM3xgR4vG_Xxnn2ugW6FBeMCp1Jvjc3_New/edit. I have circled the empty space at the top - I would like to make this space smaller. I have also circled the margins on the side of the page - I would like these to be larger.
Please let me know if that makes sense.
Thank you for your patience!
This is an accepted solution.
yes please add this code
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
.collection-content {
padding-top: 6px;
}
#CollectionAjaxContent .page-width {
padding: 0;
}
its my pleasure to help us
June brought summer energy to our community. Members jumped in with solutions, clicked ...
By JasonH Jun 5, 2025Learn how to build powerful custom workflows in Shopify Flow with expert guidance from ...
By Jacqui May 7, 2025Did You Know? May is named after Maia, the Roman goddess of growth and flourishing! ...
By JasonH May 2, 2025