ғᴇᴇᴅ ᴍᴀɴᴀɢᴇᴍᴇɴᴛ

Google Shopping Data Generator

Adding Google Adwords Remarketing Tag To Shopify

by · Updated on 9 November, 2018

 

Adding Google Adwords Remarketing Tag To Shopify

An easy step by step guide on how to add a remarketing tag for both category and product pages

Step 1)

Login to your Shopify Admin Panel

 

Shopify Login

Step 2)

Open up the theme editor by going to Online Store > Themes

Shopify Theme Editing

 

Step 3)

In the top right corner click on actions. A menu will appear and click on Edit HTML/CSS

Shopify Theme Actions Edit HTML

 

Step 4 )

Click on theme.liquid inside the layout folder.

Shopify Theme Liquid

Step 5 )

Login to Google Adwords, then in the top right corner click on the 3dot menu and select Audience Manager from the Shared Library section

Google Adwords Audience Manager


If you already have a remarketing code, skip this section and go to the next section with continue here.

Click on setup audience list

Google Adwords Setup Audience List

Then click on setup tag

Google Adwords Setup Tag

From the left hand, menu click on Audience Source and click on the 3dot menu and choose edit source within the Adwords tag section

Google Adwords Audience Sources

Select the following (continue here)

  • Dynamic Remarketing
    • Collect specific attributes or parameters to personalize ads
  • Business Type
    • Retail
  • Retail Parameters
    • ecomm_pagetype
    • ecomm_prodid
    • ecomm_totalvalue

Google Adwords Tag Data Source

Than download snippet

Step 6 )

At the bottom of the file before the closing </body> tag, paste the code below.

Important! :

  1. Change the XX-XXXXXXXXX three times with the value found in your downloaded script example gtag(‘config’, AW-123456798‘);
    1. <script async src=”https://www.googletagmanager.com/gtag/js?id=XX-XXXXXXXXX”></script>
    2. gtag(‘config’, ‘XX-XXXXXXXXX’);
    3. ‘send_to’: ‘XX-XXXXXXXXX’,
  2. Change the ecomm_prodid country code to yours.
    1. For example: if your store is in the US, then change shopify_GB_ to shopify_US_

Prices with comma separator

{% if template contains 'product' or template contains 'collection' or template contains 'index' or template contains 'search' %}
<!-- Global site tag (gtag.js) - AdWords. Created by FeedArmy.com -->
<script async src="https://www.googletagmanager.com/gtag/js?id=XX-XXXXXXXXX"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'XX-XXXXXXXXX');
</script>
<script>
  gtag('event', 'page_view', {
    'send_to': 'XX-XXXXXXXXX',
	'ecomm_pagetype': '{% if template contains 'collection' %}category{% elsif template contains 'product' %}product{% elsif template contains 'search' %}{% elsif template contains 'index' %}home{% endif %}',
	{% if template contains 'product' %}
	'ecomm_prodid': 'shopify_GB_{{ product.id }}_{% if product.variants.first.id %}{{ product.variants.first.id }}',{% else %}{{ product.variants.id }}',{% endif %}
	{% endif %}
	{% if template contains 'product' %}'ecomm_totalvalue': {{ product.price_min | money_without_currency | remove:',' }}{% endif %}
  });
</script>
{% endif %}

Prices with decimal separator

{% if template contains 'product' or template contains 'collection' or template contains 'index' or template contains 'search' %}
<!-- Global site tag (gtag.js) - AdWords. Created by FeedArmy.com -->
<script async src="https://www.googletagmanager.com/gtag/js?id=XX-XXXXXXXXX"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'XX-XXXXXXXXX');
</script>
<script>
  gtag('event', 'page_view', {
    'send_to': 'XX-XXXXXXXXX',
	'ecomm_pagetype': '{% if template contains 'collection' %}category{% elsif template contains 'product' %}product{% elsif template contains 'search' %}{% elsif template contains 'index' %}home{% endif %}',
	{% if template contains 'product' %}
	'ecomm_prodid': 'shopify_GB_{{ product.id }}_{% if product.variants.first.id %}{{ product.variants.first.id }}',{% else %}{{ product.variants.id }}',{% endif %}
	{% endif %}
	{% if template contains 'product' %}'ecomm_totalvalue': {{ product.price_min | money_without_currency | replace: ',', '.' }}{% endif %}
  });
