Shopify themes, liquid, logos, and UX
I need to expand the collapsed text on my product descriptions in warehouse theme as customers are missing the 'view more'.
Can anyone help? It seems simple and certainly very useful, but I can't find anything that works. Thanks in advance for your help.
Solved! Go to the solution
This is an accepted solution.
Actually, it did -- check any product under Gowns -- all descriptions are fully expanded.
Now, the code I gave you only applies to product description (as that's what you mentioned), it does not affect the "Info You Need To Know" cards, etc.
If you want all your expandable elements on product page be expanded, use this CSS code instead of the one I gave you:
.template-product .expandable-content {
max-height: none;
}
.template-product .expandable-content__toggle {
display: none;
}
Sorry for facing this issue, it's my pleasure to help us.
Welcome to the Shopify community!
and Thanks for your Good question. 😊
Please share your site URL,
So I will check and provide a solution here.
@Ee2016 Check your Product page settings under Theme=> Customize.
Under "Content" there is a "Display mode" -- set it to "Show All".
Hi Tim,
I don't seem to have a content section to select show all? I did find in the theme settings yesterday where to set it not minimise the description, but that doesn't remove the 'view more' part, it merely collapses the entire description section or has it like it is, with part of the description hidden.
We are getting emails with people missing product info that is in the description because they're missing the 'view more' button, so I would love to just have it display the entire thing if possible & save the clicking.
No, it's not in theme settings, but section settings.
Can't tell what version of the theme you have, but for the current one you should click "Product page" button on the left (you should see it since your picture is taken on the product page). Then, for me it looks like this:
However, if you can't find this in your theme, problem can still be fixed with CSS -- put this to the very end of your theme.scss.liquid asset
.product-block-list__item--description .expandable-content {
max-height: none;
}
.product-block-list__item--description .expandable-content__toggle {
display: none;
}
Thank you for the suggestions.
I don't have that option in the content section, I'm not sure how to tell what version of warehouse it is. We acquired this shopify as part of a business purchase, and while I've customised a lot, the basis of it is still whatever was originally set up by the previous owner.
I added the code to the theme.scss.liquid asset but it hasn't made any difference to the website displaying.
This is an accepted solution.
Actually, it did -- check any product under Gowns -- all descriptions are fully expanded.
Now, the code I gave you only applies to product description (as that's what you mentioned), it does not affect the "Info You Need To Know" cards, etc.
If you want all your expandable elements on product page be expanded, use this CSS code instead of the one I gave you:
.template-product .expandable-content {
max-height: none;
}
.template-product .expandable-content__toggle {
display: none;
}
Thank you so much! I was looking at the Info.... card & it wasn't expanded 🙂 Thank you again.
Thanks to everyone who participated in our AMA with 2H Media: Marketing Your Shopify St...
By Jacqui Sep 6, 2024The Hydrogen Visual Editor is now available to merchants in Shopify Editions | Summer '...
By JasonH Sep 2, 2024Note: Customizing your CSS requires some familiarity with CSS and HTML. Before you cust...
By JasonH Aug 12, 2024