1. Help Center
  2. Integrations
  3. Ecommerce Platform Integrations

Shopify Setup

Initial Shopify setup requires the installation of the Voyage tracking code and purchase pixel into your Shopify admin account.

Requirements

  • Admin rights in Shopify store
  • Obtain your Client ID number, found in your Voyage dashboard under Settings—>Company—>Client ID

Tracking Code

For the tracking code, please follow these instructions:

  1. In your Shopify admin, click Online Store. Then, click Themes.
  2. Make sure you are working in the most “Current Theme” (the one at the top.) Click the Action drop-down and select Edit Code.
  3. Open the theme.liquid file from the left column. This is usually found under the Layout folder.
  4. Paste the code snippet (shown below, and also located in your Voyage dashboard under Settings—>Tracking) just below the head tag in the theme.liquid code section.
    1. Important: Replace 'Client_ID' in the code below with the Client ID found in your Voyage dashboard under Settings—>Company—>Client ID (if you are copying the code from Settings—>Tracking rather than from the snippet below, your Client ID is already added to the code).
  5. Click Save.
  6. Important: Make sure to disable your current email modal on your mobile web page.
<script type="text/javascript">
/* <![CDATA[ */
(function(){if(window.voyage)return;window.voyage={q:[]};var fns=['init','event','track'];
for(var i=0;i<fns.length;i++){(function(fn){window.voyage[fn]=function(){
this.q.push([fn,arguments]);}})(fns[i])}})();voyage.init('Client_ID', { popup: true });
/* ]]> */
</script>
<script async src="https://assets.voyagetext.com/voyage.production.js"></script>

Purchase Pixel

To add the purchase pixel, please follow these instructions:

  1. Go to the Shopify Admin go to Settings > Checkout > Order processing and find the section labelled Additional Scripts.
  2. Copy the below code and and paste into the Additional Scripts section
    1. Important: Replace 'Client_ID' in the code below with the Client ID found in your Voyage dashboard under Settings—>Company—>Client ID (if you are copying the code from Settings—>Tracking rather than from the snippet below, your Client ID is already added to the code).
  3. Click Save.

{% if first_time_accessed %}
<script async src="https://assets.voyagetext.com/voyage.production.js"></script>
<script type="text/javascript">
/* <![CDATA[ */
(function(){if(window.voyage)return;window.voyage={q:[]};var fns=['init', 'track'];
for(var i=0;i<fns.length;i++){(function(fn){window.voyage[fn]=function(){
this.q.push([fn,arguments]);}})(fns[i])}})();voyage.init('Client_ID', { popup: true });
/* ]]> */
</script>
<script type="text/javascript">
voyage.track('Purchase', { amountCents: {{ order.total_price }}, sourceId: 'shopify-' + {{ order.order_number }} });
</script>
{% endif %}

 

voyagesmsshopify-code-installation