Shopify Plus CartInsight implementation

Contents

Implement CartInsight for Shopify
Testing

Summary

This article provides you with an example script that helps you, as a Shopify Plus store owner, implement CartInsight JSON in your store. On top of the Shopify Plus connector's abandoned baskets automation function (triggering on abandoned checkouts), this in turn will allow you to trigger abandoned basket enrolment for identified customers leaving items in their basket without having yet started the checkout process.

We recommend that you turn off the default abandoned basket enrolment settings of your connector to avoid any potential enrolment conflicts or duplications.

Below is an example of the script you need to include in your store's pages. 

Before implementing the script...

You'll need to:

  • contact us to be given a CartInsight ID
  • disable the default abandoned basket enrolment in the Shopify Plus connector

    shopify_enrol_abandoned_baskets.jpg
Read more about CartInsight in our 'Abandoned carts' section »

Implement CartInsight for Shopify

In order to track your customers' carts as soon as they're identified on your store, please follow these steps:

    1. Log into your Shopify Admin
    2. Go to SALES CHANNELS > Online Store > Themes
    3. Click on Actions > Edit Code

      shopify_cartinsight_edit_theme_code.png
    4. Find and edit the file theme.liquid
    5. If you haven't done this before, insert your tracking script before the </head> tag
    6. Before the </body> tag, copy and paste the following script:
      <script>
      // Abandoned Cart process only kicks off if customer is identified and accepts email marketing. {% if customer.email and customer.accepts_marketing %} // Identify user by their email address dmPt("identify", "{{ customer.email }}"); dmPt("cartInsight", { "programID": %programID%, // replace with your Abandoned Cart program ID "cartDelay": %cartDelay%, // cart delay in minutes e.g. 25 "cartID": {{ "now" | date: "%Y%m%d" | append: customer.id}}, // will generate a new cart id everyday "cartPhase": "CUSTOMER_LOGIN", "currency": "{{ shop.currency }}", "subtotal": {{ cart.total_price | money_without_currency }}, "discountAmount": {{ cart.original_total_price | minus: cart.total_price | money_without_currency }}, "taxAmount": 0, "grandTotal": {{ cart.total_price | money_without_currency }}, "cartUrl": "{{ shop.url }}/cart/{% for item in cart.items %}{{item.variant_id}}:{{ item.quantity }}{% if forloop.index < cart.item_count %},{% endif %}{% endfor %}", "lineItems": [ {% for item in cart.items %} { "sku": "{{ item.sku }}", "name": "{{ item.title }}", "description": "{{ item.product.description | strip_html | escape | strip_newlines }}", "category": "{% for collection in item.product.collections %}{{ collection.title }} {% endfor %}", "other": "{% for tag in product.tags %}{{ tag }} {% endfor %}", "unitPrice": {{ item.original_price | money_without_currency }}, "salePrice": {{ item.price | money_without_currency }}, "quantity": {{ item.quantity }}, "totalPrice": {{ item.line_price | money_without_currency }}, "imageUrl": "{{ item.image | img_url: 'small'}}", "productUrl": "{{ shop.url }}{{ item.url}}", } {% if forloop.index != cart.item_count %},{% endif %} {% endfor %} ] }); {% endif %}

      </script>
    7. Make sure you replace the values of %programID% and %cartDelay% in minutes
    8. Save theme.liquid
    9. To prevent abandoned cart emails being sent if an order is complete, navigate to Settings > CheckoutOrder processing and paste the following script in Additional scripts:
      <script>
      var dm_insight_id ='%CartinsightID%';
      (function(w,d,u,t,o,c){w['dmtrackingobjectname']=o;c=d.createElement(t);c.async=1;c.src=u;t=d.getElementsByTagName
      (t)[0];t.parentNode.insertBefore(c,t);w[o]=w[o]||function(){(w[o].q=w[o].q||[]).push(arguments);};w[o]('track');
      })(window, document, '//static.trackedweb.net/js/_dmptv4.js', 'script', '

      // Abandoned Cart process only kicks off if customer is identified and accepts email marketing. {% if customer.email and customer.accepts_marketing %} // Identify user by their email address dmPt("identify", "{{ customer.email }}"); dmPt("cartInsight", { "programID": %programID%, // replace with your Abandoned Cart program ID "cartDelay": %cartDelay%, // cart delay in minutes e.g. 25 "cartID": {{ "now" | date: "%Y%m%d" | append: customer.id}}, // will generate a new cart id everyday "cartPhase": "ORDER_COMPLETE"
      });
      {% endif %}
      </script>
    10. Save and test

Testing

We recommend thorough testing of the whole abandoned cart process on your development store before rolling out your changes. You can also filter out contacts as they enter your abandoned cart program using exit criteria or decision nodes.

  • Once the scripts above are in place, log into your store, start adding some items in the cart and log out
  • Wait a few minutes, head to the 'Manage contact' page of the customer in dotmailer, click on the Insight data tab and check that the CartInsight record has been synchronised correctly
  • Wait a few more minutes (depending on the cart delay as set above) and verify that your contact has successfully entered the selected program
Have more questions? Submit a request

Comments