---
title: "How to add Read More Toggle Button to Text in Elementor?"
url: https://theplusaddons.com/docs/add-read-more-toggle-button-to-text-in-elementor/
date: 2023-03-06
modified: 2026-05-14
author: "Aditya Sharma"
description: "Are you looking to add a read more toggle button to text in Elementor? Showing a large block of text all at once can push other content out of view..."
image: https://theplusaddons.com/wp-content/uploads/2023/03/How-to-add-Read-More-Toggle-Button-to-Text-in-Elementor_-1024x536.jpg
word_count: 720
---

# How to add Read More Toggle Button to Text in Elementor?

## Key Takeaways

- The Unfold widget in The Plus Addons for Elementor adds a read more button to any text block in the Elementor editor.
- The Plus Addons for Elementor Pro includes custom toggle position options for the Unfold widget, allowing placement above, below, or inline with content.
- Users can set the initial container height in the Unfold widget to control how much text is visible before the read more button appears.
- The Unfold widget supports four content sources, including adding content directly in the built-in text editor and using saved Elementor templates.

Are you looking to add a read more toggle button to text in Elementor? Showing a large block of text all at once can push other content out of view and overwhelm visitors. A read more toggle lets users expand the full text on demand, keeping the page layout compact while giving readers access to all the information.

The Unfold widget in The Plus Addons for Elementor lets you add a read more button to any text block in the Elementor editor. It controls how much text is visible initially and reveals the rest when visitors click the toggle.

*To check the complete feature overview documentation of The Plus Addons for Elementor Unfold widget, [click here](/docs/unfold-elementor-widget-settings-overview/).*

**Requirement** – This widget is a part of The Plus Addons for Elementor. Make sure it is installed and activated.

**Best Used For:**

- Long product descriptions on WooCommerce pages where you want to show a preview without scroll fatigue

- Blog post archives and listing pages where each post has an expandable content preview

- Team or portfolio pages where each bio starts collapsed and expands on click

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-widget/unfold/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

### Add a Read More Button to Text

**Note:** This feature is available in [The Plus Addons for Elementor Pro](https://theplusaddons.com/pricing//?utm_source=tpae&utm_medium=docs&utm_campaign=text) only.

Add the Unfold widget to the page. In the **Title** field, enter a heading for the collapsed content section. Use this when you want to label what the reader is about to expand, such as “About the Author” or “Full Product Description”.

From the **Select Source** dropdown, choose **Custom Content** to add text directly in the widget editor.

In the **Content** section, enter the text you want to show when the visitor clicks the read more button. This is the expanded content that stays hidden until triggered.

![unfold custom content](https://theplusaddons.com/wp-content/uploads/2023/03/unfold-custom-content.png)

In the **Content Options** tab, configure the button placement and the initial container height.

Set the **Button Placement** to position the toggle button above or below the collapsed text.

Set the **Container Height** to control how much text shows before the read more button appears.

This is useful when you want to show the first few lines as a preview for longer text blocks. Adjust these values separately for desktop, tablet, and mobile.

![unfold button placement container height](https://theplusaddons.com/wp-content/uploads/2023/03/unfold-button-placement-container-height.gif)

The toggle is now active on the page. Visitors see the initial text height you set, with the read more button below to expand the full content when needed.

You have now added a read more toggle button to text in the Elementor editor using the Unfold widget in The Plus Addons for Elementor.

![unfold text content demo](https://theplusaddons.com/wp-content/uploads/2023/03/unfold-text-content-demo.gif)

For a structured expandable content layout with multiple sections, see [Elementor Accordion Widget Settings Overview](https://theplusaddons.com/docs/elementor-accordion-widget-settings-overview/).

To add a read more button to Elementor blog post listings instead, see [How to Add Read More Button in Blog Posts in Elementor](https://theplusaddons.com/docs/add-read-more-button-in-blog-posts-in-elementor/).

### Unlock These Pro Unfold Enhancements

The Plus Addons for Elementor Pro includes these additional Unfold controls:

#### Custom Toggle Position

Set the toggle button position to above, below, or inline with your content block. Use this when the default placement does not match your page layout.

#### Dynamic Labels & Icon Support

Enter custom text for the expand and collapse labels, such as “Read More” and “Read Less”. Add an icon or Lottie animation to the toggle button. Use this when you want the button to match your brand style instead of using default text.

#### Fade & Slide Animations

Set the animation type for the expand and collapse transition. Choose from fade, slide, or a combination of both, and adjust the animation duration to match your page speed.

#### Initial Height & Reveal Controls

Set the collapsed section height in pixels or as a percentage. When the visitor clicks the toggle, the widget reveals the remaining content. Use this when you need precise control over how much preview text shows before the read more button.

#### Flexible Content Sources

The Unfold widget supports four content sources. Add content directly in the built-in text editor. Select any saved Elementor template to use a prebuilt layout as the collapsible section. Use an inner section widget to build a custom layout inside the collapsible area. Turn an Elementor Flexbox container into a collapsible container.

Upgrade to [The Plus Addons for Elementor Pro](https://theplusaddons.com/pricing//?utm_source=tpae&utm_medium=docs&utm_campaign=text) to access all the Unfold features described above, plus 120+ premium widgets and a 60-day money-back guarantee.

Also, read [How to make a collapsible Elementor Flexbox container](https://theplusaddons.com/docs/collapsible-elementor-flexbox-container/).

## Frequently Asked Questions

**Q: What should I do if the read more toggle button isn't appearing in Elementor?**
A: If the read more toggle button isn't showing, ensure that you have installed and activated The Plus Addons for Elementor, as the Unfold widget is part of this plugin. Additionally, check your settings for the initial container height; if it's set too high, the button may not be visible. Adjusting this value can help ensure that the button appears correctly.

**Q: Can I use the read more toggle button for product descriptions on WooCommerce pages?**
A: The read more toggle button is ideal for long product descriptions on WooCommerce pages. It allows you to show a preview of the description without overwhelming visitors with too much text at once. This keeps your layout clean and encourages users to engage with your content.

**Q: What are the best practices for setting initial height in the Unfold widget?**
A: Setting an appropriate initial height is crucial for user experience. A good practice is to display a few lines of text that provide context without revealing everything at once. This encourages users to click 'read more.' You can adjust these values separately for desktop, tablet, and mobile views to ensure optimal display across devices.