# Google Tag Manager Integration

You can integrate with Tracknow in order to be able to track sales on your website using Google Tag Manager.\
In this integration, GTM is used in order to load the necessary scripts.

***

### Prerequisites <a href="#prerequisites" id="prerequisites"></a>

This integration method require you to enable passing our unique affiliate identifier `click_id` to your landing page.&#x20;

For instructions, click [here](https://docs.tracknow.io/integrations/passing-click_id-to-a-landing-page).

***

### Storing the `click_id` Using GTM <a href="#storing-the-click-id-using-gtm" id="storing-the-click-id-using-gtm"></a>

Once the click\_id is passed to the webstore, it should be saved in a browser cookie to ensure it persists as the customer navigates between pages. The `click_id` must still be available after a successful purchase so it can be included in the postback to Tracknow together with the purchase details.

In Google Tag Manager, create a new **Page View** trigger and set it to fire on **All Page Views**. This ensures the `click_id` is captured and saved no matter which page the customer lands on, so it won’t be missed if they enter the site on a deep link.

<figure><img src="https://1097958070-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHX682uo79XLNkfkN58br%2Fuploads%2FJG3Z6HZ8ahPwF3GLZ6ak%2Fimage.png?alt=media&#x26;token=af3bc7a2-f229-4b9f-afa4-8b31d4485ab0" alt=""><figcaption></figcaption></figure>

Finally, you’ll need to add the script responsible for storing the `click_id`.

In GTM, go to **Tags** → **New** → Create a **Custom HTML** type tag.

```javascript
<!-- 1) Stub out 'tracknow' so calls queue immediately -->
<script>
window.tracknow =
window.tracknow ||
function () {
(window.tracknow.q = window.tracknow.q || []).push(arguments);
};

// Queue initial configuration with domain/namespace
tracknow("config", {
namespace: "ENTER YOUR NAMESPACE HERE",
});
</script>

<!-- 2) Load the Tracknow library asynchronously -->
<script async src="https://static.tracknow.io/js/tracking.min.js"></script>
```

Copy the code above, **replace the ENTER YOUR NAMESPACE HERE placeholder with your actual Tracknow namespace** and paste the adjusted code in the GTM custom HTML code box.

<figure><img src="https://1097958070-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHX682uo79XLNkfkN58br%2Fuploads%2FZLgHyzSPtVPU2h0pm5CP%2Fimage.png?alt=media&#x26;token=db88f1b7-4396-4439-9fae-656eeb2fb6a8" alt=""><figcaption></figcaption></figure>

Select the trigger you previously created as this tag’s trigger.

<figure><img src="https://1097958070-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHX682uo79XLNkfkN58br%2Fuploads%2FzvOZ4nfLuXyxuVwUDTev%2Fimage.png?alt=media&#x26;token=103c62da-f76a-4fd0-98c6-25da5f564cd4" alt=""><figcaption></figcaption></figure>

***

### Sending Purchase Data Using GTM <a href="#sending-purchase-data-using-gtm" id="sending-purchase-data-using-gtm"></a>

To send purchase data to Tracknow, use the webstore’s **Thank You / Order Confirmation** page as the trigger for firing the postback. This ensures the postback is sent only after the purchase has been successfully completed.

In GTM, create a new **Page View** trigger and set it to fire on **Some Page Views**. Then configure the condition so it fires only when the webstore’s **Thank You** page is viewed: set **Variable** to **Page URL**, choose **Contains** as the match type, and enter the Thank You page URL path (e.g., /thank-you).

<figure><img src="https://1097958070-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHX682uo79XLNkfkN58br%2Fuploads%2F4b2eyhxyd798JOMPiLHP%2Fimage.png?alt=media&#x26;token=4fc256f8-b5c3-4a77-9d95-ebff8104ca47" alt=""><figcaption></figcaption></figure>

Next, you’ll need to add the script responsible for storing sending the postback.

In GTM, go to **Tags** → **New** → Create a **Custom HTML** type tag.

```javascript
<script>
tracknow("postback", {
namespace: "ENTER NAMESPACE HERE",
params: {
campaign_id: "ENTER CAMPAIGN ID HERE",// Mandatory
amount: ENTER AMOUNT VARIABLE HERE, //Mandatory
order_id: ENTER ORDER ID VARIABLE HERE, //Optional
},
});
</script>
```

Copy the code above and update the placeholders as follows:

* Replace **ENTER CAMPAIGN ID HERE** with the **Tracknow campaign ID** you want to attribute the conversion to.
* Replace **ENTER NAMESPACE HERE** with your **Tracknow** **namespace**.

You can include additional parameters in the postback to capture more purchase details from the webstore by adding them under the script’s **params** object. To see the full list of parameters Tracknow supports, [click here](https://docs.tracknow.io/integrations/supported-parameters).

For any parameter that should be populated dynamically (for example, the order total or order ID), replace the placeholder value in the code with the correct **macro** (Data Layer Variable Name) for that value (as provided by your webstore/GTM setup).

<figure><img src="https://1097958070-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHX682uo79XLNkfkN58br%2Fuploads%2FepmK1YWK6j10pFVNK904%2Fimage.png?alt=media&#x26;token=027a46aa-4ea1-43d3-a197-8b096278e17e" alt=""><figcaption></figcaption></figure>

Select the postback trigger you previously created as this tag’s trigger.

<figure><img src="https://1097958070-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHX682uo79XLNkfkN58br%2Fuploads%2FpQ8w8ImvMZTjWu5H87R8%2Fimage.png?alt=media&#x26;token=ca82ae53-6467-45f0-998f-af5309868db0" alt=""><figcaption></figcaption></figure>

***

### Important Notes <a href="#important-notes" id="important-notes"></a>

On single-page applications (SPAs), navigation typically happens without a full page reload. As a result, a standard **Page View** trigger may not fire when the user moves between routes. In these cases, use a **History Change** trigger to detect URL changes and fire your tag accordingly.
