With our most recent Page Builder release, you can now add modals (pop-up windows) to chapter and event pages! Modals can draw attention to relevant information, such as event tickets, or display related information, such as a speaker bio, without taking the user to a new webpage. You can launch a model using any button or container on Page Builder.

A modal can be applied to the Page Builder canvas in two ways: 

1. Launch a modal from a button 
2. Launch a modal from a modal

Launching a modal from a button

1. Select a button on the Page Builder canvas
2. Select "open modal" from the actions tab
3. A black modal button appears on the canvas after applying the "open modal" action to the button. Click the icon. 
4. When the modal overlay appears, add items from the left panel to the content section of the modal. 

Launching a modal from a container 

1. Select a container on the Page Builder canvas
2. Select "open modal" from the actions tab
3. A black modal button appears on the canvas after applying the "open modal" action to the button. Click the icon. 
4. When the modal overlay appears, add items from the left panel to the content section of the modal. 

Modal characteristics

• The modal's contents determine its height and width. The only limit applied is a 16px border margin. 
• If the modal's contents expand beyond the height of the page, then the modal's content becomes scrollable. 
• A modal's content is auto-centered, both vertically and horizontally.
• Users can dismiss the modal on a rendered page by clicking the X or clicking the page content outside the modal.