Have your say in Community Polls: What was/is your greatest motivation to start your own business?

Re: Increase Page width

Solved

How can I increase the width of my 'Craft' theme pages?

designbymeg
Shopify Partner
20 0 3

Hi community,

 

I'm looking to increase the width of my about and contact pages, similar to the 1600px width I have set for the home page theme. I am using 'Craft' Theme. See image attached for how narrow to about page is currently at. 

 

Wondering if someone can please assist with code for this?

 

Thank you 🙂

 

Screen Shot 2023-09-11 at 10.12.19 am.png

Accepted Solution (1)
Dan-From-Ryviu
Shopify Partner
10261 2039 2110

This is an accepted solution.

Hi, you can change width of that page by opening base.css file, go to 155 line, change 

max-width: 72.6rem;

to 

max-width: 1600px;

Screenshot 2023-09-11 at 11.03.35.png 

- Helpful? Like and Accept solution! Or Support me: Buy Coffees
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

View solution in original post

Replies 4 (4)

Dan-From-Ryviu
Shopify Partner
10261 2039 2110

Hi @designbymeg 

Could you share your page link so I can provide the code?

- Helpful? Like and Accept solution! Or Support me: Buy Coffees
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

designbymeg
Shopify Partner
20 0 3
Dan-From-Ryviu
Shopify Partner
10261 2039 2110

This is an accepted solution.

Hi, you can change width of that page by opening base.css file, go to 155 line, change 

max-width: 72.6rem;

to 

max-width: 1600px;

Screenshot 2023-09-11 at 11.03.35.png 

- Helpful? Like and Accept solution! Or Support me: Buy Coffees
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

INA_MSWEB
Shopify Partner
1281 144 167

Hi @designbymeg 


I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.

Please add this css in your bottom of the base.css file:

@media screen and (min-width: 990px) {

.page-width--narrow {max-width: 100rem !important;}

}

 

 

Regards,

San

If it’s helpful to you, please mark it as a solution.  


Need Help with Shopify Design, Migration, Speed, or Custom tasks?  
email: hi@mswebdesigner.com
Try Our Conversion Booster app to get more sales | Connect Our Founder Linkedin