How to Add DoubleClick Floodlight Conversion & Remarketing Tags to Shopify
By 
If you run a Shopify ecommerce website and would like to add either a Google DoubleClick Floodlight Remarketing (Retargeting) Tag or a Google DoubleClick Floodlight Conversion Tag then the short and detailed guide below will walk you through how to set them up easily within your Shopify theme and admin area.
If a digital marketing agency has asked you or your web developers to place the code on the website for them then they’ll probably have sent you some example code using placeholders for the variables they require.
The example (unedited) DoubleClick Floodlight Remarketing / Retargetting Tag will look something like this:
Do this navigate to Online Store > Themes > Click on your main Liquid Theme file
To create the variables to automatically per-populate the Tag you would replace the placeholders with the following tags:
To create a current_url variable, so the tag knows which page the user was on, add the following just before the closing body tag </body> at the bottom of the file editor:
Note that the {{current_url}} variable is made in order to grab the URL in the noscript section ( when the user turns off javascript) and will not grab the cart URL and checkout URL. In order to grab the URL from the cart page and the checkout page we are going to make a new variable named newURL.
We can now swap the placeholders out with the correct Shopify variables or macros the Shopify DoubleClick Floodlight Remarketing Tag will need.
We can also, to keep things tidy, create a series or new variables, just based on existing liquid objects to better match the names used in the example tag code (including the page url, product name, product category and SKU number) which we’ve show below immediately under the opening javascript tag:
Once you swap these placeholders out with the correct Shopify variables or macros the Shopify DoubleClick Floodlight Remarketing / Retargeting Tag will finally look like the following:
To add your DoubleClick ready conversion tag into your shopify theme, simply:
You can test your setup or ask your digital agency to do this for you.
The example (unedited) DoubleClick Floodlight Conversion Tag it will look something like this:
If you have not added a remarketing tag as per above then complete Step 2 from the previous section in order to produce a current_url capture variable. If you’ve already done that then move on to Step 2 below.
Once you swap these placeholders out with the correct Shopify variables or macros the Shopify DoubleClick Floodlight Conversion Tag will finally look like the following:
To add your DoubleClick ready conversion tag into your shopify theme, simply:
You can test your setup or ask your digital agency to do this for you.
How to add the DoubleClick Floodlight Remarketing Tag to Shopify:
<!--
Start of DoubleClick Floodlight Tag: Please do not remove
Activity name of this tag: CLIENT NAME - Remarketing
URL of the webpage where the tag is expected to be placed: https://www.example.com
This tag must be placed between the <body> and </body> tags, as close as possible to the opening tag.
Creation Date: 07/20/2016
-->
<script type="text/javascript">// <![CDATA[
var axel = Math.random() + "";
var a = axel * 10000000000000;
document.write('<iframe src="https://0000000.fls.doubleclick.net/activityi;src=0000000;type=counter;cat=house0;u4=[product_name];u10=[page_url];u11=[product_catergory];u12=[Custom_1];u13=[Custom_2];u14=[SKU_ID];dc_lat=;dc_rdid=;tag_for_child_directed_treatment=;ord=' + a + '?" width="1" height="1" frameborder="0" style="display:none"></iframe>');
// ]]></script>
<noscript>
<iframe src="https://0000000.fls.doubleclick.net/activityi;src=0000000;type=counter;cat=house0;u4=[product_name];u10=[page_url];u11=[product_catergory];u12=[Custom_1];u13=[Custom_2];u14=[SKU_ID];dc_lat=;dc_rdid=;tag_for_child_directed_treatment=;ord=1?" width="1" height="1" frameborder="0" style="display:none"></iframe>
</noscript>
<!-- End of DoubleClick Floodlight Tag: Please do not remove -->
Step 1: Edit your Liquid Theme file
Step 2: Identify and/or create your custom variables
[Revenue] becomes {{transaction.amount}}
[product_name] becomes {{product.title}}
[page_url] becomes {{ current_url }}
[product_catergory] becomes {{product.type}}
[SKU_ID] becomes {{product.id}}
[OrderID] becomes {{transaction.id}}
Step 2: Create variables for the current_url
{% assign current_url = '' %}
{% case template %}
{% when 'page' %}
{% assign current_url = shop.url | append: page.url %}
{% when 'blog' %}
{% assign current_url = shop.url | append: blog.url %}
{% when 'article' %}
{% assign current_url = shop.url | append: blog.url %}
{% when 'collection' %}
{% assign current_url = shop.url | append: collection.url %}
{% when 'product' %}
{% assign current_url = shop.url | append: product.url %}
{% endcase %}
Step 3: Update your tag to include the variables
<script type="text/javascript">
var page_url = {{current_url|json}}
var product_name = {{product.title|json}}
var product_category = {{product.type|json}}
var SKU_ID = {{product.id|json}}
var newURL = window.location.protocol + "//" + window.location.host + window.location.pathname;
var axel = Math.random() + "";
var a = axel * 10000000000000;
document.write('<iframe src="https://0000000.fls.doubleclick.net/activityi;src=0000000;type=counter;cat=house0;u4=' + product_name + ';u10=' + newURL + ';u11=' + product_category + ';u12=[Custom_1];u13=[Custom_2];u14=' + SKU_ID + ';dc_lat=;dc_rdid=;tag_for_child_directed_treatment=;ord=' + a + '?" width="1" height="1" frameborder="0" style="display:none"></iframe>');
</script>
<noscript>
<iframe src="https://0000000.fls.doubleclick.net/activityi;src=0000000;type=counter;cat=house0;u4={{product.title}};u10={{ current_url }};u11={{product.type|json}};u12=[Custom_1];u13=[Custom_2];u14={{product.id|json}};dc_lat=;dc_rdid=;tag_for_child_directed_treatment=;ord=1?" width="1" height="1" frameborder="0" style="display:none"></iframe>
</noscript>
<!-- End of DoubleClick Floodlight Tag: Please do not remove -->
Step 4: Add the remarketing tag to Shopify
How to add the DoubleClick Floodlight Conversion Tag to Shopify:
<!--
Start of DoubleClick Floodlight Tag: Please do not remove
Activity name of this tag: CLIENT NAME - Conversion
URL of the webpage where the tag is expected to be placed: https://www.example.com
This tag must be placed between the <body> and </body> tags, as close as possible to the opening tag.
Creation Date: 07/20/2016
-->
<iframe style="display: none;" src="https://0000000.fls.doubleclick.net/activityi;src=0000000;type=sale;cat=house0;qty=1;cost=[Revenue];u4=[product_name];u10=[page_url];u11=[product_catergory];u12=[Custom_1];u13=[Custom_2];u14=[SKU_ID];dc_lat=;dc_rdid=;tag_for_child_directed_treatment=;ord=[OrderID]?" width="1" height="1" frameborder="0"></iframe>
<!-- End of DoubleClick Floodlight Tag: Please do not remove -->
Step 1: Create your custom variables
Step 2: Update your tag to include the variables
<!--
Start of DoubleClick Floodlight Tag: Please do not remove
Activity name of this tag: CLIENT NAME - Conversion
URL of the webpage where the tag is expected to be placed: https://www.example.com
This tag must be placed between the <body> and </body> tags, as close as possible to the opening tag.
Creation Date: 07/20/2016
-->
<iframe style="display: none;" src="https://0000000.fls.doubleclick.net/activityi;src=0000000;type=sale;cat=house0;qty=1;cost={{transaction.amount}};u4={{product.title}};u10={{ current_url }};u11={{product.type}};u12=[Custom_1];u13=[Custom_2];u14={{product.id}};dc_lat=;dc_rdid=;tag_for_child_directed_treatment=;ord={{transaction.id}}?" width="1" height="1" frameborder="0"></iframe>
<!-- End of DoubleClick Floodlight Tag: Please do not remove -->
Step 3: Add the conversion tag to Shopify
