E-commerce

The tracker detects three e-commerce steps on its own: products added to the cart, the cart total, and the purchase. Detection works on most shops, but sending purchases yourself with trackPurchase is always more accurate.

Add to cart

A click counts as an add-to-cart when the button's text or aria-label contains an add-to-cart phrase. The built-in list covers about 90 phrases in 13 languages: "add to cart", "ajouter au panier", "in den Warenkorb", "añadir al carrito", "buy now"… It also counts when the button has a class like add-to-cart, addtocart or buy-now.

The product is then read from, in this order:

1. data-* attributes on the button or its parents: data-product-id, data-product-name, data-price, data-currency, data-category, data-variant, data-color;
2. the page's JSON-LD Product (schema.org), then its microdata;
3. the product card around the button.

For exact data, add the attributes to your button:

<button
  class="add-to-cart"
  data-product-id="SKU-123"
  data-product-name="Titanium ring"
  data-price="35"
  data-currency="EUR"
>
  Add to cart
</button>

Properties sent: product_id, product_name, price, currency, category, variant, color, brand, quantity, button_text, button_selector.

If your buttons use other wording, list it in addToCartPatterns. This replaces the built-in list:

sublim.o = {
  projectId: 'YOUR_PROJECT_ID',
  addToCartPatterns: ['add to bag', 'reserve'],
};

Cart and purchase

In the dashboard, under Settings → General, set your cart page URL and thank-you page URL. Use placeholders for the variable parts:

For example, https://shop.example.com/order/{id}/thank-you. The hostname must match exactly.

• On the cart page, the total is read from the page's structured data or its "Total" line, and sent as cart_viewed. It is kept for two hours.
• On the thank-you page, a purchase is sent with the remembered cart total, or the total shown on the page. The order ID comes from the URL placeholder, the dataLayer, JSON-LD (orderNumber) or an element such as [data-order-id] or .order-number. Reloading the page doesn't count the order again.

Sending it yourself

Automatic detection is a fallback. If you can add a line of code to your order confirmation, trackPurchase gives exact amounts and order IDs, and turns automatic purchase detection off for that page:

sublim.trackPurchase({ amount: 129.9, currency: 'EUR', orderId: 'CMD-10482' });

If your site already pushes GA4 e-commerce events to a dataLayer, as most Shopify, WooCommerce and PrestaShop themes do, turn on the Google dataLayer integration instead.

Turning it off

sublim.o = {
  projectId: 'YOUR_PROJECT_ID',
  trackAddToCart: false, // add-to-cart clicks
  trackCart: false,      // cart total + thank-you page purchase
};