Large Area Not Fulfilled on Collection Pages - District Theme

Store Design
1

Hello There:

I am trying to reach out and see if anyone knows how to make the area larger on a product collection page? For some reason, it looks as though there is so much space on each side of the page and I was wondering if you can change the coding to allow the page to be spread out more widely. I am sending an example of what I would like my page to look like compared to another site (non Shopify site). Please let me know if this can be done.

Thank you,

Alisanne

My Site Example: https://shugarplumsgifts.com/collections/farmhouse-furniture-style

What I would like it to look like: https://www.giftsforyounow.com/personalized-blankets_1205.aspx

2

Hello @ShugarPlums

Add this CSS code

Online Store > Themes > Edit code > Assets > custom.css

.template-collection .wrapper { max-width: 1440px}
3

Not sure if I did this right, but I added a “New Asset” under Online Store > Themes > Edit code > Assets > It asked me to choose and extension, so I added “css” and named it custom.css. Then I copied and pasted the code. However, it did not change anything. I do not believe I did it right. Can you please explain more to me. Thank you, Ali

4

You can add in style.css file, if you can’t find custom.css.

1 Like
5

Hi There: I looked and I do not see a style.css file under assets as well? This is the District theme. Not sure if that makes a difference? Thanks, Ali

6

Okay I figured it out. I need to put it under the following:

Online Store > Themes > Edit code > Assets > theme.scss.liquid and it works! Thanks so much!