How to make product description wider in debut theme?

Solved
Rust
Tourist
3 0 1

I use the Debut theme with various products on my website : littlepompeo.com (no password)

Product pages with variants (and thus drop down choice buttons) have a wide product description box - eg. https://littlepompeo.com/collections/toys/products/5-7-cm-dog-toy-interactive-rubber-balls-pet-dog-c...

I would like product pages without any variants to also have this wider area for product descriptions. However, currently the ‘no variant’ pages have a much narrower description area because it doen’t have to accommodate the drop down buttons - eg. https://littlepompeo.com/collections/grooming-care/products/1-pcs-multi-purpose-needle-comb-for-dog-...

How can I change the ‘no variant’ product pages on my site to also have a wider product description area like the products that do have  ‘variants’?

I assume I could change the product page template to alway use the ‘product has variants’ template. But I don’t know enough about CSS to do this. Also I don’t know if this is actually the best solution. Maybe there is a more elegant solution that won’t break button alignment etc down the line?

0 Likes
dmwwebartisan
Shopify Partner
7452 1770 2372

This is an accepted solution.

Hey @Rust,

Please add following code in your assets/theme.scss.liquid file.

.product-form--payment-button-no-variants {
max-width: none !important;
}

.product-form__item--no-variants {
max-width: none !important;
}

 

Hope this will work for you.

 

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
Rust
Tourist
3 0 1

Hi @dmwwebartisan!

It worked like a charm!

Thanks

Jow90
New Member
3 0 0

Where to copy and past the code: 

.product-form--payment-button-no-variants {
max-width: none !important;
}

.product-form__item--no-variants {
max-width: none !important;
}

 

????

0 Likes
Natztech
Shopify Partner
1436 404 960

hello @Jow90 


Please provide website url and if your store is password protected then also provide password So I will check and provide a solution here.

Want to theme customize contact us E-mail : natztech2312@gmail.com
If helpful then please Like and Accept as Solution

PageFly Advanced Page Builder- My favorite drag and drop page builder - Visit the Shopify app store
0 Likes
Jow90
New Member
3 0 0

 

How can I change the ‘no variant’ product pages on my site to also have a wider product description area like the products that do have  ‘variants’?

0 Likes
Natztech
Shopify Partner
1436 404 960

hello @Jow90 

do you want to look like this https://nimb.ws/pqak7v 

please contact  natztech2312@gmail.com

 

Want to theme customize contact us E-mail : natztech2312@gmail.com
If helpful then please Like and Accept as Solution

PageFly Advanced Page Builder- My favorite drag and drop page builder - Visit the Shopify app store
Jow90
New Member
3 0 0

Yeah, something like that!
To be able to have 2 3 images near each other and the description will be under the images

0 Likes