Modal (6 min)

Modals are content windows that overlay the main content. The main content will be disabled while the modal is displayed.

To insert a modal:

1. Navigate to the elements menu and select the Containers tab. 

2. Drag-and-drop the modal container onto the canvas.

We recommend you have your layer list displayed to easily navigate to your modals. 

The modal comes with an automatic autofit container to organize your content. You can add any element to your modal.

You can configure whether your modal shows and hides using an interactive element. We have used buttons to demonstrate this.

1. Click the Interactivity icon in the button menu.

The On Click Action window opens.

2. Select the Start + icon, choose Modal as the node, and click Next.

3. Turn the Enable toggle switch on.

4. Choose your modal using the dropdown.

5. Choose the action you want to perform when the user clicks the button. Click Next.

6. Type in a Tag and click Insert. The same steps can be followed when inserting a button into the main page or adding a button to a modal.