Modals

Use Bootstrap Modals

Online Docs Available Looks like you are looking at the offline docs. You can find possibly more up to date docs online here

Modals

Modals are streamlined, but flexible, dialog prompts with the minimum required functionality and smart defaults. Omega offers the modal functionality under the Bootstrap Framework. Modal Bootstrap

Creating a modal

The Modals menu option on the left is where you add modals. To add a new modal, select the Modals > Add New option from the left hand WordPress menu. When you create a new modal, you need to setup a few more options. Single Service

  • Fade Modal Apply a CSS fade transition to the modal.
  • Modal Size Modal size can be large, normal or small.

Adding content to modals

You can add content to a modal just as you would for all custom post types and pages. You can use Visual Composer for that. To enable Visual Composer for modals, go to Visual Composer > General Settings and click on the oxy_modal content type.

When using Visual Composer to add content to a modal, make sure that from the settings of the rows you have the Section Width option set to Full Width, so that content will not overflow outside the modal.

Trigger the modal

There are two ways to trigger the modal popup. One of them is via the Button shortcode. Once you add the button to a page, edit the shortcode's settings. From the Open Modal option you can pick up a modal that you have created. Once you have done that, the Link option will get overriden.

Modal Shortcode

You can also trigger the modal via a menu item. If you go to Appearance > Menus, you need to add/edit a menu item. Once you expand that item, you should see a Modal option. You can pick up a modal from the dropdown. This menu item will now trigger the selected modal.

All types of menu items can be used.

Modal Menu