Skip to main content
Expandable section
Diego Muralles avatar
Written by Diego Muralles
Updated over 3 months ago

The Expandable Section is a powerful tool designed to enhance user interaction and content organization on your website. This component enables you to create collapsible content sections that users can expand or collapse based on their preferences. This feature significantly improves the usability and accessibility of your content, providing a more streamlined and user-friendly browsing experience.

Configuration options

Parameter

Description

Desktop

Set the collapsed height of the section in pixels for the desktop layout

Tablet

Set the collapsed height of the section in pixels for the tablet layout

Mobile

Set the collapsed height of the section in pixels for the mobile layout

Trigger

Choose an element as the trigger to expand and collapse the section

Easing

The acceleration of the transition animation

Duration

The length of the animation in milliseconds

Organizing Expandable sections

Once an Expandable section has been added it'll appear in the layers panel, you can drag it above or below other sections to place it where you need it in your project. Follow the steps below to learn how to do it.

  • Select the section in the layers panel

  • Click and hold it

  • Drag it above or below the section you want

Did this answer your question?