Home / Integrations / Woopra / Personalized Javascript popups using Woopra segments and triggers
Create javascript popups using Woopra segments and triggers

Personalized Javascript popups using Woopra segments and triggers

Everyone who’s serious about driving higher sales and subscriptions on their website has experimented or has already implemented some form of popup technology. While there are some quality middle-ware applications on the market (optinmonster & Sumome), none of them we have found can create a popup which can be customized to one particular visitor and their information stored in your CRM.

Using Woopra we’re able to use the visitor information and combine it to make some personalized JavaScript popups for our visitors.

As an Example: A visitor has been identified after filling out a form on your website. That visitor is still yet to convert into a sale but continues to return day after day looking at products under a certain category. Rather than just hit that person with a standard popup, we want the visitor to feel more welcome and hit them with a personalized popup. After the 5th website visit a popup appears with the message “Hi John, did you have any questions about product X” or “Hi John, you’re eligible for a 10% discount on all our products today only – use this promo code”  .

While there is very much a creepy side of visitor tracking, we’ve still found that personalized popups resonate better with our customers and encourage them to convert at a higher rate.

Today we’re going to look at how to create a basic JavaScript popup using Woopra segments and triggers. The example we’re going to do isn’t anything complex, but should give you an idea of how you can customize a popup to meet your business objectives.

Create the CSS for the popup:

Add the following CSS into your main stylesheet to style your popup – Once again this is very basic and you would want to customize it to have the look and feel to match your website. The following CSS will simply make a popup slide in from the top.

Create the JavaScript trigger in Woopra:

Within Woopra, navigate to Manager > Triggers > Create New

For this trigger we’re going to set the conditions to anyone who has been identified and has visited at least 5 pages in the past 7 days.

Set the people who this applies to – Name is not equal to Null

Create javascript popups using Woopra segments and triggers

Set the actions – there have been at least 5 pageviews in the past 7 days.

Create javascript popups using Woopra segments and triggers

Woopra is very fast to execute a trigger – in most cases it happens 200ms after the visitor meets the conditions. This particular popup will appear 8 seconds after the visitor meets the conditions set above.

Add the action Run Script and paste the below script into the run script box. Don’t forget to save your trigger once everything is done.

Create javascript popups using Woopra segments and triggers

Test out your popup:

Depending on the trigger conditions you’ve created, you should now be able to browse to your website and see the following popup appear.

Create javascript popups using Woopra segments and triggers

With this basic example you can see that the possibilities are almost endless using the existing visitor information you’ve already captured. One downside is customizing popups if you’re not overly familiar with CSS and JavaScript.

Hope you’ve enjoyed reading – please leave any feedback or questions below 🙂

  • Was this Helpful ?
  • yes   no

About The Moo Master

As today's world moves towards more cloud based solutions, it's not always easy to find an all-in-one solution to a business problem. We focus on business development. finding new, creative and innovative ways to use different IT systems to enhance and automate business processes. We're happy to share our knowledge and solutions we've come up with over the years to some of those unique IT/Business problems.

Check Also

Identify users in Woopra using Forms

Identifying visitors in Woopra using GTM & Form Variables

Contents1 Identifying visitors using form variables:1.1 Update form ID’s:1.2 Create the Form Variable in GTM:1.3 ...

Leave a Reply

Your email address will not be published. Required fields are marked *