DEBUT THEME - Full width pages

Solved
Highlighted
Tourist
11 0 0

I want to make page full width, without spaces in left and right corners.

0 Likes
Highlighted
Shopify Expert
667 170 233

This is an accepted solution.

Hi, @jimTim ,

This is Evita from On The Map.

 

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss->paste bellow code in bottom of file

.page-width {
    padding-left: 0!important;
    padding-right: 0!important;
    max-width: 100%!important;
}

 

Best, Evita

On The Map Marketing | Developing custom Shopify Sites & Apps is our thing

- Install our latest app Accessibly - Makes your store accessible for everyone, helps to avoid fines
- Inc 5000 | Shopify Parners | 20+ stores launched | 300+ active clients
- Need help with your Shopify store? Reach out to us!
1 Like
Highlighted
New Member
6 0 0

Hi,

how do I do it for one page only? To have a certain page full width, but the rest of the theme stays the same.

I have created the copy of page liquid and how to change the code to make it full width?

 

Thx

0 Likes
Highlighted
Excursionist
18 0 2

Hi,

how do I do it for one page only? To have a certain page full width, but the rest of the theme stays the same.

0 Likes
Highlighted
Excursionist
31 0 11

Hi Evita - thanks for that tip - I've used it to update our pages

One question (for debut theme) is it has also stretched the footer - any suggestions how to adjust the footer?

www.dynamicreasoning.co.uk

Thanks!

0 Likes
Highlighted
New Member
1 0 0

 

So this is the same as the accepted answer just add a 2 after it: .page-width2

.page-width2 {
    padding-left: 0!important;
    padding-right: 0!important;
    max-width: 100%!important;
}

 and then go to the custom one you created so if its called Custom go to: page.Custom.liquid

<div class="page-width2">

So also just put a 2 after it.

 

0 Likes
Highlighted
New Member
5 0 0

I am trying this method, however the FAQ page I made did not generate a page.faq.liquid file.

What should I do?

0 Likes