collapsible product description (Dawn)

Topic summary

Goal: Implement a partially expanded, collapsible product description in the Dawn theme where text initially shows with a fade and a “see more” button to reveal the full content.

Current vs desired: The poster shows their current result and a mock of the desired look; images are central to understanding the visual behavior. A live product page link is provided for context.

Proposed approach: Replace Dawn’s default collapsible section with the full product description, constrain its visible area via CSS (a styling language for layout/visuals) using a limited height, and add a “load more”/button to expand to full height on click.

Notes/limitations: The reply focuses on CSS height limitation and a button-triggered expansion; it does not detail how to achieve the fade effect (e.g., overlay/gradient) or provide specific code snippets.

Status: No concrete code provided yet; implementation details (exact CSS/JS, fade effect) remain open. No final resolution or confirmed fix in the thread.

Summarized with AI on December 24. AI used: gpt-5.

Hello,

I would like to create a collapsible content product description that is open automatically but doesn’t open all the way so the text fades and you can click a button to see all the text.

This is what i’ve been able to do:

This is how i want it to look like:

My store: https://kidos.se/products/emil-randig-strandstol-taupe

Thanks for help!

Hi,

To achieve that, you need customize code,

Remove the collapsible default part instead of that you show all product description and then limit height of that part by css, and when user click to button load more, you make it show full.