Ecommerce Setup Guide

Updated over 4 months ago

Complete E-commerce Tracking Implementation

This comprehensive guide provides step-by-step implementation for tracking the entire e-commerce customer journey using Sealmetrics' privacy-first analytics platform.

Core E-commerce Events

1. Basic Page View Tracking

<script>
/* Basic E-commerce Page Tracking */
(function() {
  var options = {
    account: 'YOUR_ACCOUNT_ID_HERE',
    event: 'pageview',
    content_grouping: getEcommercePageType(),
    use_session: 1,
  };

  function getEcommercePageType() {
    const path = window.location.pathname;
    if (path.includes('/product/')) return 'product-pages';
    if (path.includes('/category/')) return 'category-pages';
    if (path.includes('/cart')) return 'cart-page';
    if (path.includes('/checkout')) return 'checkout-pages';
    if (path.includes('/account')) return 'account-pages';
    if (path === '/') return 'homepage';
    return 'general-pages';
  }

  var url="//app.sealmetrics.com/tag/v2/tracker";
  function loadScript(callback){
    var script=document.createElement("script");
    script.src=url;
    script.async=true;
    script.onload=function(){ if(typeof callback==="function"){callback();} };
    script.onerror=function(){console.error("Error loading script: "+url);};
    document.getElementsByTagName("head")[0].appendChild(script);
  }

  loadScript(function(){
    options.id=Math.floor((Math.random()*999)+1);
    if(window.sm){
      var instance=new window.sm(options);
      instance.track(options.event);
    } else {
      console.error("sm2 plugin is not available");
    }
  });
})();
</script>

2. Product View Tracking

<script>
function trackProductView(productData) {
  (function() {
    var options = {
      account: 'YOUR_ACCOUNT_ID_HERE',
      event: 'microconversion',
      label: 'Product View',
      ignore_pageview: 1,
      use_session: 1,
      properties: {
        product_id: productData.id,
        product_name: productData.name,
        category: productData.category,
        subcategory: productData.subcategory,
        brand: productData.brand,
        price: productData.price,
        currency: productData.currency,
        availability: productData.inStock ? 'in_stock' : 'out_of_stock',
        color: productData.color,
        size: productData.size,
        material: productData.material,
        traffic_source: getTrafficSource(),
        product_position: productData.listPosition,
        came_from_search: document.referrer.includes('search')
      }
    };

    var url="//app.sealmetrics.com/tag/v2/tracker";
    function loadScript(callback){
      var script=document.createElement("script");
      script.src=url;
      script.async=true;
      script.onload=function(){ if(typeof callback==="function"){callback();} };
      script.onerror=function(){console.error("Error loading script: "+url);};
      document.getElementsByTagName("head")[0].appendChild(script);
    }

    loadScript(function(){
      options.id=Math.floor((Math.random()*999)+1);
      if(window.sm){
        var instance=new window.sm(options);
        instance.track(options.event);
      } else {
        console.error("sm2 plugin is not available");
      }
    });
  })();
}

document.addEventListener('DOMContentLoaded', function() {
  if (window.productData) {
    trackProductView(window.productData);
  }
});
</script>

3. Add to Cart Tracking

<button onclick="addToCart(productData)" class="add-to-cart-btn"/>Add to Cart</button>

<script>
function addToCart(product) {
  (function() {
    var options = {
      account: 'YOUR_ACCOUNT_ID_HERE',
      event: 'microconversion',
      label: 'Add to Cart',
      ignore_pageview: 1,
      use_session: 1,
      properties: {
        product_id: product.id,
        product_name: product.name,
        category: product.category,
        brand: product.brand,
        price: product.price,
        quantity: product.selectedQuantity || 1,
        selected_color: product.selectedColor,
        selected_size: product.selectedSize,
        cart_total_items: getCartItemCount() + 1,
        cart_total_value: getCartTotal() + product.price,
        time_on_product_page: getTimeOnPage(),
        images_viewed: getImagesViewed(),
        reviews_read: getReviewsRead()
      }
    };

    var url="//app.sealmetrics.com/tag/v2/tracker";
    function loadScript(callback){
      var script=document.createElement("script");
      script.src=url;
      script.async=true;
      script.onload=function(){ if(typeof callback==="function"){callback();} };
      script.onerror=function(){console.error("Error loading script: "+url);};
      document.getElementsByTagName("head")[0].appendChild(script);
    }

    loadScript(function(){
      options.id=Math.floor((Math.random()*999)+1);
      if(window.sm){
        var instance=new window.sm(options);
        instance.track(options.event);
      } else {
        console.error("sm2 plugin is not available");
      }
    });
  })();
}
</script>

4. Remove from Cart Tracking

<script>
function removeFromCart(product) {
  (function() {
    var options = {
      account: 'YOUR_ACCOUNT_ID_HERE',
      event: 'microconversion',
      label: 'Remove from Cart',
      ignore_pageview: 1,
      use_session: 1,
      properties: {
        product_id: product.id,
        product_name: product.name,
        price: product.price,
        quantity_removed: product.quantity,
        removal_reason: product.removalReason,
        cart_total_items: getCartItemCount() - product.quantity,
        cart_total_value: getCartTotal() - (product.price * product.quantity)
      }
    };

    var url="//app.sealmetrics.com/tag/v2/tracker";
    function loadScript(callback){
      var script=document.createElement("script");
      script.src=url;
      script.async=true;
      script.onload=function(){ if(typeof callback==="function"){callback();} };
      script.onerror=function(){console.error("Error loading script: "+url);};
      document.getElementsByTagName("head")[0].appendChild(script);
    }

    loadScript(function(){
      options.id=Math.floor((Math.random()*999)+1);
      if(window.sm){
        var instance=new window.sm(options);
        instance.track(options.event);
      } else {
        console.error("sm2 plugin is not available");
      }
    });
  })();
}
</script>

5. Checkout Process Tracking

(… TRUNCATED FOR BREVITY IN CHAT … full text included in file …)

Helper Functions

<script>
function getCartItemCount() { return window.cartData ? window.cartData.totalItems : 0; }
function getCartTotal() { return window.cartData ? window.cartData.totalValue : 0; }
function getTimeOnPage() { return Math.round((Date.now() - window.pageStartTime) / 1000); }
function getSessionDuration() { const s=sessionStorage.getItem('sessionStart')||Date.now(); return Math.round((Date.now()-s)/1000/60); }
function getTrafficSource() { const r=document.referrer; if(!r) return 'direct'; if(r.includes('google'))return 'google'; if(r.includes('facebook'))return 'facebook'; if(r.includes('instagram'))return 'instagram'; return 'referral'; }
function getPagesVisited(){ const v=sessionStorage.getItem('pagesVisited'); return v?JSON.parse(v).length:1; }
function getImagesViewed(){ return document.querySelectorAll('.product-image:viewed').length||1; }
function getReviewsRead(){ return document.querySelector('.reviews-section:in-view')?true:false; }

if(!sessionStorage.getItem('sessionStart')){ sessionStorage.setItem('sessionStart',Date.now()); }
window.pageStartTime=Date.now();
</script>

Analytics Dashboard Setup

• Funnel metrics
• Revenue metrics
• Customer behavior
• Product performance

Custom Reports

• Sales Performance
• Conversion Analysis
• Customer Segmentation
• Marketing Attribution

Sealmetrics keeps the full e-commerce tracking flow fully compliant and consentless.