Popup Configuration

‘Coupon’ Popups

Coupon definition

There are a few ways to generate the coupon displayed on your popup:

This is the most basic of them all. Copy one of your existing coupons and paste it into your popup.

How to:

  1. Open the Popup editor.
  2. Switch to the Settings panel.
  3. Find the field Manage coupon codes and click Configure.
  4. If the checkbox Generate discount code using advanced methods is checked, uncheck it.
  5. Paste your discount code into the Enter your discount code below field.
  6. Click Save & Close.

Your discount code might not exist until your page is loaded – it’s generated on the fly. The static coupon won’t work.

You’ll need to dynamically append the discount code to the popup.

An option you have is calling a function we provide you with in your javascript code, through which you pass your – by that time already generated – coupon code (and optionally it’s living time).

How to:

  1. Open the Popup editor.
  2. Switch to the Settings panel.
  3. Find the field Manage coupon codes and click Configure.
  4. Toggle the checkbox Generate discount code using advanced methods.
  5. Select the option Generated through on-page JavaScript.
  6. A box should appear with a function resembling the one below:
    window._hos_.do('addCoupon',{
    	value: 'YOUR-DISCOUNT-CODE', // your generated discount code
    	livingTime: '48:00', // how long the discount-code should remain usable. format HH:MM
    	id: 'P87HuDPB' // unique to each popup. leave untouched.
    });
  7. Copy it and insert it into your website’s javascript code at the place where your copoun code becomes defined, and change ‘EXAMPLE-DISCOUNT-CODE’ to your coupon code. If there’s no living time, you can simply delete that line.Your website’s javascript could end up looking something like the code below:
    $.ajax({
    	url: 'url.com',
    
    	data: {
    		// ...
    	},
    
    	success: function ( data ) {
    		// the discount code has arrived in the data object
    
    		window._hos_.do('addCoupon', {
    			value: data.discount_code,
    			id: 'P87HuDPB'
    		});
    
    	}
    
    });

Important!

  • Make sure that holdonstranger’s already loaded on the page, before calling the function.
  • The popup will only display, or be able to, if window._hos_.do(‘addCoupon’) has been called.

Your discount code might not exist until your page is loaded – it’s generated on the fly. The static coupon code won’t work.

You’ll need to dynamically append the coupon code to the popup.

An option is having us call a function you’ve written in your javascript code. That function should return the discount code as it’s value.

How to:

  1. Open the Popup editor.
  2. Switch to the Settings panel.
  3. Find the field Manage coupon codes and click Configure.
  4. Toggle the Generate copun code using advanced methods checkbox.
  5. Select the option Call a global JavaScript function to generate the code.
  6. On your javascript code create a function that returns the coupon code value, and attach it to the window object. E.g.:
    window.getDiscountCode = function () {
    	return discount_code;
    };
  7. In the field that opens after step 5), insert the name of the function you’ve created in the previous step. E.g.: window.getDiscountCode. Your website’s javascript would look something like the code below:
    var discount_code;
    
    $.ajax({
    	url: 'url.com',
    
    	data: {
    		// ...
    	},
    
    	success: function ( data ) {
    		// the discount code has arrived in the data object
    
    		discount_code = data.discount_code;
    	}
    
    });
    
    window.getDiscountCode = function () {
    	return discount_code;
    };

Important!

  • Attach the function to the window object.
  • holdonstranger calls your function at the moment your popup is about to display. So, make sure it’s loaded as soon as possible to ensure that when holdonstranger calls it, it’s already defined. If it’s not, the popup will not be displayed.

Leave a Comment

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