Playbook Implementation on Sub-Domains

This guide explains how playbooks can be implemented for a sub-domain website structure.

There are certain use-cases, where a playbook would need to be implemented on sub-domains. For example, for the majority of websites, the SUBSCRIBE button takes the users to a different sub-domain. You would like to target those users who have visited the subscribe page but have not actually paid for the subscription. iZooto provides the Recover Abandoned Subscriptions playbook to target such users; however, the implementation differs a bit if there is a sub-domain implemented to record the subscriptions.

📘

Recover Abandoned Subscriptions Playbook

This playbook helps you target those users who have abandoned the subscription process from your website. Please write to [email protected] to get this enabled for your website or get in touch with your Account Manager.

If the setup on your website is as described above (the subscription happens on a sub-domain), you can follow the below steps to enable the Recover Abandoned Subscriptions playbook for your website.

🚧

The example below outlines how to enable the Recover Abandoned Subscriptions playbook on your website. The same logic can be extended for other playbooks as well. Please write to [email protected] or get in touch with your Account Manager if you have similar use-cases.

Step 1: Add custom iZooto initialisation

1.1 This customized initialization code needs to be added to the main domain of the website. The code modifies the default iZooto initialization code to handle the sub-domain structure of the website.

<script>
  window._izq = window._izq || []; window._izq.push(["init" ]);
	var izSetCookie = function(domain) {
    var d = new Date();
    d.setTime(d.getTime() + (1500 * 240 * 60 * 60 * 1000));
    var expires = "expires=" + d.toUTCString();
    document.cookie = "isIzootoSusbcribed=1;path=/;"+ expires+";domain="+domain+";SameSite=None;Secure;";
  };

	window._izq.push(["registerSubscriptionCallback", function(obj) {
    if(obj.statuscode==1 || obj.statuscode==2) {
      var domain = ".domain.com";
      izSetCookie(domain);
    }
  }]);
</script>

Step 2: Add trigger code

2.1 The below snippet of code needs to be called when the user has clicked on the SUBSCRIBE button or has clicked on any of the subscription plans (depending upon the website structure).

Ideally, this button & the below JS call should happen on the main domain, and clicking on the button should re-direct the users to a sub-domain.

<script>
  window._izq.push(["trigger","clicked_subscribe",{ "landing_url":"Paywall Url", "brand_logo":"Brand logo", "banner_image":"banner image"}])
</script>

Step 3: Changes in izooto.html file

3.1 If you have implemented iZooto on your website manually without the use of any plugins, there would be an izooto.html file hosted on the root directory of the website. Add the below snippet of code to the izooto.html file.

<script>
    window._izq = window._izq || [];
    function izGetParamFromUrl() {
		let _url = new URL(document.location.href)
		let str = _url.searchParams.get("izootoSyncEventFrom")
		return str
    }

    if(izGetgetParamFromUrl() == "subdomain.com") {
        window._izq.push(["trigger","subscription_paid",{ }]);
    }
</script>

3.2 if you have implemented iZooto using a plugin, you might not have necessarily hosted the izooto.html file. If such is the case, create a new file named izooto.html, add the above code and host it to the root directory of the website.

Step 3: Add code to the sub-domain

3.1 The below code snippet needs to be placed & called on the sub-domain which is to be used in the implementation.

<script>
  var hostToBeSync = window.location.hostname;
	var izootoFrameURL = "https://domain.com/izooto.html?izootoSyncEventFrom="+hostToBeSync;

	var izGetCookie = function(cname) {
    try {
      var name = cname + "=";
      var decodedCookie = document.cookie;
      var ca = decodedCookie.split(';');
      
      for(var i = 0; i <ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) == ' ') {
          c = c.substring(1);
        }
        
        if (c.indexOf(name) == 0) {
          return decodeURIComponent(c.substring(name.length, c.length));
        }
      }
      return "";
    } catch(e) {
      return "";
    }
  };

	function syncIzootoPropFromChild () {
    if(izGetCookie("isIzootoSusbcribed")==1) {
      try {
        var iframe = document.createElement("IFRAME");
        iframe.setAttribute("src", izootoFrameURL);
        iframe.style.width = "0px";
        iframe.style.height = "0px";
        iframe.style.border = "0px";
        iframe.setAttribute("visibility", "hidden");
        iframe.style.display = "none";
        
        if (document.body != null)
          document.body.appendChild(iframe);
        else
          document.head.appendChild(iframe);
      } catch(e) {
      }
    }
  }
</script>

❗️

Please ensure that there are no subscription codes added to the sub-domain for this implementation to work.

Step 4: Add goal codes

4.1 The below method call needs to be added on the success page or the thank you page, which appears when the user has successfully purchased the subscription.

<script>
  var hostToBeSync = window.location.hostname;
    var izootoFrameURL = "https://domain.com/izooto.html?izootoSyncEventFrom="+hostToBeSync;

    var izGetCookie = function(cname) {
    try {
      var name = cname + "=";
      var decodedCookie = document.cookie;
      var ca = decodedCookie.split(';');
      
      for(var i = 0; i <ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) == ' ') {
          c = c.substring(1);
        }
        
        if (c.indexOf(name) == 0) {
          return decodeURIComponent(c.substring(name.length, c.length));
        }
      }
      return "";
    } catch(e) {
      return "";
    }
  };

    function syncIzootoPropFromChild () {
    if(izGetCookie("isIzootoSusbcribed")==1) {
      try {
        var iframe = document.createElement("IFRAME");
        iframe.setAttribute("src", izootoFrameURL);
        iframe.style.width = "0px";
        iframe.style.height = "0px";
        iframe.style.border = "0px";
        iframe.setAttribute("visibility", "hidden");
        iframe.style.display = "none";
        
        if (document.body != null)
          document.body.appendChild(iframe);
        else
          document.head.appendChild(iframe);
      } catch(e) {
      }
    }
  }
syncIzootoPropFromChild();
</script>

Step 5: Run and test the playbook

Run and test the playbook by clicking on the SUBSCRIBE button or the subscription plans button and then abandon the process. You should be able to start receiving notifications related to the Recover Abandoned Subscription Playbooks.

👍

This is how a playbook can be implemented on a sub-domain structure. If you have any questions during the setup or implementation, please write to [email protected] or get in touch with your Account Manager.