# Expandable text box on click

**URL:** https://forum.readymag.com/t/expandable-text-box-on-click/4567
**Category:** Layouts
**Created:** [March 19, 2025, 9:43am UTC](https://forum.readymag.com/t/expandable-text-box-on-click/4567 "2025-03-19T09:43:35Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![Vicky](https://avatars.discourse-cdn.com/v4/letter/v/b19c9b/32.png) [@Vicky](https://forum.readymag.com/u/Vicky)
#### Post date: [March 19, 2025, 9:43am UTC](https://forum.readymag.com/t/expandable-text-box-on-click/4567/1 "2025-03-19T09:43:35Z")

</div>

Hi everyone I need your help.  
I have a text box with the phrase “Discover more”. What I’d like to happen is:

- When someone **clicks** on “Discover more”, the box should **expand** and reveal more text.
- When they **click again** , the box should **collapse** and hide the extra content.

Is this possible to do directly in Readymag? If so, could anyone guide me through the steps?  
Thanks for your help 🙂

---

<div class="post-metadata">

### Author: ![neueMeta](https://sea1.discourse-cdn.com/flex015/user_avatar/forum.readymag.com/neuemeta/32/92_2.png) [@neueMeta](https://forum.readymag.com/u/neueMeta)
#### Post date: [March 20, 2025, 9:16am UTC](https://forum.readymag.com/t/expandable-text-box-on-click/4567/2 "2025-03-20T09:16:07Z")

</div>

well there are some options here…

you could place your whole text and hide it behind a shape, above that shape lays the button “discover more”. now add a animation for the covering shape to change its opacity, or move out of view revealing the extra text. Then you would also set up an animation onto the button to move out of view, or to the end of a text. Both the button and the shape should has the button as a trigger.

you could also let the extra text fade in “on click” on clicking the button.  
Its a bit depending on how your design looks.

what you cannot do is to expand the height of your whole page dynamically if the extratext is shown. so you would need to work around this with a smart positioning of your elements. Youc could also fill the place, where the extra text will appear with a graphical element that fades out if you expand the visibility of your text.

---

<div class="post-metadata">

### Author: ![Paul\_99](https://avatars.discourse-cdn.com/v4/letter/p/6a8cbe/32.png) [@Paul\_99](https://forum.readymag.com/u/Paul_99)
#### Post date: [April 2, 2025, 12:41pm UTC](https://forum.readymag.com/t/expandable-text-box-on-click/4567/3 "2025-04-02T12:41:00Z")

</div>

Just been trying to achieve the same thing I think - was trying to emulate a FAQs page along these lines:-

> **[FAQ](https://liquiddeath.com/pages/faq)**
>
> Don’t be scared. It’s just water. And iced tea. Murder your thirst. Death to plastic.

Only just started using Readymag this past week and was really impressed with it but increasingly finding things like this that should be simple but don’t seem to have a workaround. Ah well..
