Getting started
Meet Wisepops
Getting started with popups
Getting started with notifications
Onsite marketing best practices
Notifications
Installation
Installing the notification feed on your website
Custom setup
Custom Setup Guides for Shopify Themes
Minimal Theme
Dawn theme
Narrative Theme
Debut Theme
Simple Theme
Express Theme
Venture Theme
Brooklyn Theme
Boundless Theme
Supply Theme
Embedding the Feed
Advanced Feed Customization
How to I remove the notification feed from my site
Create notifications
Integrations
Notifications - Sync your new emails with Klaviyo
Integrate Wisepops with your ESP using Zapier
Tactics
Analytics
Popups
Installation
Add Wisepops with Google Tag Manager
Add Wisepops to Zoey
Add Wisepops to Webflow
Add Wisepops to Instapage
Add Wisepops to Blogger
Check your code implementation using Mozilla Firefox
Add Wisepops to Big Cartel
Add Wisepops to Drupal 8
Add Wisepops to BigCommerce
Check your code implementation using Google Chrome
Add Wisepops to Umbraco
Add Wisepops to Joomla
Add Wisepops to Squarespace
Add Wisepops to Magento 2
Add Wisepops to Google Sites
Add Wisepops to Cratejoy
Add Wisepops to 3dcart
Add Wisepops to Prestashop
Add Wisepops to Shopify
Add Wisepops to Weebly
Add Wisepops to Segment.com
How to add Wisepops to a custom website?
Add Wisepops to Wordpress/WooCommerce
How to add Wisepops to a Wix website
Add Wisepops to Volusion
Add Wisepops to SiteBuilder
Uninstall Wisepops from your Shopify website
Add Wisepops to Drupal 7
Add Wisepops to Neto
Wisepops on Single-Page Applications
Add Wisepops to Mono
Add Wisepops to Opencart
Create Campaigns
Design Your Campaign
Popups
Bars
Embeds
Create SEO Mobile-friendly Popups
Write Your Own CSS Rules into Your Popups
Create a Spin-to-Win Campaign
Design FAQ
Create a Thank You Message (or Display a Coupon) After Sign-Up
Use a custom font in your campaign
Closing Options
How To Add a Video to a Popup?
Insert social widgets into your popups
Form & Fields
Collect the URL on which the popup form is submitted
Collect the UTM parameters when a popup form is submitted
Adding more fields to your form
Select the dates available in your forms
Collect phone numbers / SMS opt-ins with Wisepops
Tab
Display rules
Triggers
Target a Popup To Display on Link Click
Target a Popup To Display on Hover
Adding a delay to your popup
On scroll trigger
Create an Exit Popup
Set Custom Events to Trigger Popups
Page targeting
Audience Targeting
Targeting new vs. returning visitors
How To Test Your Geotargeted Popups
Chrome’s Update and Its Impact on Source URL Targeting
Target by traffic channel, source or UTM parameters
Target a Specific Campaign
Exclude Your Existing Subscribers
Target or Exclude a Specific Country, Region or City
Target a specific language
Advanced
Contextual Targeting for Dummies
Set up Custom Properties for Wisepops
How To Test Your Custom Properties
Shopify Built-In Properties
How to Target (or Exclude) Visitors Who Have Seen a Specific URL
Use Google Tag Manager Variables as Custom Properties
Use Shopify Liquid Variables as Custom Properties
How To Retarget Visitors Who Saw a Specific Page on Your Website
Set Custom Properties Based on Cookie Values
Default Custom Properties in Magento
Display a Popup Based on an Alexa Rank Condition (With Clearbit)
Frequency Settings
Personalization
Personalize the Content of Your Popup on the Fly
Apply filters to your dynamic variables
Inject the Name of the Visitor's Company into Your Popups (with Clearbit)
Display the visitor's city within your popup
Apply a Shopify discount code to the cart
Scheduling your campaigns
Manage campaigns
Archiving, Deleting or Restoring campaigns
How to duplicate and move a campaign
Stopping and Starting Campaigns
Analytics
Google Analytics
Set up the Google Analytics integration
Use Google Analytics to break down your popups performance by traffic channel
Wisepops events in Google Analytics (Universal Analytics)
Wisepops events in Google Analytics (GA4)
Use Google Analytics to identify the pages where your popups perform best
Use Google Analytics to analyze Wisepops impact on your sales
Track clicks on your links using Google Analytics
Goal tracking
Set up Goal Tracking for Wisepops
How to set up Goal Tracking in Shopify
How to Set Up Goal Tracking in Magento
How to set up goal tracking using Google Tag Manager
Disable Wisepops on my device
How to Filter Out Internal Traffic
How to track clicks in HTML blocks
Time zone used for reporting
Download your emails or survey results
Understand the basic Wisepops metrics
How to track signups with a tracking pixel
Exclude your device
A/B Testing
Integrations
Email Integrations
Connect Wisepops with Splio
Connect Wisepops with Mad Mimi
Connect Wisepops with Campaign Monitor
Connect Wisepops with Emarsys
Connect Wisepops with Ometria
Connect Wisepops with Bronto
Connect Wisepops with Experian (Cheetah)
Connect Wisepops with Zaius
Connect Wisepops with Selligent
Connect Wisepops with Actito
Connect Wisepops with Acoustic
Connect Wisepops with Voyado
Connect Wisepops with Listrak
Connect Wisepops with Omnisend
Connect Wisepops with Constant Contact
Connect Wisepops with GetResponse
Connect Wisepops with SmartrMail
Connect Wisepops with Keap (formerly Infusionsoft)
Connect Wisepops with Drip
Connect Wisepops with MailChimp
Connect Wisepops with ActiveCampaign
Connect Wisepops with Sendinblue
Connect with Mailjet
Connect Wisepops with HubSpot
Connect Wisepops with SendGrid
Connect Wisepops with Klaviyo
Connect Wisepops with dotdigital
My emails are not collected in Mailchimp
Connect Wisepops with Iterable
Connect Wisepops with Customer.io
Connect Wisepops with Pipedrive
SMS integrations
Connect Wisepops with Yotpo/SMSBump
Connect Wisepops with Emotive
Connect Wisepops with Blueprint
Connect Wisepops with Postscript
Connect Wisepops with Klaviyo (SMS)
Zapier
Send your leads to a Google Spreadsheet (using Zapier)
How can I take advantage of the Zapier integration?
Connect Wisepops with ConvertKit (through Zapier)
Send a notification when an email is submitted (through Zapier)
Connect Wisepops with AWeber (through Zapier)
Connect with Close.io (through Zapier)
API
Other integrations
Tutorials
Add Wisepops to Your Website
How to Create an Average Cart Value Booster
How to create a referral campaign with Wisepops
Trigger a popup from the notification feed
Use the wisepops() function on Shopify
Add a product to the cart when a CTA is clicked (Shopify)
How to create a cart recovery popup with Wisepops
How to create a survey with Wisepops
How to create unique Shopify discount codes in your popups
Embed a SurveyMonkey Quiz Into a Popup
How to create a cart recovery popup with Wisepops (Magento)
How to create a cart recovery popup with Wisepops (Shopify)
Display a campaign when a product is added to the cart (Shopify)
Embed a Typeform in Your Popup
Advanced
JS Callbacks
Introduction to JS Callbacks
Dynamically Add a Custom Parameter to a Redirect URL
Fire the Facebook Pixel When a form is Submitted
Forbid Disposable or Free Emails in Your Signup Form
Add Custom Validation to Your Signup Forms
Flag a Popup as Clicked With JS Code
Close a Popup With JS Code
Send the data collected by a form to the redirected URL
Custom events
After-popup-close Event
After-tracked-click Event
After-form-submit Event
Before-form-submit Event
Before-popup-display Event
Before-tab-display Event
Before-tracked-click Event
Stop Displaying a Campaign When the Cross Close Icon Is Clicked
Display a Popup Only After Another One Has Been Seen (or Clicked)
Create a Spin-the-Wheel Popup Without Collecting the User’s Email Address
Create a Micro-Commitment Popup
Display a form field conditionally
FAQ
How to fix email synchronization issues
My popup doesn't display
How to handle required merge fields
Tips for effectively reporting an issue
Preview your popup on a hidden URL
Will Wisepops slow down my website?
Everything you need to know about the migration to V3
Collected emails don't appear on my dashboard
Can I use Wisepops on multiple domains?
Why does my popup look broken?
Is Wisepops compatible with my mobile app?
My Popup is Locked!
Can I show more than one popup on the same page?
Why does my popup appear for a few seconds and disappear?
Managing Your Account
Billing
Understand how Wisepops billing works
View and Manage your subscription
How do I cancel my subscription?
Add/Delete Website
Add, edit or delete users and manage permissions
Use Distinct Websites for Staging and Production
Use right-to-left writing
Legal & Security
- All Categories
- Popups
- Create Campaigns
- Design Your Campaign
- Insert social widgets into your popups
Insert social widgets into your popups
Updated
by Lisa Fockens
When a third-party service offers a way to embed a widget on your website, you can insert this widget into your popup with our JS callbacks feature.
Let's first see the generic methods to follow. You will then find various examples for embedding well known services.
Use iframe blocks for <iframe> snippets
First of all, if the provided snippet starts with <iframe>
, you just need to use an iframe block:

