(function openLouie() { let louie = document.getElementById("Dropdown-Toggle-14"); louie.classList = "host-toggle w-dropdown-toggle w--open"; console.log(louie); })();
Collapse

It is the element that allows content with horizontal blocks to be displayed in a collapsible and expandable area. Sections with mostly titles displayed, when Expanded, other content contained in them is displayed. It is mostly used in areas such as multiple description topics or frequently asked questions.

Adding Collapse

Drag and drop the Collapse element to the screen from the Elements panel. Clicking on one of the titles opens the detail panel. You can add an element directly here, or you can create more complex sections by adding a Row. Collapse element must be added to a container element like other elements. Although we generally design the screen by adding it to the Row, they can also be added to other container type elements. You can also drag and drop elements other than Header and Footer elements into the Collapse panel.

Properties

You can add text and icons inside the Collapse element. You can give role-based authorizations to the element as well as set its visibility with show/hide/conditional options.

COLLAPSE

Open the Collapse section of the Properties panel. From here, you can add, delete, or reorder new collapse panels, and select existing collapse panels.

ACCORDION

When one of the panels in Collapse is opened, you can collapse the others open.

COLLAPSE PANEL

You can selectively manage the panels you add in Collapse. When you select one of the panels, you can change the Header, Key and Show Arrow properties. You can also make styling settings on the selected CollapsePanel.

AUTHORIZATION

You can use the authorization options for the panel element.

VISIBILITY

You can manage the visibility of the element. It is always visible, hidden, or you can make it appear or hide depending on a condition.

Styling

You can further edit the Collapse element by adding a frame, fill color, border, or shadow.

LAYOUT

You can make visual adjustments such as environmental interior spaces and sizing. Depending on the collapse size, you can align the elements in it.

TEXT

You can adjust the Collapse text and the properties such as color and size of the icon with the text section.

FILL

You can add color or image to the Collapse body.

BORDER

You can add lines to the outer edges of the Collapse and give curves to the corner.

SHADOW

You can add collapse shadows.

Simplicity Meets High Performance

Free edition subscription
Keep your work
No credit card required to try