Implementing the Made with Intent script via Google Tag Manager (GTM) provides you with the flexibility to be in control of the data you send to our product. This document details the end to end set-up process, to get your tracking up and running in no time.
The Made with Intent script has 4 templates available in GTM:
Main Tag: to handle the initial set up of the tool
Page View Tag: to handle all page view information and product details
Add to Cart Tag: to pass through add to cart events
Conversion Pixel: to pass transaction information
GTM Tag Templates
The Made with Intent tags exist in the Google Community Template Gallery
To import a tag, Choose Discover more tag types in the Community Template Gallery when adding a new tag in the tag configuration.
This will add the tag to your workspace.
Note: tags are published by madewithintent-labs
Import all tags as per below.
Main Tag
Template Name: Made with Intent Tag
The Main Tag should fire before any of the other Made with Intent Tags. We recommend using Tag Sequencing in Google Tag Manger to fire the Page View Tag after the Main Tag has been loaded (see below).
Required Fields
The Main Tag requires only 3 inputs:
Ingestion ID - Provided by the Made with Intent team e.g. mwit-abcde12f3gh4-i
Country Code - A two-letter country code or identifier e.g. 'US' or 'GB’
Language Code - A two-letter language code or identifier e.g. 'en' or 'us’
Optional Configurations
By default, the Intent tag will push data to your dataLayer for potential consumption by GTM.
In the “Advanced Configuration” you can both define the name of your data layer (by default this is set to dataLayer) and you can disable the Intent tag from pushing data to your dataLayer if required.
Tag Firing
We recommend you fire the Made with Intent Main Tag after your visitors have accepted analytics cookie consent. If you’re using consent mode, you may wish to use analytics_storage for the consent type.
Your final tag setup should look something like the below:
Page View Tag
Template Name: Made with Intent Pageview
The Page View Tag should fire on every page. If you have an SPA, ensure the trigger fires for each newly navigated page.
Required Fields
The Page View Tag only has 1 required input:
Page Type - The page type should send information on the page type. The expected values are; home, plp, pdp, account, login, cart, search, checkout or confirmation.
All other pages should be defined as content page types. See information below on the GTM Lookup tables or for a Custom Javascript scripts to help with this.
GTM Lookup Tables
GTM Lookup Tables
GTM Lookup Tables can be used to overwrite default page type variables that already exist e.g. if your current page type is set to “Product”, for example, in order to work with Made with Intent it would need to be redefined as “pdp”. The below shows an example of a Page Type lookup table solution:
Alternatively, you can also utilise RegEx Tables to use the page URL to map page types against URLs if you are comfortable with RegEx and have a mapping for your pages e.g.
GTM Custom Javascript Example
GTM Custom Javascript Example
Using custom JavaScript is a way to ensure that the value of page type is one of the expected values for our tracking.
You can use any existing references to explicitly define page type.
Create a custom variable of type Custom Javascript
Return a string value for page type based on your own custom logic. An example is shown below
// This variable is reference in page view tags
// Map from the datalayer, URL, or using DOM elements to the
// Intent defined page types
//
// Intent Defined Page Types:
//
// content, home, login, account,
// plp, pdp, search, cart,
// checkout, confirmation
//
// This example uses a combination of checks to return a
// page type - you can add any logic you wish
function (){
var pageType = {{MWI - dataLayer - pageType}};
var currentPageUrl = window.location.href;
var result = 'content';
if(pageType == 'product') {
result = 'pdp';
} else if(pageType == 'Home') {
result = 'home';
} else if(currentPageUrl.includes('product-listing')) {
result = 'plp';
} else if(currentPageUrl.includes('checkout')) {
result = 'checkout';
} else if(currentPageUrl.includes('basket')) {
result = 'cart';
} else if(currentPageUrl.includes('thank-you')) {
result = 'confirmation';
}
return result;
}
Ecommerce Configurations
The Ecommerce Fields in the Page View tag are used to improve the quality of insight and segmentation you can get from our product. Whilst these values are optional, we do recommend you set these up, in order to unlock the full power of Made with Intent. All Ecommerce fields are standard data points that would exist in a Google Analytics 4 (GA4) implementation.
The following information will only pass when the visitor is on a ‘pdp’ page type:
Reference | Description | Type | Example |
Product Name* | The product name | string | Standard Black T-Shirt |
Product SKU* | The product or item SKU | string | 1234567 |
Price* | The product price | number | 49.99 |
Currency | The visitors current currency code | string | GBP |
Brand* | The product brand | string | Nike |
Category* | The product category | string | T-Shirts |
Subcategory* | The product sub-category | string | Sport T-Shirts |
Variant | The product variant name or item ID | string | Black or “V-123456” |
Availability | The product stock status, where 1 is in stock and 0 is out of stock | number | 0 |
Product On Sale | The product on sale status, where 1 is in on sale and 0 is not | number | 1 |
*Used to help configure segments in the Made with Intent platform
Add to Cart Tag
Template Name: Made with Intent Add To Cart
The Add to Cart tag should fire whenever there is a successful Add to Cart.
There are no additional required fields to pass through with this tag, however we recommend also passing the ecommerce variables defined in the Page View Tag.
Conversion Pixel
Template Name: Made with Intent Purchase
The Conversion Pixel should fire whenever there is a successful Order / Transaction.
There are no required fields to pass through with this tag, however we recommend passing the ecommerce variables defined below.
Reference | Description | Type | Example |
Order Value | The total order value paid by the customer | number | 99.99 |
Order Currency | The visitors current currency code | string | GBP |
Shipping Fee | The shipping / delivery cost | number | 2.99 |
Coupon Code | The coupon code(s) attached to the order | string | SAVE10 |
Order Items | An array of order items (see example below) | array |
|
Discount Amount | The total amount that the customer saved on their order | number | 10.00 |
Order Items
Order Items
Order Items has the following structure:
[
{
product_id: "<product id or sku>",
item_value: "<final sale value per item>",
item_quantity: "<quantity of item purchased>",
item_discount_value: "<discount per item or 0>",
},
...
]
In order to pass the correct format through to Order Items, you can use the example Javascript below as a Custom Variable.
Most customers create a datalayer variable (e.g. {{dataLayer - ecommerce object}}) that references ecommerce in the datalayer, and use that to return a mapping of the items in the order.
Modify the references to fields defined on the items as per your configuration:
function (){
var order = {{dataLayer - ecommerce object}}; // ref to ecommerce event
if(!order) {
return [];
}
//define your order items in the data layer
var items = (order.items || []).map(function(item) {
return {
product_id: item.sku || '',
item_value: parseFloat(item.salePrice || 0),
item_quantity: parseInt(item.quantity || 1),
item_discount_value: parseFloat(item.discount || 0),
};
});
return items;
}
