I’m using the Dawn theme and I have this custom code in the main-collection-banner.liquid file. It’s supposed to show a truncated version of the collection description with a “show more” button to expand and show the full description.
{%- if section.settings.show_collection_description -%}
{{ collection.description | truncatewords: 40 }}
{{ collection.description }}
{%- endif -%}
However, the web page shows both the short and long descriptions and clicking the button does nothing. I have tried putting the javascript in many different places both within the same file and in other places like theme.liquid and global.js.
I have this same code in my Supply theme on Shopify (an earlier theme) which works fine. I’m hoping someone can help me get this working or find another solution to hide/show a short or long description. Thanks!
This part should probably be display= ‘none’; instead of backgroundColor .
document.getElementByID('descriptionFull').style.backgroundColor = 'none';
Beyond that always keep in mind others do not see what you see or know what you know.
Always provide relevant context so others can understand, inspect or reproduce issues.
Context such as: For theme problems always provide store url or preview urls, exact demo urls, storefront password if any, theme name, example code, are any apps involved , etc . For browser problems browser name& version, operating system, etc.
https://community.shopify.com/c/shopify-design/help-us-help-you/td-p/668159
That means don’t just link to a website homepage, link to the exact page exhibiting a problem.
Good Luck.
FYI: bear in mind show-more fixes like this may have accessibility problems, for further research see disclosure toggle accessibility patterns
Could you share your page to check?
My mistake, I was testing something and forgot to change it back. No matter what I do, I can’t get Shopify to read the javascript, like if I changed the background color or the function of the button. Here’s a link to the store preview.
https://9a387419ggxp387b-18140429.shopifypreview.com/collections/didgeridoos
Could you can try to add this code before your code and check again?
Thanks, but I tried it and we’re still unsuccessful.