Shopify

Enhance your Shopify store by adding Accylin's analytics to track detailed visitor insights and behavior patterns.

Prerequisites

• A Shopify store with admin access.
• Your Accylin tracking code for your website, see Getting Started.

Installation Steps

1. Access Theme Settings

1. Log in to your Shopify admin panel
2. Go to Online Store > Themes
3. Find your active theme and click Actions > Edit code

2. Add Tracking Code

1. In the theme editor, locate the theme.liquid file under Layout
2. Find the closing </head> tag
3. Just before the </head> tag, paste your tracking code you got from Accylin.
4. Click Save

3. Verify Installation

1. Visit your Shopify store
2. Check your Accylin dashboard
3. Test a few page views to ensure tracking is working

Troubleshooting

If you don't see data in your dashboard:

1. Ensure the code is placed correctly before the </head> tag
2. Verify your tracking script is correct
3. Check that your ad-blocker is disabled
4. Clear your browser cache and reload the page

Adding Custom Events

First make sure you are familiar with Custom Events in Accylin.

Modifying Theme Files

To add custom event tracking, you'll need to modify your theme's templates. Here's how:

1. Go to Online Store > Themes
2. Click Actions > Edit code
3. Navigate to the appropriate template file:
   • For product pages: templates/product.liquid
   • For collection pages: templates/collection.liquid
   • For cart: templates/cart.liquid
   • For general layout: layout/theme.liquid

Common Implementation Locations

Add to Cart Button

Look for the "Add to Cart" button in your product.liquid file:

{% comment %} Original code might look like this: {% endcomment %}
<button type="submit" name="add" class="add-to-cart">
  Add to Cart
</button>
 
{% comment %} Add the data attributes like this: {% endcomment %}
<button 
  type="submit" 
  name="add" 
  class="add-to-cart"
  data-accylin-event="Add to Cart"
  data-accylin-event-productid="{{ product.id }}"
  data-accylin-event-name="{{ product.title }}"
  data-accylin-event-price="{{ product.price | money_without_currency }}">
  Add to Cart
</button>

Product View Tracking

In your product.liquid file, find the main product container:

{% comment %} Original code might look like this: {% endcomment %}
<div class="product">
 
{% comment %} Add the data attributes like this: {% endcomment %}
<div 
  class="product"
  data-accylin-event="View Product"
  data-accylin-event-productid="{{ product.id }}"
  data-accylin-event-name="{{ product.title }}"
  data-accylin-event-category="{{ product.type }}"
  data-accylin-event-price="{{ product.price | money_without_currency }}">

Collection View Tracking

In your collection.liquid file:

<div 
  class="collection-header"
  data-accylin-event="View Collection"
  data-accylin-event-collectionid="{{ collection.id }}"
  data-accylin-event-title="{{ collection.title }}">

Newsletter Form

In your newsletter template or section:

<form 
  action="/contact#contact_form" 
  method="post" 
  data-accylin-event="Newsletter Signup"
  data-accylin-event-location="footer"
  data-accylin-event-source="main">

Product View Tracking

<div 
  class="product"
  data-accylin-event="View Product"
  data-accylin-event-productid="{{ product.id }}"
  data-accylin-event-name="{{ product.title }}"
  data-accylin-event-category="{{ product.type }}"
  data-accylin-event-price="{{ product.price | money_without_currency }}">

Collection View Tracking

<div 
  class="collection-header"
  data-accylin-event="View Collection"
  data-accylin-event-collectionid="{{ collection.id }}"
  data-accylin-event-title="{{ collection.title }}">

Common Issues and Solutions

1. If events aren't tracking:

   • Verify the data-accylin-event attribute is present
   • Ensure all property names use lowercase and hyphens
   • Check for missing quotes or typos in attribute names

2. For dynamic content:

   • Handle null values with Liquid's conditional statements:

   data-accylin-event-price="{% if product.price %}{{ product.price | money_without_currency }}{% else %}0{% endif %}"

Support

Need help? Contact us at support@accylin.com or visit our help center.