</script>
{% endif %}

Step 7)

Add the remarketing code to cart.liquid at the bottom of the file

Click on cart.liquid within your Templates

 

Shopify Cart Liquid

Important! :

  1. Change the XX-XXXXXXXXX three times with the value found in your downloaded script example gtag(‘config’, AW-123456798‘);
    1. <script async src=”https://www.googletagmanager.com/gtag/js?id=XX-XXXXXXXXX”></script>
    2. gtag(‘config’, ‘XX-XXXXXXXXX’);
    3. ‘send_to’: ‘XX-XXXXXXXXX’,
  2. Change the ecomm_prodid country code to yours.
    1. For example : if your store is in the US, than change shopify_GB_ to shopify_US_
  3. Paste the final code at the bottom of the file

Prices with comma separator

<!-- Global site tag (gtag.js) - AdWords. Created by FeedArmy.com -->
<script async src="https://www.googletagmanager.com/gtag/js?id=XX-XXXXXXXXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());

gtag('config', 'XX-XXXXXXXXX');
</script>
<script>
gtag('event', 'page_view', {
'send_to': 'XX-XXXXXXXXX',
	'ecomm_pagetype': 'cart',
	{% if cart.item_count > 1 %}
	'ecomm_prodid': [{% for item in cart.items %}'shopify_GB_{{ item.product_id }}_{{ item.variant_id }}',{% endfor %}],
	{% else %}
	'ecomm_prodid': [{% for item in cart.items %}'shopify_GB_{{ item.product_id }}_{{ item.variant_id }}'{% endfor %}],
	{% endif %}
	'ecomm_totalvalue': {{ cart.total_price | money_without_currency | remove:',' }}
});
</script>

Prices with decimal separator

<!-- Global site tag (gtag.js) - AdWords. Created by FeedArmy.com -->
<script async src="https://www.googletagmanager.com/gtag/js?id=XX-XXXXXXXXX"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'XX-XXXXXXXXX');
</script>
<script>
  gtag('event', 'page_view', {
    'send_to': 'XX-XXXXXXXXX',
	'ecomm_pagetype': 'cart',
	{% if cart.item_count > 1 %}
	'ecomm_prodid': [{% for item in cart.items %}'shopify_GB_{{ item.product_id }}_{{ item.variant_id }}',{% endfor %}],
	{% else %}
	'ecomm_prodid': [{% for item in cart.items %}'shopify_GB_{{ item.product_id }}_{{ item.variant_id }}'{% endfor %}],
	{% endif %}
	'ecomm_totalvalue': {{ cart.total_price | money_without_currency | replace: ',', '.' }}
  });
</script>

Step 8)

Add the remarketing code to the checkout thank you page

Click on Settings > Checkout, on the page scroll down to the section Order Processing

Important! :

  1. Change the XX-XXXXXXXXX three times with the value found in your downloaded script example gtag(‘config’, AW-123456798‘);
    1. <script async src=”https://www.googletagmanager.com/gtag/js?id=XX-XXXXXXXXX”></script>
    2. gtag(‘config’, ‘XX-XXXXXXXXX’);
    3. ‘send_to’: ‘XX-XXXXXXXXX’,
  2. Change the ecomm_prodid country code to yours.
    1. For example: if your store is in the US then change shopify_GB_ to shopify_US_

Prices with comma separator

<!-- Global site tag (gtag.js) - AdWords. Created by FeedArmy.com -->
<script async src="https://www.googletagmanager.com/gtag/js?id=XX-XXXXXXXXX"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'XX-XXXXXXXXX');
</script>
<script>
  gtag('event', 'page_view', {
    'send_to': 'XX-XXXXXXXXX',
	'ecomm_pagetype': 'purchase',
	'ecomm_prodid': [{% for item in checkout.line_items %}'shopify_GB_{{ item.product_id }}_{{ item.variant_id }}',{% endfor %}],
	'ecomm_totalvalue': {{ checkout.total_price | money_without_currency | remove:',' }}
  });
</script>

Prices with decimal separator

