Web Push Setup
Setting up iZooto Push on your website(s)
Setting up Web Push Notifications is easy. The steps differ for HTTPS and HTTP websites slightly. Please refer to our HTTP vs. HTTPS guide for more details.
Follow the steps mentioned below to setup iZooto on your website.
For websites running on HTTPS
1. Insertion of the JS code
Add the JS code before the </head>
tag on all the website pages. A sample code is mentioned below.
<script> window._izq = window._izq || []; window._izq.push(["init"]); </script>
<script src="YOUR_SCRIPT_HERE.js"></script>
You can find the JS code for your website under Settings > Setup.

Follow the instructions on screen to access the iZooto JS.
You can also add this code asynchronously in case you are worried about the load time of your website.
<script> window._izq = window._izq || []; window._izq.push(["init"]); </script>
<script async="true" src="YOUR_SCRIPT_HERE.js"></script>
2. Uploading Files
Two files - izooto.html
and service-worker.js
need to be uploaded to the root folder of your website. They should be accessible as:
https://yoursite.com/izooto.html
https://yoursite.com/service-worker.js
2.1 Root Folder Not Accessible
If, in case you do not have access to the root folder, click on Don't have access at root directory.

Enter the appropriate non-root directory path and hit Save.

Placing the files in your CDN will not work as the domain/URL would become different
Some platforms like Blogger, do not have any provision for uploading files. In such cases, please follow the HTTP implementation given below. More details available here.
Here is how the subscription prompt would look like after the integration is done.

Subscription flow on HTTPS website
For websites running on HTTP
Web Push Notifications work only on SSL, that is, websites running on HTTPS. However, HTTP websites can avail web push notifications by creating a sub-domain on HTTPS. Unlike HTTPS websites, the subscription process is of 2 steps.
In the first step, websites can set up the context with an interactive message on a custom dialogue box while the actual subscription prompt appears in the second step on the HTTPS sub-domain.
1. Insertion of the iZooto JS Code
Add the JS code before the </head>
tag on all the website pages. A sample code is mentioned below.
<script> window._izq = window._izq || []; window._izq.push(["init"]); </script>
<script src="YOUR_SCRIPT_HERE.js"></script>
You can find the JS code for your website under Settings > Setup.

You can also add this code asynchronously in case you are worried about the load time of your website.
<script> window._izq = window._izq || []; window._izq.push(["init"]); </script>
<script async="true" src="YOUR_SCRIPT_HERE.js"></script>
Here is how the subscription prompt would look like after the integration is done.

The subscription flow on HTTP websites
Note:
Unlike HTTPS websites, the subscription process is of 2 steps and involves the visitor clicking on 2 CTAs (Click to Action) before getting subscribed to a particular website. See this for details around how iZooto implements this.
SetUp via GTM
You can go through the instructions here if you want to integrate iZooto via Google Tag Manager.
Here's a video that you can refer to understand Web Push Setup.
Updated 3 months ago