Click Trigger Settings Cheat Sheet
Click Trigger Settings #
Popup Maker has General and Advanced options for your Click Open trigger.
Under the General settings, you can:
- Add extra CSS selectors to launch your popup
- Choose which cookies you want to prevent the repeat displaying of your popup
In the Advanced settings, you can turn on the browser's default click handling.
To get to these settings, you'll need to edit an existing Click Open trigger or add a new one.
Let's go over each setting.
General #
After adding or editing a Click Open trigger, you'll see the Click Trigger Settings modal window. The General settings display by default.
Extra CSS Selectors #
Add any valid CSS selector here to target an HTML element, so your popup will display when you click on that element.
For example, if you want a popup to display when you click on a specific paragraph tag (<p>), you can add a CSS class called launch-popup to that paragraph tag.
Here’s what the HTML code would look like.
<p class="launch-pop">Click to launch a cool popup.</p>
Once you add .launch-pop to the Extra CSS Selectors setting, your popup displays whenever there’s a click on a paragraph tag that has the launch-popup class.
Pro tip: If you want clicks on other elements to display the same popup, add those element’s CSS selector class or ID to the Extra CSS Selectors settings separated by a comma. E.g., .launch-popup, #my-cool-button, .launch-this-popup-too
Learn more about adding multiple selectors in our beginner's guide to popup triggers.
Link Options #
Not only can you add CSS class and ID selectors for your triggers, but you can add what's called link attribute selectors.
In the Extra CSS Selectors input field, click on the left arrow icon 
to see the link options.
Select the Link option you want from the dropdown.
Change the placeholder in between the double quotes (") to the link you want to match. In the example below, you would change the word contains to the word you need to match inside the link you want to trigger your popup.
Check out our detailed guide to learn more about how Popup Maker's 4 link options work.
You can also head over to CodePen to play around with a live demo of these 4 link attribute selectors.
Pro tip: Do you want to save time finding the CSS selector you need to add? Then, you need to try out our handy Get Selector tool in our top admin bar. Learn more in our Getting CSS Selectors help guide.
Cookie Name #
To set the Cookie Name field, you'll need to have a cookie set up for your Click Open trigger.
No worries if you don't have a cookie yet. Popup Maker conveniently lets you add a new cookie for your trigger right from the Cookie Name setting field.
Click the Cookie Name input field. Select an existing cookie or Add New Cookie if you don't have one yet.
Popup Maker will have a default cookie named pum-nnn (where nnn is the popup's ID number) ready for you to use. Or, you can provide a custom name for any cookie you set up.
Get the full details for creating popup trigger cookies in our Cookies options guide.
Advanced #
Sometimes you'll want to have a download link that also launches a popup. Here's an example of what that HTML would look like.
<a class="popmake-331" href="http://twenty-twentyone.local/wp-content/uploads/2021/08/download.pdf" download="Download PDF">Download a file and launch a popup.</a>
If you want a link for a Click Open trigger and have that same link download a file, no problem. You'll need to click on Advanced and check the Do not prevent default click functionality checkbox. See below.
