Go to athemes.com

ProModal

See this widget in action here.

The Modal Widget lets you create customizable modal popups to display content, templates, or media on your website.

Activate the Widget

This widget is part of the aThemes Addons for Elementor plugin. To activate it:

  1. Go to the aThemes Addons dashboard in your WordPress admin area.
  2. Search for the Modal widget.
  3. Toggle the switch to activate it. The widget will now appear in the Elementor editor.

Widget Options

Trigger Settings

  • Trigger Type: Select how the modal is triggered: Button, Image, Icon, Text, or Custom Class.
  • Custom Class: Specify a custom class to trigger the modal (only for Custom Class trigger type).
  • Alignment: Align the trigger to the left, center, or right.

Modal Content

  • Modal Type: Choose between Content or Template.
  • Title: Add a modal title with customizable HTML tag.
  • Image: Include an optional image in the modal content.
  • Content: Use a WYSIWYG editor to add rich content to the modal.
  • Template: Select a saved Elementor template to display inside the modal.
  • Animation: Choose an entry animation for the modal (e.g., Zoom In, Fade).
  • Max Width: Define the maximum width of the modal in pixels or percentages.
  • Close Button Position: Place the close button inside, outside, or at the screen edge.

Style Options

  • Trigger: Customize the appearance of the trigger (Button, Icon, Image, or Text).
  • Modal: Adjust padding, border radius, background color, and box shadow.
  • Overlay: Set the overlay background color for the modal.
  • Title & Text: Style the modal title and content with typography, colors, and more.

Conclusion

The Modal Widget is a powerful tool to enhance user interaction and engagement on your website. Use it to display important content, forms, or templates with advanced customization options.