How to show Elementor Popup on link Click of other Element using selector?

Key Takeaways

  • Popup Builder widget allows custom trigger elements using unique CSS classes.
  • Users can open popups by clicking on the Elementor Image widget after adding a class name.
  • The Plus Addons for Elementor requires installation and activation to access the Popup Builder features.
Table Of Content

If you want to show popups on click of custom elements like an image or text rather than the usual popup trigger elements, you can do that easily with our Popup Builder widget using unique CSS classes.

This will give you the flexibility to create custom trigger elements to open and close your popups.

To check the complete feature overview documentation of The Plus Addons for Elementor Popup Builder widget, click here.

Requirement  – This widget is a part of The Plus Addons for Elementor, make sure its installed & activated to enjoy all its powers.

For this add the Popup Builder widget and the widget you want to use as the popup trigger button let’s say the Elementor Image widget, on the page.

First, select the Image widget and go to the Advanced tab and add a class name in the CSS Classes field.

Image widget class

Now select the Popup Builder widget and go to Display Options > On Any Other Element’s Click and click on the pencil icon, and in the Unique Class (Open) field add the same class name.

Popup builder open class new how to show elementor popup on link click of other element using selector? From the plus addons for elementor

Now if someone clicks on the image the popup will open. 

In a similar way you can use a unique class to close the popup this can be useful if you want to use a button widget to close the popup instead of the normal popup close button.

Note: Make sure there are no popup trigger elements on the page, so set the Select Option to Hidden in the Content tab.

About the Author

Photo of Aditya Sharma CMO of The Plus Addons for Elementor
CMO · The Plus Addons for Elementor · 10 years experience

He has spent years in the WordPress ecosystem building, breaking, and optimizing sites until they actually perform. He works at the intersection of speed, growth, and usability, helping creators ship websites that load fast and convert. An active WordPress community contributor sharing through tools, tutorials, and direct collaboration. Tested practice, not theory.

WordPressElementorn8nAIClaudeAutomationServer
Get Instant Answers to all your questions about The Plus Addons for Elementor, trained on 1000+ Docs and Videos

Related Frequently Asked Questions

What should I do if the popup doesn't open when clicking the custom element?

If the popup doesn't open, check that you've correctly added the unique CSS class to both the custom trigger element and the Popup Builder widget. The class name must match exactly in both places. Additionally, ensure that there are no other popup trigger elements on the page; set the Select Option to Hidden in the Content tab of the Popup Builder widget to avoid conflicts.

What is the best practice for naming the CSS class for popup triggers?

When naming the CSS class for popup triggers, choose a clear and descriptive name that reflects its purpose, such as 'popup-trigger-image'. This helps maintain organization and makes it easier to manage multiple triggers if you have several popups on your page. Consistency in naming conventions can prevent confusion and errors.

How do I close the popup using a custom button instead of the default close button?

To close the popup using a custom button, assign a unique CSS class to the button widget and then add that same class in the Unique Class (Close) field of the Popup Builder widget settings. This allows you to control the popup's behavior with your custom button, enhancing user experience.

Are there any limitations when using the Popup Builder widget with custom elements?

One limitation to keep in mind is that the Popup Builder widget should not have any other popup trigger elements on the page. If you have other triggers, they may interfere with the custom elements you've set up. Always set the Select Option to Hidden in the Content tab to avoid this issue.

What happens if I forget to add the CSS class to the Popup Builder widget?

If you forget to add the CSS class to the Popup Builder widget, the popup will not open when the custom element is clicked. This is because the widget won't recognize the trigger without the matching class. Always double-check that both the trigger element and the Popup Builder widget have the same CSS class to ensure proper functionality.

Last reviewed: April 12, 2026