How to Implement Google AdWords gtag.js on Shopify

See how to implement the new AdWords gtag sitewide and gtag conversion snippet in Shopify.

[last updated 3/12/18]

Gtags, conversion tags, gtm tags, data layers, conversion linker, Javascript. Is your head spinning with all of the tag talk?

You’re not alone. In the world of tagging and conversion tracking, all of the constant changes can be quite overwhelming!

This post shows you how I’ve implemented the AdWords conversion tag using the new gtag.js version. Moving to gtag.js isn’t mandatory, but it’s something you’ll likely want to do (eventually) to keep up with the latest Google best practices.

In order to implement gtag conversion tags you’ll need to ensure you have the global remarketing gtag script as well. So there are two steps:

  1. Implement global gtag
  2. Implement custom conversion gtag snippet

You’ll need access to:

  1. Google AdWords
  2. Shopify Admin
  3. Google Tag Manager (if you want to implement via GTM)

Want us to implement for you? Contact us here.

Automated Google Analytics Insights

See how Elevar automates insights, forecasting, and custom reports for eCommerce.

Step 1: Ensure Sitewide gtag Implemented

Option A)

If you’ve already updated your Google Analytics tracking code to be the new gtag version then you can copy this snippet from AdWords:

NOTE: If you are copying the GA gtag into the Shopify admin and you’re concerned about Shopify’s gtag support then implement via option b to ensure the global gtag is in place. As of the last update on this post, Shopify was not supporting the gtag when copying your GA code into the Shopify Google Analytics configuration settings in the admin.


Into your “Additional Scripts” setting within Shopify:


Option B)

You can copy the full gtag script shown below:


And paste into a Custom HTML tag in GTM:

adwords remarketing gtag

Step 2: Implement Conversion Snippet gtag Event

You have two options for this step as well:

  1. Implement in Shopify Admin
  2. Implement via GTM

Option A) Implement via Shopify Admin

You can implement within the Shopify admin directly in the Checkout scripts section. Just copy your Event snippet from AdWords:

gtag conversion event snippet

Replace the value, currency, and transaction_id variables:

 gtag('event', 'conversion', {
 'send_to': '[insert your own ID here]',
 'value': {{ total_price | money_without_currency | remove: ',' }},
 'currency': 'USD',
 'transaction_id': '{{order.order_number}}'

You’ll notice the remove ‘,’ which supports international currencies that have commas in pricing.

Then copy into your Shopify checkout scripts as shown below::


That’s it! Easy enough….now to show option B via GTM:

Option B) Implement via GTM

This step is a bit more work but will show you how to implement via Google Tag Manager.

Step 1: Custom Javascript Variables

If you already have a data layer in Google Tag Manager that has order total and transaction ID variables then you can skip this and move to step 2.

Otherwise you’ll need to create these variables to capture the dynamic order data needed.

First, create order total variable:

js variable for shopify order total

Then repeat this for creating a transaction ID:

shopify transaction id custom js gtm variable

Step 2: Create Trigger for Checkout Complete Page:

In this step we’ll create a trigger to ensure this fires on the first time a user completes a purchase and reaches the order success page only.

shopify checkout success gtm page path trigger

Step 3: Implement AdWords gtag.js

Now we need to copy our gtag event snippet into GTM so we can update the variables and assign our trigger:

adwords gtag gtm custom tag

Step 4: Verify Tags and Variables

Now that you’ve finished your tag, go into preview mode in GTM and view the order success page with data layer variables:



And you can also view the order success page with the AdWords tag successfully displaying the order values:


Wrap Up

That’s it! Hopefully this didn’t make things more complicated when trying to decide how to implement AdWords gtag on Shopify.

Remember there are two steps required:

  1. Implement the global gtag
  2. Implement the custom conversion gtag event snippet

If you have any questions or issues please leave a comment.

Related Articles:

Shopify Marketing & Analytics Tips

Sign up to receive our latest posts on how to optimize Shopify.

We respect your inbox.

Brad Redding

Brad, co-founder of Elevar, has lived in eCommerce for over 12 years. He's helped design, build, and optimize over 100 websites in his career. From new retail startups to well-known brands like Le Creuset, Signature Hardware, Rebecca Minkoff, Char-Broil and more, he specializes in data analytics and conversion optimization to help achieve business goals.

Leave a Reply

Your email address will not be published. Required fields are marked *