• Stylish informational text-based popovers
  • Style button to match your site design
  • Align toggle button to the left, center or right
  • Orient popover to work with your content
  • Clicking button toggle the visibility of the Popover


Below we’ve included a few examples of the Popover stack, with various orientations and button stylings, inside of a Columns stack.

Using Popover


This is the text that will appear at the top of your Popover. It acts as the header for your Popover content.

This is the main text of your Popover. The message, instructions, information, etc you wish to covey to the visitor when they click on the Popover toggle button.

Allows you to determine which direction, in relation to your toggle button, that your Popover will appear.


Button Text
The text that will appear on the button that triggers your Popover

Allows you to set the justification of the Button itself. You can set the alignment to Left, Center or Right.

Button Size
Choose the size of your button. You can opt of a Small, Standard or Large button size.

Button Style
Set the color of the button to match your site using one of Foundry’s color swatch presets or make use of custom color pickers.

Block Button
Enable to make the 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.

When using one of the color swatch presets you can use the Outline feature to inverse the button’s style.

Sign up for The Forge newsletter

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

© 2006-2018 Elixir Graphics | Contact Us