Re: Adjust the width of 'Collapsible Content' on product page - Dawn 12.0

Solved

Adjust the width of 'Collapsible Content' on product page - Dawn 12.0

coalfield
Explorer
49 3 16

I am looking to adjust the width of the 'Collapsible Content' Box within my product pages on store, currently this object does not fill the regular width of the page and it looks a little off.

 

Can anyone please help advise?  See image attached what I am trying to achieve 🙂

 

Example URL: https://gpuconnect.com/products/pld10010s12hh-95mm-dc12v-0-40a-rtx3060-rtx3070-vga-fan-for-msi-rtx-3...

 

Screenshot 2023-11-23 104828.jpg

 

 

Accepted Solution (1)
Dan-From-Ryviu
Shopify Partner
8382 1650 1661

This is an accepted solution.

So please go to your Online store > Themes > Edit code, open section-main-product.css, add this code at the bottom and save the file

.collapsible-content-wrapper-narrow { max-width: 1130px !important; }

- Helpful? Like and Accept solution to let me know or Buy me Coffee ❤️!
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Enjoy 1 month of Shopify for $1. Sign up now.

View solution in original post

Replies 6 (6)

Dan-From-Ryviu
Shopify Partner
8382 1650 1661

Please add this code to theme.liquid file before </head> tag 

{% if template == 'product' %}
<style>
.collapsible-content-wrapper-narrow { max-width: 1130px !important; }
</style>
{% endif %}

Screenshot_3.jpg

- Helpful? Like and Accept solution to let me know or Buy me Coffee ❤️!
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Enjoy 1 month of Shopify for $1. Sign up now.

coalfield
Explorer
49 3 16

Unfortunately it doesn't seem to have worked 😞

Dan-From-Ryviu
Shopify Partner
8382 1650 1661

This is an accepted solution.

So please go to your Online store > Themes > Edit code, open section-main-product.css, add this code at the bottom and save the file

.collapsible-content-wrapper-narrow { max-width: 1130px !important; }

- Helpful? Like and Accept solution to let me know or Buy me Coffee ❤️!
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Enjoy 1 month of Shopify for $1. Sign up now.

coalfield
Explorer
49 3 16

Thank you this worked!  I take it I should remove the previous bit of code that didn't work from  theme.liquid ?

Dan-From-Ryviu
Shopify Partner
8382 1650 1661

For sure.

- Helpful? Like and Accept solution to let me know or Buy me Coffee ❤️!
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Enjoy 1 month of Shopify for $1. Sign up now.

coalfield
Explorer
49 3 16

Unfortunately this doesn't appear to work any more using Dawn 13.0.1.  Any ideas?

 

EDIT: still working was a typo sorry!