TL:DR Target pop-ups based on Country, Region, or City
If you’re like me, one of the first things you wanted to do once diving into the new embedded CTAs was Geo-Target them based on segment. Well, you’re in luck as I’ve spent all morning researching the perfect setup, and it’s all yours to implement!
This process uses Google Tag Manager + Unbounce to achieve the segmentation. If you don’t already use GTM (?!?!) you can easily find resources online—you’ll need it though as it does half the trigger process.
How to Install in Unbounce
Click Here for Instructions
🚨
This is not an official Unbounce feature. This functionality is based entirely on third party code, and has only been tested in limited applications. Since this isn’t a supported Unbounce feature, our support team will be unable to assist if things go awry. So if you are not comfortable with HTML, Javascript and CSS, please consider consulting an experienced developer.
Step 1: Create a New Tag in GTM
In the ‘tags’ section create a new Custom HTML Tag with the script at the end of this article. This will take the user IP, run the data through GeoPlugin and then push the variables to the Data Layer in GTM. Make sure this fires on all pages you need to use geo-targeting on.
Step 2: Create the New Variables
Each of the three variables (Country, Region, City) will need to be setup as a new datalayer variable in GTM. In the variables tab hit ‘new’ and add three elements. Repeat the following as three new variables:
- Variable ‘Country’
- Variable Type: Data layer Variable (Page Variable)
- Data Name: ‘country’
- Layer Version: Version 2
Step 3: Create Your Trigger (Per Unique Event)
Under trigger, create new:
Trigger Type: Page View – Window loaded
Trigger Fires on Country contains “Canada”
Step 4: Input Unbounce Script
Finally, the only thing left is to create a new tag and select your new trigger
UPDATE 1
Having multiple tags firing on the same page do conflict with one another. Tomorrow I’m going to try and sort a workaround.
UPDATE 2
It appears as though the script for ECTAs is actually the same for as many as you make. This means, while geo-targeting can work, you can only have one per URL running.
SCRIPT FOR TAG:
<script src="http://www.geoplugin.net/javascript.gp"></script>
<script>
(function() {
try {
var city = geoplugin_city();
var country = geoplugin_countryName();
var region = geoplugin_regionName();
dataLayer.push({
'country' : country,
'city' : city,
'region' : region
});
} catch(e) {
dataLayer.push({
'event' : 'Error',
'Jserror' : e.message
});
}
})();
</script>
Can’t see the instructions? Log-in or Join the Community to get access immediately. 🚀
Want to take your Unbounce landing pages + Convertables to the next level?
Check out the Ultimate List of Unbounce Tips, Scripts & Hacks