Solved

How can I increase product page width in Dawn theme?

Sebastian96
Excursionist
20 0 9

Hey,

 

Is there any solution for this in Dawn theme similar like here:

https://community.shopify.com/c/shopify-design/narrative-increase-product-page-width/td-p/1085858

 

Accepted Solutions (2)

PageFly-Richard
Shopify Partner
4287 973 1627

This is an accepted solution.

Hi @Sebastian96 ,

 

This is Richard from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/section-main-product.css->paste below code at the bottom of the file:

[id^="MainProduct-template"] {
    --page-width: 1600px !important;
}

I hope it would help you
Best regards,

Richard | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

View solution in original post

GemPages
Shopify Partner
5589 1261 1218

This is an accepted solution.

@Sebastian96 

 

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>:

 

{% if template contain 'product' %}
   <style>
      #MainContent section.page-width{
          max-width: 1400px;
      }
   </style>
{% endif %}

 

You can replace the number 1400px with another number that fits the page width you want.

 

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 4 (4)

PageFly-Richard
Shopify Partner
4287 973 1627

This is an accepted solution.

Hi @Sebastian96 ,

 

This is Richard from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/section-main-product.css->paste below code at the bottom of the file:

[id^="MainProduct-template"] {
    --page-width: 1600px !important;
}

I hope it would help you
Best regards,

Richard | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

Sebastian96
Excursionist
20 0 9

Hi @PageFly-Richard 

 

Amazing, works perfectly!

 

Thank you.

RyanTheTemp
Visitor
2 0 0

This worked for me. Wondering how to make it align perfectly center. For example, if I exaggerate the pixels to 2500 it lines up on the right more than the left. 

GemPages
Shopify Partner
5589 1261 1218

This is an accepted solution.

@Sebastian96 

 

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>:

 

{% if template contain 'product' %}
   <style>
      #MainContent section.page-width{
          max-width: 1400px;
      }
   </style>
{% endif %}

 

You can replace the number 1400px with another number that fits the page width you want.

 

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