Dynamic Remarketing Code for Shopify

 This is my second blog on How to add Google Dynamic Remarketing Tag/Code in Shopify. In the previous blog I have mention that, how can you setup dynamic remarketing code in Shopify by add codes in individual pages.

But here I am providing you simple code snipet to setup dynamic remarketing tag on your website.

Shopify Ecommerce

Instruction to setup dynamic remarketing:

1.) Login with Admin.

2.) Go to Online Store -> Themes.

3.) Add below code in main template file. before closing body tag (theme.liquid).

<!-- Google dynamic remarketing tag for home,product, category,cart and searchresult page ( theme.liquid )-->
    {% if template contains 'product' %}
        <script type="text/javascript">
            var json_product = {{ product | json }};
        </script>
        <script>
            var ecomm_prodid=[];
            for(var i=0;i<json_product.variants.length;i++)
                ecomm_prodid.push('shopify_US_{{product.id}}_'+json_product.variants[i].id);
        </script>
        <script type="text/javascript">
            var google_tag_params = {
                ecomm_prodid: ecomm_prodid,
                ecomm_pagetype: 'product',
                ecomm_totalvalue: {{ product.price | money_without_currency | remove: ","}}
            };
        </script>
    {% elsif template contains 'collection' %}
        <script type="text/javascript">
            var google_tag_params = {
                ecomm_pagetype: 'category',
                ecomm_totalvalue: 0
            };
        </script>
    {% elsif template contains 'cart' %}
        <script type="text/javascript">
            var google_tag_params = {
                ecomm_prodid: [{% for item in cart.items %}'shopify_US_{{item.product.id}}_{{item.variant.id}}',{% endfor %}],
                ecomm_pagetype: 'cart',
                ecomm_totalvalue: {{ cart.total_price | money_without_currency | remove: ","}}
            };
        </script>
    {% elsif template contains 'search' %}
        <script type="text/javascript">
            var google_tag_params = {
                ecomm_pagetype: 'searchresults',
                ecomm_totalvalue: 0
        };
        </script>
    {% elsif template contains 'index' %}
        <script type="text/javascript">
            var google_tag_params = {
                ecomm_pagetype: 'home',
                ecomm_totalvalue: 0
            };
        </script>
    {% else %}
        <script type="text/javascript">
            var google_tag_params = {
                ecomm_pagetype: 'other',
                ecomm_totalvalue: 0
            };
        </script>
    {% endif %}
<script type="text/javascript">
  /* <![CDATA[ */ 
  var google_conversion_id = XXXXXXXX; 
  var google_custom_params = window.google_tag_params; 
  var google_remarketing_only = true; 
  /* ]]> */
</script>
<script type="text/javascript" src="//www.googleadservices.com/pagead/conversion.js">
</script>
<noscript>
  <div style="display:inline;">
    	<img height="1" width="1" style="border-style:none;" alt="" src="//googleads.g.doubleclick.net/pagead/viewthroughconversion/XXXXXXXX/?value=0&guid=ON&script=0"/>
    </div>
</noscript>

To add Google Dynamic remarketing code in checkout(confirmation page):

4.) Go to  Setting -> Checkout.

5.) Add the below code in Additional content and script  box inside Order processing, for order confirmation page.

<!-- Google dynamic remarketing tag for Order Confirmation page -->
<script type="text/javascript">
  {% if order.cancelled %}
    var google_tag_params = {
    ecomm_pagetype: 'other',
    ecomm_totalvalue: 0
    };
  {% else %}
    	var google_tag_params = {
           ecomm_prodid: [{% for line_item in order.line_items %} 'shopify_US_{{line_item.product.id}}_{{line_item.variant.id}}', {% endfor %}],
           ecomm_pagetype: 'purchase',
           ecomm_totalvalue: {{ subtotal_price | money_without_currency | remove: ","}}
        };
  {% endif %}
</script>
<script type="text/javascript">
  /* <![CDATA[ */ 
  var google_conversion_id = XXXXXXXX; 
  var google_custom_params = window.google_tag_params; 
  var google_remarketing_only = true; 
  /* ]]> */
</script>
<script type="text/javascript" src="//www.googleadservices.com/pagead/conversion.js">
</script>
<noscript>
  <div style="display:inline;">
    	<img height="1" width="1" style="border-style:none;" alt="" src="//googleads.g.doubleclick.net/pagead/viewthroughconversion/XXXXXXXX/?value=0&guid=ON&script=0"/>
    </div>
</noscript>

Note:- Replace XXXXXXXX with conversion id of remarketing code. above code is just for reference, so you can modify as per Shopify version and UI interface of your website. Feel free to get in touch.

2 thoughts on “Dynamic Remarketing Code for Shopify

  1. Thanks for the code but why should you remove “,” when grabbing the price.
    For example why is remove:”,” needed here: {{ cart.total_price | money_without_currency | remove: “,” }}

    1. Here we have to use numeric or decimal value that’s why it is required to add {{ cart.total_price | money_without_currency | remove: “,” }}.
      there is no other specific reason for that. if you have some other solution , feel free to use it and don’t forget to share to us.

Leave a Reply to Quang Nguyen Cancel reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.