Code Examples

Ready-to-Use Test Implementations

This section provides complete, production-ready examples of common A/B tests. Each example includes HTML, CSS, and JavaScript that you can adapt for your store.

Quick Start Template

Here's a minimal template you can use for any test:

// Basic A/B Test Template
(function() {
  // Configuration
  const HYPOTHESIS_ID = 'your-hypothesis-id-here';
  let variantResult = null;
  
  // Initialize test
  async function init() {
    if (!window.shoplift) {
      console.warn('Shoplift not available');
      showControl();
      return;
    }
    
    try {
      variantResult = await window.shoplift.isHypothesisActive(HYPOTHESIS_ID);
      
      if (variantResult) {
        showVariant();
      } else {
        showControl();
      }
    } catch (error) {
      console.error('Test failed:', error);
      showControl();
    }
  }
  
  function showControl() {
    // Your control experience
    console.log('Showing control');
  }
  
  function showVariant() {
    // Your variant experience
    console.log('Showing variant');
  }
  
  // Start when ready
  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', init);
  } else {
    init();
  }
})();