Install Using Google Tag Manager
Installing Userpilot with google tag manager is an easy way to get up and running in no time. To get started we first need to create an account on google tag manager and install GTM code into your app.
Note: You will need to pass all properties including the unique user ID directly to the data layer.
Calling userpilot.identify()
In order to start displaying Userpilot content on your app, we first need to create a new Custom HTML tag, let us call it "Userpilot - Identify". Next, we will add the deployment script below to the HTML box.
As for the triggering setting, it should be set to "All pages"
<script> window.userpilotSettings = {token: "appToken"}; </script> <script src = "https://js.userpilot.io/sdk/latest.js"></script> <script> userpilot.identify( "<UNIQUE USER ID>", { name: "John Doe", email: "customer@example.com", created_at: "1519205055" // Additional user properties // projectId: "1" // trialEnds: '2019-10-31T09:29:33.401Z' } ); </script>
Note: You will need to replace the "appToken" with your account app token
Note: In the above image we have created variables to match the passed user properties from the data layer.
Calling userpilot.reload()
If you have a Single Page App (SPA) you will need to trigger the userpilot.reload()
function on every page URL change. To do that we will need to create a new Custom HTML tag. Then simply add the code below in the HTML box.
<script> userpilot.reload(); </script>
After that, we need to set the Triggering to "History Change". The "History Change" trigger will run the tag only when the URL has been updated.