General
The Unfold widget lets your visitors expand a container to reveal the whole content of a widget.
Why use Unfold?
Sometimes you have a lot of text, but you know that only some of your audience would be interested in reading more. This makes sure you don’t force your visitors to scroll more than needed or even distract their attention with too much content.
How it works
This widget adds a button that triggers a customisable animation that reveals the content of the widget. The content of the widget is a WISWYG editor with shortcode support. You add the content, set how much of the it should be seen by default and you’re good to go. The widgets has lots of effects for the animation as well as a mode where you can calculate the number of paragraph lines to show.
Settings
- Content
- Content — You content and content display preferences
- Visible — Control to select what type of calculation to use for the visible amount
- Percentage — Set the visible amount to a percentage of the height of the content.
- Lines — Show a specific number of paragraph lines. This works if you have paragraphs inside the WISWYG editor but might fail if you’re using images or other content.
- Visible Percentage [available if Visible is set to Percentage] — The percentage of the total height of the content to show when not revealed / unfolded.
- Visible Lines [available if Visible is set to Lines] — How many lines of text to show before revealing / unfolding.
- Visible — Control to select what type of calculation to use for the visible amount
- Settings — Some controls to adjust behaviour / animation. These apply for either the folding or unfolding animation
- Duration — How long should the animation take in seconds
- Animation — The animation to apply
- Easing — What ease to apply for the animation.
- Separator — The separator is by default a gradient from transparent to white, located above the button so as to create the illusion that the text is faded out on white backgrounds
- Hide Separator — You can hide the separator all-together.
- Button — Settings for the button a visitors click to unfold / fold the content
- Content — You content and content display preferences
- Style
- Separator
- Height — The height of the initially gradient separator between the text and the button.
- The other style controls for this widget are straightforward. If you don’t understand how to achieve something please let us know.
- Separator
FAQ
Can I use an Elementor template inside the content?
Yes, but you need to use a shortcode. Go to Elementor > My Templates, locate your template and copy the shortcode on the right-hand side. Paste into the WISWYG editor inside the widget editor panel.