Skip to main content

Set up

This guide will help you integrate the Nudge SDK using Google Tag Manager (GTM) to track user activities and events. By following these steps, you will be able to initialize the Nudge SDK, identify users, and track events across your website using GTM.

note

You need a nudge account to get your API_KEY. See how to create one here.

Step 1 : Nudge SDK Initialization

Initialize the Nudge SDK globally so it's available for tracking events on all pages.

  1. Log in to Google Tag Manager.
  2. Go to Tags > New.
  3. Name the tag Nudge SDK Initialization.
  4. Select Tag Type as Custom HTML.
  5. Add the following script:
<script>
(function() {
if(!document.getElementById('NudgeCustomScript')) {
var script = document.createElement('script');
script.id = 'NudgeCustomScript';
script.src = 'https://web-scripts.nudgenow.com/index.js';

script.onload = function() {
// Initialize NudgeLibrary and store it in the global window object

if(!window.nudge){

window.nudge = new NudgeLibrary.Nudge({
apiKey: "YOUR_API_KEY",
});
}



};

document.head.appendChild(script);
}})();
</script>

  1. Set the trigger to All Pages (so it runs on every page).
  2. Save and publish the tag.

Step 2 : User Identification

Identify users to personalize their tracking data

  1. Go to Tags > New.
  2. Name the tag Nudge SDK Initialization.
  3. Select Tag Type as Custom HTML.
  4. Add the following script:
<script>
(function() {
if (window.nudge) {
window.nudge.userIdentifier({
userId: "USER_ID", // Replace with actual user ID
email: "[email protected]", // Replace with user email
});
}
})();
</script>


  1. Set the trigger to an appropriate event, such as User Login or All Pages.
  2. Save and publish the tag.

Anonymous Users

If there is no authenticated user, Nudge can create an anonymous ID for tracking purposes. You can combine initialization and identification in a single tag for anonymous users:

<script>
(function() {
if(!document.getElementById('NudgeCustomScript')) {
var script = document.createElement('script');
script.id = 'NudgeCustomScript';
script.src = 'https://web-scripts.nudgenow.com/index.js';

script.onload = function() {
// Initialize NudgeLibrary and store it in the global window object

if(!window.nudge){

window.nudge = new NudgeLibrary.Nudge({
apiKey: "YOUR_API_KEY",
});
}


window.nudge.userIdentifier({});
};

document.head.appendChild(script);
}})();
</script>

Step 3 : Event Tracking

Track user events such as button clicks, page views, or other interactions.

  1. Go to Tags > New.
  2. Name the tag Nudge SDK Initialization.
  3. Select Tag Type as Custom HTML.
  4. Add the following script:
<script>
(function() {
var maxRetries = 30;
var intervalTime = 100;
var retryCount = 0;

var checkNudge = setInterval(function() {
if (window.nudge) {
clearInterval(checkNudge);

window.nudge.track({
event: "page_view",

});
}
retryCount++;
if (retryCount >= maxRetries) {
clearInterval(checkNudge);
}
}, intervalTime);
})();
</script>

  1. Set the trigger to an appropriate event, such as User Login or All Pages.
  2. Save and publish the tag.
Warning
Event name, event properties, and user properties all follow this regex:^[a-z][a-z0-9_]{2, 99}$
  • Only small alphabets, numbers, and underscores (_) are allowed.
  • Spaces are not allowed in event names.
  • Name cannot start with a number; it needs to start with an alphabet.
  • The name should be between 2 and 99 characters in length.
  • If any capital letter is sent, it will be converted to lowercase.
warning

Initialization must happen first before user identification or event tracking. If you're using separate tags for initialization, identification, and tracking, you must manage the sequencing to ensure the SDK is fully initialized before trying to identify the user or track any events. This can be managed by using tag sequencing in GTM to ensure that the initialization tag runs before the user identification or event tracking tags.