<!-- Global site tag (gtag.js) - AdWords. Created by FeedArmy.com -->
<script async src="https://www.googletagmanager.com/gtag/js?id=XX-XXXXXXXXX"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'XX-XXXXXXXXX');
</script>
<script>
  gtag('event', 'page_view', {
    'send_to': 'XX-XXXXXXXXX',
	'ecomm_pagetype': 'purchase',
	'ecomm_prodid': [{% for item in checkout.line_items %}'shopify_GB_{{ item.product_id }}_{{ item.variant_id }}',{% endfor %}],
	'ecomm_totalvalue': {{ checkout.total_price | money_without_currency | replace: ',', '.' }}
  });
</script>

Important Info (optional)


Important :
It is important that the product id matches that of the data feed, so if you are using the standard Shopify application or a tool that uses Shopify’s default id’s, then use the default code. If you are using the SKU or simply product ID as your identifier than please read below.

The below code replacement is for step 6 only

Change From :

{% if template contains 'product' %}
'ecomm_prodid': 'shopify_GB_{{ product.id }}_{% if product.variants.first.id %}{{ product.variants.first.id }}',{% else %}{{ product.variants.id }}',{% endif %}
{% endif %}

Using SKU’s as Product ID

If your product data feed uses SKU’s as product ID then change to :

{% if template contains 'product' %}
'ecomm_prodid': '{% if product.variants.first.id %}{{ product.variants.first.sku }}',{% else %}{{ product.variants.sku }}',{% endif %}
{% endif %}

Using the Simple Identifier as Product ID

If your product data feed uses simple identifiers as product ID then change to :

{% if template contains 'product' %}'ecomm_prodid': '{{ product.id }}',{% endif %}

The below code replacement is for step 7 only

Change From :

{% if cart.item_count > 1 %}
‘ecomm_prodid’: [{% for item in cart.items %}’shopify_GB_{{ item.product_id }}_{{ item.variant_id }}’,{% endfor %}],
{% else %}
‘ecomm_prodid’: [{% for item in cart.items %}’shopify_GB_{{ item.product_id }}_{{ item.variant_id }}'{% endfor %}],
{% endif %}

Using SKU’s as Product ID

If your product data feed uses SKU’s as product ID then change to :

{% if cart.item_count > 1 %}
'ecomm_prodid': [{% for item in cart.items %}'{{ item.sku }}',{% endfor %}],
{% else %}
'ecomm_prodid': [{% for item in cart.items %}'{{ item.sku }}'{% endfor %}],
{% endif %}

Using the Simple Identifier as Product ID

If your product data feed uses simple identifiers as product ID then change to :

{% if cart.item_count > 1 %}
'ecomm_prodid': [{% for item in cart.items %}'{{ item.product_id }',{% endfor %}],
{% else %}
'ecomm_prodid': [{% for item in cart.items %}'{{ item.product_id }'{% endfor %}],
{% endif %}

The below code replacement is for step 8 only

Using SKU’s as Product ID

Change From :

'ecomm_prodid': [{% for item in checkout.line_items %}'shopify_GB_{{ item.product_id }}_{{ item.variant_id }}',{% endfor %}],

If your product data feed uses SKU’s as product ID then change the line for ecomm_prodid to the following

'ecomm_prodid':[{% for item in checkout.items %}'{{ item.sku}}',{% endfor %}],

Using the Simple Identifier as Product ID

If your product data feed uses simple identifiers as product ID then change the line for ecomm_prodid to the following

'ecomm_prodid':[{% for item in checkout.items %}'{{ item.product_id }}',{% endfor %}],

Checking If It Works

Currently as of writing, Google Tag Assistant does not check which values are added in the gtag remarketing code, they should have this ready by next year. So you will need to look at the source code, to confirm.


Important!
Google Tag Assistant will show a red label if you have an ad blocker installed on your browser. Disable or remove the ad blocker to see a blue icon.

You can do this by right-clicking on the website then choose view page source and search for gtag (ctrl+f), then simply check the values that are added.

You should see something similar as below.

<!-- Global site tag (gtag.js) - AdWords:  -->
<script async src="https://www.googletagmanager.com/gtag/js?id=xx-123456789123"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'xx-123456789123');
</script>
<script>
  gtag('event', 'page_view', {
    'send_to': 'xx-123456789123',
	'ecomm_pagetype': 'product',
	'ecomm_prodid': 'shopify_GB_132465798132_3132465179813',
	'ecomm_totalvalue': 19.99
  });
</script>

Need Help?