Skip to main content

Success tracking with Google Tag Manager

Integrate our Success Tracking script via Google Tag Manager (GTM) to easily measure how well your experiences drive purchases on your site.

Step 1: Get your success tracking script

  • Contact us via the Zoovu Support Portal to get your Success Tracking (ST) script.
  • The script will come in two segments. The support team will tell you the order in which to combine them.
  • Save both code segments in a .js file using a code editor like Visual Studio Code, or even Notepad if that's what you have.

Step 2: Format your script

  • Combine the two code segments you received.
  • Start with <script> before the Zoovu.Tracking.trackPurchase({ code.
  • Close the combined code with </script>.
  • Remove any lines that start with // (these are comments).
  • Delete any unnecessary empty lines to keep the code clean.
  • Save your file.

Example of what your code might look like:

<script type="text/javascript" src="https://orca-api.zoovu.com/advisor-fe-web/api/v1/integrations/client/zoovu-tracking"></script>

<script>
Zoovu.Tracking.trackPurchase({
transactionId: window.datalayer.ecommerce.purchase.actionField.id,
currency: 'EUR',
products: getPurchasedProductsArray(),
})
.then(function onResolve(status) {
if (status.wasEventSent) {
console.log('ZOOVU Success Tracking Event Was Sent');
} else {
console.log('ZOOVU Success Tracking Event Was NOT Sent');
console.log(status.whyEventWasNotSent);
}
})
.catch(function onReject(error) {});

function getPurchasedProductsArray() {
var ecommerceArray = window.datalayer.ecommerce.purchase.products;
var result = [];
for (var i = 0; i < ecommerceArray.length; i++) {
result.push({
sku: ecommerceArray[i].id,
name: ecommerceArray[i].name,
pricePerUnit: parseFloat(ecommerceArray[i].price),
quantity: parseInt(ecommerceArray[i].quantity, 10),
});
}
return result;
}
</script>

Step 3: Create a GTM tag

  • Open Google Tag Manager (GTM) and go to your client’s workspace.
  • Click on "Tags" in the menu, then "New" in the top right corner.
  • In the new window, click on "Tag Configuration" and select "Custom HTML" under the "Custom" section.
  • Name your tag something relevant, like "Zoovu Success Tracking."
  • Paste the ST code from your .js file into the HTML field.
  • Save your tag by clicking "Save" in the top right corner.

Step 4 (optional): Create variables to improve readability

  • In GTM, click on "Variables" from the main menu.
  • Select "New" in the User-Defined Variables section.
  • Choose "Data Layer Variable" from the list.
  • Name the first variable "zoovu transaction id" and set the Data Layer Variable Name to ecommerce.purchase.actionField.id.
  • Save the variable.
  • Repeat to create a second variable named "zoovu products" with the Data Layer Variable Name: ecommerce.purchase.products.
  • Go back to "Tags" and select your Zoovu tracking tag.
  • Update the code:
    • Replace transactionId: window.datalayer.ecommerce.purchase.actionField.id with transactionId: {{zoovu transaction id}}.
    • Replace var ecommerceArray = window.datalayer.ecommerce.purchase.products; with var ecommerceArray = {{zoovu products}};.
  • Save the changes.

Step 5: Create a trigger

  • Go to "Triggers" in the main menu and click "New."
  • Choose the "Window Loaded" trigger type and select "Some Window Loaded Events."
  • Label your trigger, e.g., "Zoovu Thank You Page Trigger."
  • Set the condition to fire when the Page URL contains your Thank You page's specific path, like /checkout/success/.
  • Save your trigger.

Step 6: Test your configuration

  • In GTM, click "Submit" in the top right corner. This won’t push changes live but allows for testing in preview mode.
  • Click "Preview" to activate preview mode.
  • Enter your assistant’s website URL in the provided field and click "Connect."
  • Navigate your website (which opens in a new window), right-click on the page, and select "Inspect."
  • In the inspection tool, go to the "Network" tab and search for "CollectSalesEvent."

You should see three windows:

  • Your website in GTM’s preview mode.

  • The browser’s DevTools focused on network activities.

  • GTM Summary, showing whether your tag fired correctly.

  • Test the setup by making a purchase through your assistant. Use a 100% discount coupon or a non-payment method for easy cancellation.

Make sure that:

  • The product is added to the cart via the assistant’s "Add to cart" button.
  • The purchase completes and redirects to the Thank You page.
  • "CollectSalesEvent" appears in DevTools.
  • The tag moves from "Tags not fired" to "Tags fired" in GTM.