Within our editor, create a new iframe block, and fill up its URL by copying the src
attribute of the provided snippet.
For example, if you want to embed a Google map, you will get an HTML snippet similar to this:
<iframe src="https://www.google.com/maps/embed?pb=...!2sfr" width="600" height="450" frameborder="0" style="border:0;" allowfullscreen="" aria-hidden="false" tabindex="0"></iframe>
The URL of the iframe block should be https://www.google.com/maps/embed?pb=...!2sfr
That's it! Note that we have dedicated blocks for videos (YouTube, Dailymotion, Vimeo) and Facebook pages.
Create JS callbacks to execute scripts
Some other widgets need a deeper integration with the page. Such widgets are composed like this: a <div>
element and a <script>
tag.
The <div>
aims to place the future widget. It is a target, an empty element that will later be filled by the <script>
. You need to separate these two concepts in Wisepops.
Create an HTML block containing the <div>
You can choose the position of the widget in your popup by creating an HTML block. It should only contain the <div ... </div>
portion of the snippet.
For example, if we want to embed a YouTube subscribe button, we would create an HTML block containing the following code:

Create a JS callback to execute the script
<script>
tags are not allowed in our HTML blocks. You need to use a JS callback instead. Create a callback, and set its event to Before popup display.
Now, you should fill up the callback script. The expected language is Javascript, not HTML. This means that you cannot use <script>
tags. This implies changing the way the script is written.
For our YouTube subscribe button example, we would transform the script provided by YouTube:
<script src="https://apis.google.com/js/platform.js"></script>
Into a pure Javascript snippet:
var script = document.createElement("script");
script.src = "https://apis.google.com/js/platform.js";
script.async = true;
document.body.appendChild(script);
Note that the script.src
value is aligned with the original <script src="...">
attribute.

