Skip to main content

Google Tag Manager Integration

This step-by-step guide will walk you through integrating Growify with Google Tag Manager.

Apple Sepin avatar
Written by Apple Sepin
Updated over 4 months ago

Step 1. Pixel Installation


The Growify PowerPixel is a code snippet that enables us to gather behavioral data about your website visitors. The data feeds into our backend graph, allowing us to track customer journeys from site visit to purchase, along with marketing touchpoints in between.

- Go to https://tagmanager.google.com and select the website where you want to install the Growify Power Pixel (1)

- Click on Add a new tag (2)

- Give the tag a clear name, such as "Growify Pixel", to make it easy to identify in the future (3). Then, navigate to the Tag Configuration section and click on "Choose a tag type to begin setup..." to proceed (4)

- In the "Choose a tag type" menu, click "Custom HTML" type (5)

- Complete the following steps to add the Growify PowerPixel:

-- Add the PowerPixel to the HTML section of the screen. You can find your code snippet below (6)

-- Select Support document.write (7)

-- Set Tag firing priority to "99" (8)

-- Set Tag firing options to "Once per page" (9)

<script type="module">
if (!window.grp) {
const grp = (...args) => (grp.process ? grp.process(...args) : grp.queue.push(args));grp.queue = [];grp.t = Date.now();window.grp = grp;
const script = Object.assign(document.createElement('script'), {
async: true,
src: 'https://storage.googleapis.com/grpixel/openpixel.min.js',
});
document.head.appendChild(script);
grp("init", "670");
}
</script>

- Click "Choose a trigger to make this tag fire..." to configure Trigger settings and Select All Pages (10)

- Click Save to save the tag

- Click Submit and Publish to go live (11)


Step 2. Verify PowerPixel Connection and Status

- Navigate to your store's homepage

- Open a DevTools

Windows: Ctrl + Shift + I or F12

macOS: ⌘ + ⌥ + I

- Refresh thee page, then go to the Network Tab. Filter by the keyword 'grp' and locate the event

- If the event has been located, the status will be updated as soon as the data is indexed (which takes around 10-15 minutes) on the Growify dashboard (10)

Great job! The Power Pixel SDK has been successfully installed and view events are now being collected.


Step 3. Conversion Events

Our generic script to track Conversion events from any checkout page. Please be sure it fires at the tail end of your customer journey -- normally on your 'order confirmation page' or 'thank you page'

Note: The SDK should be configured to run on your Order Details page. Ensure that Steps 1 and 2 are properly set up.

Note: It's recommended that somebody with basic GTM and Javascript knowledge sets up the script to decrease the likelihood of any issues.

You can fire the Purchase event using:

- Native JavaScript Integration

- Custom Tag with GTM Data Layer

Note: If you use the GTM Data Layer, we assume you are familiar with Variables and Triggers.

Example: Firing a Purchase Event (Native JavaScript Integration)

<script>
window.grp.fireConversion({
orderId: 'AB123', // string; optional; A unique identifier for the order that was placed.
userId: 'd1d64d5c-b12d', // string; optional;
userEmail: '[email protected]', // string; optional;
userFirstName: 'John', // string; optional;
userLastName: 'Doe', // string; optional;
tax: 0, // number; optional; default = 0
shipping: 0, // number; optional; default = 0
products: [
{
productId: 'SKU', // string; optional;
productName: 'AF1', // string; optional;
productBrand: 'Nike', // string; optional;
productQuantity: 1, // integer; required; Should be greater than 0;
productPrice: 9.99 // number; required; Should be greater than 0; Conversion value
}
]
})
</script>

Validation

Products: At least one product must be included in the products array.

Product quantity: This is required and must be an integer value greater than 0. If the value is missing, null, less than or equal to 0, or non-numeric, the conversion event will not be triggered.

Product price: This is required and must be a number value greater than 0. If the value is missing, null, less than or equal to 0, or non-numeric, the conversion event will not be triggered.

Currency

The pixel assumes that all incoming data uses the same currency as the Workspace currency.

Please ensure that currency conversion is handled on your end before firing an event in the same currency as the Workspace.

Did this answer your question?