How to edit Column gap on Collection page?

MiuMiu237
Explorer
119 1 24

Hi guys,

I would like to increase the column gap on Collection page WITHOUT affecting gaps on Home page other any other page.

Please check my url: https://189ee3-2.myshopify.com/collections/tops

Thank you!

 

Screenshot (1).png

 

 

Replies 2 (2)

ThePrimeWeb
Shopify Partner
1178 308 227

Hey @MiuMiu237,

 

Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag type the following. Screenshot attached for reference.

 

 

 
<style>
@media screen and (min-width:750px){
  .grid.product-grid{
    column-gap: 5rem!important; 
  }
}
</style>

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1706270479448.png

 

 

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
MiuMiu237
Explorer
119 1 24

It would also change the Column gap in my Home page(((