Re: Dawn Theme - Page Width

Solved

How can I adjust the page width of the Dawn theme to 70%?

mjk68
Tourist
10 0 1

I added a page and it looks like the default is a narrow page width. I would like to change this to 70% width. Where can I make this edit?

Accepted Solution (1)
amorlett
Shopify Partner
186 12 34

This is an accepted solution.

i have no idea why but some reason dawn default for pages is actually main-page.liquid ... sorry about that i dont really use dawn much

View solution in original post

Replies 14 (14)

amorlett
Shopify Partner
186 12 34

in page.liquid  change 

<div class="page-width page-width--narrow"> 
to
<div class="page-width page-width--wide"> 
mjk68
Tourist
10 0 1

This didn't work. I still have a narrow page width. Any other ideas?

 

mjk68_0-1637892711978.png

 

amorlett
Shopify Partner
186 12 34

make sure you are on the right page it should say something like page.liquid  not main-page or whatever else dawn has

mjk68
Tourist
10 0 1

mjk68_0-1638456173610.pngmjk68_1-1638456248498.png

 

See screen shots, page width is still narrow.

amorlett
Shopify Partner
186 12 34

This is an accepted solution.

i have no idea why but some reason dawn default for pages is actually main-page.liquid ... sorry about that i dont really use dawn much

mjk68
Tourist
10 0 1

Thank you!!!

Schoppifyer
Tourist
5 1 4

Are there other options besides narrow and wide? "medium" maybe?

amorlett
Shopify Partner
186 12 34

I'm not sure i haven't messed around with  dawn but most likely some type of grid css system setup

designbrains
Visitor
1 0 0
Thanks mate this worked!
JaimeJ
Tourist
5 0 1

Hello, I am having this problem but now in the most recent version of Dawn, there is no main-page.liquid file. Can you tell me which file I need to update now? I can't seem to find the code when doing a search. Thank you!

JaimeJ
Tourist
5 0 1

I solved it. Nevermind : )

MyCarteus
Visitor
1 0 0

Thanks 🙂

EdwinHamers
Visitor
1 0 0

The page width is defined like this in the liquid files:

 

page-width--xxxxxxx

 

If you are changing the width of pages, you probably also want to change other parts of the Dawn theme, like blog posts, etc...

 

For blog posts, and possibly others, edit these files and change

 

page-width--narrow --> page-width--wide

 

 

Affected filed:

 

Sections > main-page.liquid
Sections > page.liquid
Sections > main-article.liquid (multiple lines)

 

 

There might be more places in the many liquid files that need changing!

Lid221
Shopify Partner
7 0 3

Super useful info! Thank you