Categories
active arrowAccount
active arrowGetting Started
active arrowCampaign Builder
active arrowAdvanced Design Customization
active arrowEmail Campaign Customization
active arrowSegment & Targeting
active arrowAnalytics
active arrowShopify
active arrowEmail Marketing and CRM Integrations
active arrowAfter-Scrolling X% Trigger
active arrowAfter X Seconds Trigger
active arrowBrowser Language Targeting
active arrowCookie Targeting
active arrowDevice-Based Targeting
active arrowPopup Display Frequency Settings
active arrowExit Intent Targeting
active arrowGeo-Located Targeting
active arrowHow Segmentation Works?
active arrowHTML Targeting
active arrowInactivity Trigger
active arrowNew or Returning Visitor Targeting
active arrowOn-Click Targeting
active arrowOperating System Targeting
active arrowSiteData Targeting
active arrowSmart Mode Targeting Backed with AI Technology
active arrowTraffic Source Targeting
active arrowURL Targeting
active arrowWhat Is Scheduling On Popup Builder?

On-Click Targeting

Did you know you can embed a code on a button, link, or image that opens your popup with a click?

Popupsmart’s on-click targeting feature makes it as easy as a finger snap.

Basically, it improves the user experience by not bombarding users with a popup immediately after landing on a page. The popup works on the condition of clicking the set element.

The on-click feature works anywhere on your website that supports JavaScript and HTML.

All you need to do is customize your button, link, or image and copy and paste the generated code snippet to where you want to show it.

🔔 Pro Tip: Leave this process to last when customizing your popup. Once your main popup is done, you can align your button based on it.

Additionally, think of this on-click targeting as an embed button. It’s possible to embed it anywhere on a JS-supported page, such as in a blog post.

Creating On-Click Button

1. After logging into your Popupsmart account, create/edit a popup campaign. On the popup builder screen, navigate to the “Segment” section and click “Edit Segment.” (If it’s a new campaign, click the two circular arrows to choose a predefined segment or create one from scratch in “My Segment.”)

on click segment screen

2. Click “Add user behavior targeting” under “User Behavior”. Then, click “Add” next to “On-Click Targeting”.

on click targeting button

3. Check the “Enable” box to activate the targeting.

on click enable button

4. You can also choose to “Disable all the other targetings” by checking the following box.

disable targetings button

Note💡: Checking the "Disable all the other targetings" option will make all other targetings stop running except On-Click Targeting. If you just "enable" it, On-Click Targeting will be an optional targeting to all others for your popup to be triggered.

5. Paste the generated code snippet to your element’s click function.

on click id field

On-Click targeting, the function window.ps.show({ id: xxxxx }); should be assigned to the on-click property of the element. It is not recommended to use it on <a> tags or buttons that redirect to another page when clicked.

using a element

Example of correct usages:

<div onclick="window.ps.show({ id: xxxxx });">test2</div>
<button onclick="window.ps.show({ id: xxxxxx });">test2</button>
1
2

‍Incorrect usage:

<a onclick="window.ps.show({ id: xxxxxx });" href="/about">about</a>
1

‍

6. Click "Save" from the upper-right corner and continue with the “Publish” step from the left-hand panel to see the Targeting Summary.

targeting summary of on click

Still have questions? Feel free to contact us via live chat or email!