twobucks.ai logoTwoBucks
Back to Installation

Shopify Installation Guide

Step-by-step guide to install TwoBucks Analytics on Shopify.

Quick Start

Method 1: Theme Customizer (Recommended)

  1. Go to Online Store → Themes
  2. Click Customize on your active theme
  3. Navigate to Theme Settings → Additional Scripts
  4. Add the script to the Head section:
<script
  src="https://twobucks.ai/script.js"
  data-website-id="your-website-id"
  async
></script>

Method 2: theme.liquid

Edit your theme's theme.liquid file:

  1. Go to Online Store → Themes → Actions → Edit code
  2. Open theme.liquid
  3. Add the script before </head>:
<!-- theme.liquid -->
<head>
  <!-- Other head content -->
  <script
    src="https://twobucks.ai/script.js"
    data-website-id="your-website-id"
    async
  ></script>
</head>

Track Shopify Events

Add to Cart

<!-- templates/product.liquid or sections/product-form.liquid -->
<script>
document.addEventListener('DOMContentLoaded', function() {
  const addToCartForm = document.querySelector('form[action="/cart/add"]');
  if (addToCartForm) {
    addToCartForm.addEventListener('submit', function() {
      if (window.twobucks) {
        const productId = {{ product.id }};
        const productTitle = {{ product.title | json }};
        window.twobucks('add_to_cart', {
          product_id: productId.toString(),
          product_title: productTitle
        });
      }
    });
  }
});
</script>

Purchase Tracking

<!-- templates/checkout.liquid or checkout.liquid -->
{% if checkout.order_id %}
<script>
if (window.twobucks) {
  window.twobucks('purchase', {
    order_id: '{{ checkout.order_id }}',
    total: '{{ checkout.total_price | money_without_currency }}',
    currency: '{{ checkout.currency }}'
  });
}
</script>
{% endif %}

Product View

<!-- templates/product.liquid -->
<script>
if (window.twobucks) {
  window.twobucks('product_view', {
    product_id: '{{ product.id }}',
    product_title: {{ product.title | json }},
    product_price: '{{ product.price | money_without_currency }}'
  });
}
</script>

Common Issues

Script Not Loading

  1. Ensure script is in theme.liquid <head> section
  2. Check theme customizer settings
  3. Verify data-website-id is correct

Theme Updates

If your theme updates, you may need to re-add the script. Consider:

  1. Using a custom theme (not modifying default themes)
  2. Documenting where you added the script
  3. Using theme customizer instead of direct file edits

Checkout Pages

Shopify checkout pages are hosted separately. To track checkout, add script to checkout.liquid (if available in your plan).

Next Steps