Google Tag Manager
Install the PushPro code snippet with Google Tag Manager
In this guide, we’ll explain how you can install the PushPro code snippet using Google Tag Manager, making the installation procedure even easier!
Google Tag Manager
Most marketers and website owners are familiar with Google Tag Manager (GTM). It’s a free tool by Google which you can use to set up tags on your website. These tags get triggered based on conditions you define. A few very common tags are the Google Analytics (GA) tag which ensures the behavior of your website visitor gets pushed to GA. Or the Hotjar tag which heat maps the cursor of your visitors so you can analyze their behavior.
Besides these pre-defined tags, you can also add ‘custom’ tags. That’s exactly what you’ll use to install the PushPro code snippet.
All you have to do is follow a few easy steps which we'll outline here:
Step 1. Click "add a new tag"
Step 2. Click on "Tag Configuration"
Step 3. Select ‘Custom HTML’ as the tag type
Step 4. Copy paste the PushPro code snippet which you can find in your domain settings
Step 5. Trigger it on all pages or customize to your liking
Step 6. Save the Tag changes and submit it to your live website
That’s it, easy right? You have now successfully installed the PushPro snippet on your website.
Don't forget to upload the PushPro file
Now that you have your code snippet installed with GTM, you can add the service worker Javascript file to the root of your website source code. If you manage the content of your website yourself, you can insert the files into the root folder.
Make sure to always place the service worker Javascript file to the root of your domain. If you don't know how, contact support or check the installation here.
Easily manage PushPro on your website with Google Tag Manager. Get ready to send Push Notifications directly from your website to your user’s mobile device. Need any further help? Contact us at hello@pushpro.io!
Verify your setup
You can verify if you set everything up correctly by navigating to https://yourdomain.com/. If you see a push notification opt-in request, everything is working! That’s all, your website is now ready to send push notifications!
If you do not see an opt-in request, you can check whether the code snippet and javascript file were correctly added. Navigate to https://yourdomain.com/sw.js. Here you should find the following text:
importScripts('https://storage.googleapis.com/push-pro-java-scripts/pushpro-sw.js');
Next up, you can verify whether you correctly added the code snippet. On https://yourdomain.com/, right-click anywhere on the website and select “Page Source”. Here, you should find the following text:
<script></script>
window.__pushpro = {
site_uuid: "your-unique-identifier",
}
https://storage.googleapis.com/push-pro-java-scripts/pushpro-lib.js">