How to Create Free Elementor Modal Popups without Elementor Pro (Trigger Popup on Button or Image click

In this article, you’ll learn how to create free Elementor modal popups using Premium addons for elementor (free). I’ll also show you how to trigger popups on button or image click. Let’s get started.

Note: the digits in brackets e.g. (00:02) indicate the minutes of that exact explanation in the video so you can easily jump to that section and follow along.

Video: Free Elementor Modal Popups Tutorial

For this tutorial, you’re just going to need the free version of Premium Addons for Elementor. To get this, go to your dashboard under Plugins > Add New, search for Premium Addons for Elementor then install and activate it (00:59)

Nlb2Ulw29Dps Ejy8cvo 88eVM917I0 8uUpo6W8KBZo5FyPCSVeRUyVN4AvOeU9RJLyMHk9jKYZ84UZlaExPB wyB hg8N8EqkILs4mTE6TBOBdp 1B63lb8QJjCc0o67MnYpsy

After you install and activate your plugin, it will show up on your menu.

Go to Pages and open up any page with Elementor where you would like to add your popups.

Add a Text Modal Popup

Add a new section in your page, then go to your Widgets area and scroll down to the Premium Addons section, look for the Premium Modal Box widget and drag it to your canvas (01:45)

wse7Fk8D0djMr3cQHkUayzLvUAWQPMOJj9CIWnCrwPeEw64OCSHp4Q58c9Vd3unk6Re

Select the widget and go to the Edit Premium Modal Box area on the left, under Content you can enable the Header option if you want to display a header, you can add an icon from your Icon Library under the Icon option, and under Title, you can edit your popup title to for example ‘Text Modal Popup’.

Under Content to show, select Text Editor and you can add your content.

You can also enable the Upper and Lower Close Buttons.

Under Style, you can make changes to your text color, typography, buttons and so on to your preference, when you’re done click Update (03:52)

Add an Image & Template Modal Popup

Add a new column to your section, then under the Widgets area drag the Premium Modal box widget to the column.

In the Edit Premium Modal Box area, under Content > Display Options > Display Style, select image, then select and insert an image from your Media Library.

Under Content > Content to show, select Elementor Template, then select the template you want to display from your Templates Library, so when someone clicks on the image, the template shows up (05:00)

Free Elementor Modal Popups GIF

In closing

That’s how you can create free elementor modal popups and use them with text, images and templates on your Elementor website.

For any questions or comments, let me know in the comments section below, and don’t forget to subscribe to my newsletter and youtube channel for more of these tips and tutorials.

Also Read. . .

How To Delete A Facebook Group in 2024?

Facebook allows for group interactions through its Facebook groups feature.  Facebook groups are created for specific reasons and attract like-minded people.  At some point, however, you may need to get rid of the group for

Read More »
Newsletter Subscription (EF)
Hamza
Hamza
Hamza comes from a design background with over 10years of experience in Web and Media design. He enjoys making web design videos on his YouTube channel GoTechUG. He also writes web design articles on this website. In his free time, Hamza loves riding a bicycle, swimming or going hiking.

Leave a Comment

Your email address will not be published. Required fields are marked *

Search

Recommended Tools

Hostinger offers premium WordPress hosting for small and medium size websites at an affordable price rated 4.5/5 on Trustpilot

Elementor is the WordPress most popular page builder with over 10 million active users