Click the button below labeled "Open Example Modal" to trigger the overlay dialog and reveal the popup modal’s content.
Button Label
Allows you to customize the text for the button which is used to trigger the modal overlay.
Size
Set the size of your button. Choose from Small, Standard or Large.
Style
Set the color of the button to match your site. Use one of Foundry’s color swatch presets or make use of custom color pickers. You can also opt for a gradient background which will allow you to use a series of custom color pickers to design your own gradient.
Alignment
You can choose to align the Modal’s trigger button to the left, center or right.
Block Button
Enable to make the Modal button span the entire width of its parent stack. The button’s width is flexible when enabled and will size down to fit the available space.
Outline
When using one of the color swatch presets you can use the Outline feature to inverse the button’s style.
Enable Close X
Include a small X in the upper right corner of the modal dialog that allows the visitor to close the modal.
Size
Choose from three different modal dialog sizes. Small, Standard and Large.
Include...
Choose whether to add a header or footer to your modal dialog popup. The header can contain custom text. The footer can contain either text or a button that allows the visitor to close the modal. You can also customize the close button’s text as well as its alignment.
Button Alignment
When the Close button is enabled within the Footer this feature allows you to align said button to the left, center or right.
Alignment
Allows you to set the justification of the Modal’s header text. You can set the alignment to Left, Center or Right.
Animate
Enables a simple animation that makes the modal dialog slide down from the top of the browser window.
Collapse Modal
Allows you to collapse the drop zone for the modal content in Edit Mode, freeing up space to more easily work on building your pages and rearranging your stacks within them.
Stay up to date on future versions of Foundry, as well as important news, updates and more!
This site is built using Foundry for RapidWeaver