What's your biggest current challenge? Have your say in Community Polls along the right column.

How can I increase the space between collection cards in Dawn?

Solved

How can I increase the space between collection cards in Dawn?

Bird_on_a_Wire
Explorer
72 0 13

Hello,

 

I would like to increase the space between my collection cards (https://e1c8d3.myshopify.com/collections ) - see screenshot below

 

Screenshot 2023-02-13 at 17.34.42.png

So that it matches the spacing on my product collection page - see below https://e1c8d3.myshopify.com/collections/available-artworks

 

Screenshot 2023-02-13 at 17.42.25.png

 

 

SITE: https://e1c8d3.myshopify.com/collections 

PASSWORD: thaits 

 

Is anyone able to assist?

 

Thanks!

 

Accepted Solution (1)

GemPages
Shopify Partner
5625 1262 1254

This is an accepted solution.

Hello @Bird_on_a_Wire 

 

It's GemPages support team and glad to support you today.

I would like to give you a solution to support you.

1. Go to Online Store -> Theme -> Edit code.

2. Open your theme.liquid theme file.

3. Paste the below code before </body>:

 

<style>
   .collection-list-wrapper slider-component ul{
      margin-left: -5px;
      margin-right: -5px;
   }
   .collection-list-wrapper slider-component ul li{
      padding-left: 5px;
      padding-right: 5px;
   }
</style>

 

Hope my solution can work and support you!

Kind & Best regards!

GemPages Support Team.

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center

View solution in original post

Replies 5 (5)

GemPages
Shopify Partner
5625 1262 1254

This is an accepted solution.

Hello @Bird_on_a_Wire 

 

It's GemPages support team and glad to support you today.

I would like to give you a solution to support you.

1. Go to Online Store -> Theme -> Edit code.

2. Open your theme.liquid theme file.

3. Paste the below code before </body>:

 

<style>
   .collection-list-wrapper slider-component ul{
      margin-left: -5px;
      margin-right: -5px;
   }
   .collection-list-wrapper slider-component ul li{
      padding-left: 5px;
      padding-right: 5px;
   }
</style>

 

Hope my solution can work and support you!

Kind & Best regards!

GemPages Support Team.

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center
Bird_on_a_Wire
Explorer
72 0 13

Thanks @GemPages that works!

 

SaraM
Shopify Partner
1 0 5

Hi @Bird_on_a_Wire!

You are using Dawn theme, so you can change grid gap by Theme Settings.
You can go to Customize > Theme Settings > Layout > Grid and change horizontal space.
I hope this helps!

 

Best Regards,

Sara

 

 

killerpresets
Excursionist
27 0 4

Much better than editing code IMO! Thanks for the info!

Two wrongs don't make a right, but three rights make a left.
WCTiles
Visitor
2 0 0

Hi,

We are using Dawn theme and there is no: Customize > Theme Settings > Layout > Grid

 

There is: Customize > Theme Settings > Layout & styling but it only displays "Content maximum width"

 

Do you know if the grid section has been moved?