1. Documentation
  2. Site setup
  3. Popup & off-canvas builder

Popup & off-canvas builder

Effectively utilize popups and off-canvas windows to display crucial information and conversion-oriented messages on your WordPress website. Follow these simple steps to create engaging popups and off-canvas elements using the Popup Modal widget in Elementor.

Step 1: Add the Popup Modal widget

Follow the instructions below to insert a Popup Modal widget anywhere onto your page canvas.

  1. Edit any page with Elementor.
  2. In the left side panel, search for the Popup Modal widget.
  3. Drag and drop the widget onto the desired area of your page.

Step 2: Customize the Popup Modal widget

Follow the instructions below to customize the Toggle Button and the Modal Window.

Customize the Toggle Button

  1. Select Button as the Toggler Type.
  2. Choose Modal or Slide from the Popup Show Type.
  3. The popup toggle button will appear on your page canvas.
  4. Expand the Popup Toggle Button section and configure its appearance.

Customize the Modal or Slide window

  1. In the Popup section, adjust the widget settings, set the maximum height, enable a screen overlay, show the close icon, and add pre-designed headers & footers.
  2. Under Overlay, choose whether the popup closes when clicking anywhere on the overlay.
  3. In the Close Icon section, customize the close icon’s position and select a custom icon from the library.
  4. Explore options in the Header & Footer sections for further customization.
  5. Under the Content section, switch on the “Enable Template” option to create custom content for the popup modal using any Elementor widget.

Following these steps, you can create engaging and visually appealing popups and off-canvas elements on your WordPress website. Utilize these features to communicate with your audience and enhance user interaction effectively. Happy designing!

Was this article helpful?