When to use the Modal Pop-Up Window component

Use this component to activate a modal pop-up window when the user clicks on a text, image, or button link.

The modal window can contain text and image content to supplement existing page content without sacrificing screen space.

Usability guidance

The modal pop-up window will appear above all existing page content when activated by the user.

The content in the modal should only serve a supplement to the existing page content. 

Implementation

1. Open a page in Modern Campus CMS and enter editing mode.
2. Place your cursor where you would like to place a text, button, or image link that will trigger a pop-up modal window.
3. From the toolbar, select the component icon  , which resembles an atom symbol.
4. From the list of components, select the Modal Pop-Up Window component.
5. Fill in the required fields and select your options.
6. Save and preview.

Trigger Options:

Trigger the modal via a button, text, or image link.

Modal Size Options:

Click to view each modal size.