Integrate with OpenCart

read

Overview

This article will walk you through integrating OpenCart with Klaviyo. After completing the steps outlined in this guide, you'll be able to personalize and target emails based on each customer's purchase and website activity. Here's the data we sync from OpenCart:

  • Sales and order data: Which products were purchased, including product details and images
  • Customer information: First name, last name, location, and customer group
  • Started checkout data: Used to trigger Abandoned Cart emails
  • Fulfilled order data: Used to track when orders are shipped
  • Web Tracking: When people visit your website

Add the OpenCart Integration

The process of adding Klaviyo's OpenCart integration is multi-step and requires taking actions inside of both OpenCart and Klaviyo. To get started, Klaviyo currently supports OpenCart 1.4.x and 1.5.x. Download the Klaviyo OpenCart module from here: https://www.klaviyo.com/media/downloads/OpenCartKlaviyo-1.1.0.tgz.

Unzip the file into the root of your OpenCart installation. Log into the OpenCart admin section and go to the Extensions > Modules page. Install the Klaviyo module and then click Edit for the Klaviyo module.

Log into your Klaviyo account, click on the Integrations tab in the navigation sidebar and select the OpenCart integration from the All Integrations list.

After clicking Add Integration, you will be taken to an Integration Settings page. On the settings page, enter the URL of your OpenCart site.

Next, copy/paste the API key for OpenCart and paste it into the Klaviyo module settings in OpenCart. Save the Klaviyo module settings in the OpenCart admin.

Finally, click Connect to OpenCart in Klaviyo to start syncing data.

Monitor the Klaviyo Sync

The time it will take to sync all historic customer and order data from your OpenCart store depends on the size of your store. Once this historic sync is complete, you will see a green border around your OpenCart integration in you account's Enabled Integrations tab.

To check your integration, navigate to your account's Metrics tab. Here, you can filter to view all OpenCart metrics. Find OpenCart's Placed Order metric and click on the Activity Feed icon. If your integration has begun syncing data, you will start to see Placed Order events populate here.

We will automatically sync all historic order data. To verify this, you can compare the number of event on a particular day in Klaviyo with what's in your OpenCart interface and confirm they match.

For example, when exploring the Placed Order metric in your Klaviyo account's Metrics tab, you can mouse over yesterday's data point or look at the table of data below the chart to see how many orders were reported yesterday. Compare that number to what's stored in OpenCart from yesterday and you should see they match exactly. If they don't, the issue is most likely that your Klaviyo account's timezone doesn't match your set OpenCart timezone. To check your timezone setting in Klaviyo, go your Account Settings and navigate to Contact Information > Organization. At the bottom, you will see an area to set timezone.

The OpenCart Metrics

Navigate to your account's Metrics tab. Here, you can filter to view all OpenCart metrics:

Install Klaviyo Web Tracking

To track website activity, first find your public API key by logging into your account and going to Account > Settings > API Keys. Your public key is six characters long. There are two types of web tracking you can install:

  • Active on Site: This metric is tracked whenever an identifiable browser visits your website
  • Viewed Product: This metric is tracked whenever an identifiable browser views a product page on your website

"Active on Site" Web Tracking

This metric is tracked whenever an identifiable browser visits your website. To begin tracking Active on Site activity, add the following snippet of code to your main store template so it's included on all pages. You should place this snippet either with other analytics scripts you use or right before the closing </body> tag.

Make sure to replace API_KEY with your Klaviyo account's Public API key:

<script>
  var _learnq = _learnq || [];
  _learnq.push(['account', 'API_KEY']);
  (function () {
    var b = document.createElement('script'); b.type = 'text/javascript'; b.async = true;
    b.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'a.klaviyo.com/media/js/analytics/analytics.js';
    var a = document.getElementsByTagName('script')[0]; a.parentNode.insertBefore(b, a);
  })();
</script>

If visitors or customers can create accounts for your store, add the following snippet directly below the first snippet:

<script>
  var _learnq = _learnq || [];
  {% if user.is_logged_in %}
  _learnq.push(['identify', {
    $email: '{{ user.email }}',
    $first_name: '{{ user.first_name }}',
    $last_name: '{{ user.last_name }}', 
  }]);
  {% endif %}
</script>

Depending on the types of templates you use for your website, the {% if user.is_logged_in %} and {{ user.email }} syntax are likely different. Using the template language available, you want to check if the person viewing the current page is logged in. If so, you should output their email and name, if available. If you don't have name information, remove those two lines and the trailing comma after the email $email line.

"Viewed Product" Web Tracking

If you'd like to set up a Browse Abandonment flow or build segments based on product browsing data, you'll want to add JavaScript event tracking for a "Viewed Product" metric. On your product page template, add the following snippet:

<script>
  var _learnq = _learnq || [];
    _learnq.push(['track', 'Viewed Product', {
      Title: '{{ product.title }}',
      ItemId: {{ product.id }},
      Categories: {{ category in product.categories|json }}, // The list of categories is an array of strings. 
      ImageUrl: '{{ product.image_url }}',
      Url: '{{ product.url }}',
      Metadata: {
        Brand: '{{ product.brand }}',
        Price: {{ product.price }},
        CompareAtPrice: {{ product.compare_at_price }} // If you have a compare at price. You could also include this for a sale or special price.
      }
  }]);
</script>

Note

The snippet above uses the {{ }} placeholder syntax which may be different for your OpenCart store. The important part is that product fields are dynamically rendered based on which product page you're viewing.

After Viewed Product web tracking has been configured for your site, "Viewed Product" data should begin populating in your Klaviyo account as known visitors browse your product pages.

How Web Tracking Works

When you add Klaviyo web tracking to your site, we are only able to track the browsing activity of "known browsers" - i.e. browsers that have visited and engaged at least once before. There are two key ways we are able to identify a site visitor for web tracking purposes:

  • If someone has, at some point, clicked through a Klaviyo email to your website
  • If someone has, at some point, subscribed/opted-in through a Klaviyo form

Klaviyo will not track anonymous browsers.

Was this article helpful?
3 out of 5 found this helpful