How to Integrate with Google Tag Manager (GTM)

Setting up Mention Me through Google Tag Manager (GTM) is a flexible and powerful way to launch your referral programme with minimal development effort. In this guide, you’ll learn how to configure your data layer, create the necessary data variables, and implement the core Mention Me tags—Referrer, Referee, Landing Page, and Dashboard—using GTM.

We’ll walk you through each step, from defining key customer information in your data layer to setting up triggers, testing in GTM’s preview mode, and publishing live tags. You’ll also find example scripts, guidance on trigger setup, and links for deeper GTM support.

Whether you're implementing for the first time or updating an existing setup, this guide will ensure your referral journey is functional, seamless, and ready to convert your happy customers into brand advocates.

Your Datalayer

Check the information in your data layer

Include first name, surname, email address, order total, order currency and, if running referral in multiple languages, locale.

Also, enter the name of each variable added for the JavaScript code. These must match your JavaScript. Repeat for first name, surname, email, locale, order total and order currency.

For more information about the data layer, see: GTM Data Layer Dev Guide

Data Variables

Add data variables to Google Tag Manager

Create a variable for each parameter (name, surname, email, order_number, order_subtotal, order_currency, locale, coupon_code)

In GTM, go to Variables:

• Click NEW under User-Defined Variables
• Click Choose a variable type…
• Choose Data Layer Variable, add a variable name
• Save

Tag Implementation

Set up the tags

The basic integration consists of 3 tags: referrer, referee and landing page.

In GTM, go to Tags. For each tag:

• Click NEW
• Click Choose a tag type…
• Choose Custom HTML, name the tag
• Add the tag and select triggering
• Save

Here’s a recap of tags and triggers (ask your Onboarding Project Manager for additional scripts/promotion points—and for your Partner Code).

Referrer tag

Replace each variable in curly brackets with your data layer variable name. For example:

<script type="text/javascript" src="https://tag-demo.mention-me.com/api/v2/referreroffer/yourPartnerCodeGoesHere?situation=postpurchase&email={{email}}&surname={{surname}}&firstname={{firstname}}&locale={{locale}}&order_currency={{order_currency}}&order_subtotal={{total}}&order_number={{order_number}}&coupon_code={{coupon_code}}"></script>

Trigger

• Scroll to Triggering and click Choose a trigger…
• Click + to add a new trigger
• Choose Custom Event (e.g., on purchase), or Page View – DOM Ready (e.g., when URL contains “confirmation”)

Referee tag

<script type="text/javascript" src="https://tag-demo.mention-me.com/api/v2/refereefind/yourPartnerCodeGoesHere?situation=checkout&locale={{locale}}"></script>

Trigger:

• Add a new trigger: usually Custom Event (e.g. “Proceed to checkout”), Page View – DOM Ready (e.g. when URL contains “checkout”), or History Change (for SPAs).

You’ll also need to add this div next to your coupon code box:

<!-- Begin Mention Me referee placeholder div -->
<div id="mmWrapper"></div>
<!-- End Mention Me referee placeholder div -->

Landing page tag

<script type="text/javascript" src="https://tag-demo.mention-me.com/api/v2/referreroffer/yourPartnerCodeGoesHere?situation=landingpage&locale={{locale}}"></script>

Trigger:

• Add a new Page View – DOM Ready trigger (e.g., when URL contains “refer-a-friend”)

You’ll also need to create the landing page and add:

<!-- Begin Mention Me referrer placeholder div -->
<div id="mmWrapper"></div>
<!-- End Mention Me referrer placeholder div -->

Dashboard (within account page) tag

Replace variables in curly brackets with your data layer variable names. For example:

<!-- Begin Mention Me dashboard integration -->
<script type="text/javascript">
// Always clear the link/checkout situation before loading. This will ensure the
// Mention Me tag will be shown on refresh or page change.
if (window.MentionMeFiredTags != undefined && window.MentionMeFiredTags != '') {
var situation = 'dashboard';
var implementation = 'embed';
if (window.MentionMeFiredTags[implementation + situation] == true) {
delete window.MentionMeFiredTags[implementation + situation];
}
}
</script>
<script src="https://tag-demo.mention-me.com/api/v2/dashboard/yourPartnerCodeGoesHere?email={{email}}&surname={{surname}}&firstname={{firstname}}&locale={{locale}}&situation=dashboard&implementation=embed"/>
<!-- End Mention Me dashboard integration --> 

Trigger:

• Add a new Page View – DOM Ready trigger (e.g., when URL contains “dashboard”)

Create a dashboard page within your Customer Account area, then add:

<!-- Begin Mention Me dashboard placeholder div -->
<div id="mmWrapper"></div>
<!-- End Mention Me dashboard placeholder div -->

Testing

Test values using preview mode

Use preview mode to place an order on your live site and check you have set up the variables correctly. You can also give us access to the GTM Preview so we can test the tags.

Publish

Publish the tags

Once the demo tags have been tested, remove the -demo from the tag URLs and publish live.

• Click Submit
• Choose public
• Create a version
• Add name and description
• Publish

For more information about publishing tags on GTM, please visit: GTM Tag Publishing