Real examples
Facebook post
Create an HTML block containing the <div>
with the class fb-post
. Something like this:
<div class="fb-post" data-href="https://www.facebook.com/20531316728/posts/10154009990506729/" data-show-text="true" data-width="">
<blockquote cite="https://developers.facebook.com/20531316728/posts/10154009990506729/" class="fb-xfbml-parse-ignore">
Posted by <a href="https://www.facebook.com/facebookapp/">Facebook App</a> on
<a href="https://developers.facebook.com/20531316728/posts/10154009990506729/">Thursday, August 27, 2015</a>
</blockquote>
</div>
And create a JS callback with a script similar to this:
var script = document.createElement("script");
script.src = "https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v7.0";
script.async = true;
document.body.appendChild(script);
(See Facebook documentation.)
Google Maps
Create an iframe block, with a URL similar to https://www.google.com/maps/embed?pb=...!2sfr
(See Google documentation.)
Instagram post
Create an HTML block containing the <blockquote>
element. Something like this:
<blockquote class="instagram-media" data-instgrm-captioned data-instgrm-permalink="https://www.instagram.com/p/CADdxE1gJ1u/?utm_source=ig_embed&utm_campaign=loading" data-instgrm-version="12" style=" background:#FFF; border:0; border-radius:3px; box-shadow:0 0 1px 0 rgba(0,0,0,0.5),0 1px 10px 0 rgba(0,0,0,0.15); margin: 1px; max-width:540px; min-width:326px; padding:0; width:99.375%; width:-webkit-calc(100% - 2px); width:calc(100% - 2px);">
...</blockquote>
And create a JS callback with a script similar to this:
var script = document.createElement("script");
script.src = "//www.instagram.com/embed.js";
script.async = true;
document.body.appendChild(script);
(See Instagram documentation.)
Create an iframe block, with a URL similar to https://www.linkedin.com/embed/feed/update/urn:li:ugcPost:6652912089960640512
(See LinkedIn documentation.)
Spotify follow button
Create an iframe block, with a URL similar to https://open.spotify.com/follow/1/?uri=spotify:artist:6sFIWsNpZYqfjUpaCgueju&size=detail&theme=light
(See Spotify documentation.)
Create an HTML block containing the <a>
element with a class starting with twitter
. Something like this:
<a class="twitter-timeline" href="https://twitter.com/Twitter?ref_src=twsrc%5Etfw">Tweets by Twitter</a>
And create a JS callback with a script similar to this:
var script = document.createElement("script");
script.src = "https://platform.twitter.com/widgets.js";
script.async = true;
document.body.appendChild(script);
(See Twitter documentation.)