The Content Reveal element allows you to hide content on a page until a user clicks a button to read the rest of the content. This is a container element that you can place other elements inside of.
Content Controls
- Hide By – Allows you to set if you’d like the Content Reveal element to hide content after a certain height or certain number of lines.
- Max Height – Set the Max Height for the content before the Content Reveal element hides any additional content. Visible only if Hide By is set to Height.
- Max Lines – Determine the maximum number of lines that show before content is hidden. This field is visible only if Hide By is set to Lines.
- Scroll To Top When Closed – Decide if the page will scroll to the top of the content after it is closed.
- Labels – Change the Reveal Label and Hide Label for the Content Reveal element.
Design Controls
Content
These controls offer different ways to change and modify the Content Reveal element’s content.
- Transition – set the time it takes for the open and close transition to complete.
Overlay
The overlay settings allow you to define how the element hides the content.
- Alignment – Change the position of the reveal/hide button.
- Button – Define the styles for the button.
- Gradient – Create a gradient to hide the rest of the content until revealed.
Spacing
Spacing controls let you fine-tune the distance around the element and button.
- Container Spacing
- Margin Top – Increase or decrease the space above the element.
- Margin Bottom – Adjust the space below the element.
- Before Button – Set the spacing above the button.
