Adding the Tracking Script

Install the AffiliateBase tracking script on your website

Table of Contents

Adding the Tracking Script

The AffiliateBase tracking script captures affiliate referrals when visitors click affiliate links. This guide covers installation methods for different setups.

Add this script to your website’s <head> section:

<script>
  (function(w,r){
    w._abq=w._abq||[];
    w[r]=w[r]||function(){(w[r].q=w[r].q||[]).push(arguments)}
  })(window,'affiliatebase');
</script>
<script
  async
  src="https://cdn.jsdelivr.net/npm/affiliatebase-tracking@1/src/index.js"
  data-org-id="YOUR_ORG_ID">
</script>

Replace YOUR_ORG_ID with your organization ID from the AffiliateBase dashboard.

Why CDN?

  • Fast: Served from global CDN edge locations
  • Simple: No build step required
  • Auto-updates: Always uses the latest stable version
  • Works everywhere: Compatible with any website or CMS

NPM Installation (For Developers)

If you’re using a JavaScript bundler (webpack, Vite, etc.):

npm install affiliatebase-tracking

Then import and initialize:

import 'affiliatebase-tracking';

// Script auto-initializes, but you can access the API:
window.affiliatebase('identify', { email: 'customer@example.com' });

Script Placement

<head>
  <!-- Other head content -->
  <script>/* AffiliateBase script here */</script>
</head>

Placing in the <head> ensures:

  • Tracking starts before page content loads
  • Referral data is captured immediately
  • No flash of untracked content

Alternative: Before </body>

  <!-- Page content -->
  <script>/* AffiliateBase script here */</script>
</body>

Use this if you have strict performance requirements. Note: There’s a small window where clicks might not be tracked.

Platform-Specific Guides

For detailed installation on specific platforms:

Verifying Installation

1. Check the Console

Open browser developer tools (F12) and look for:

AffiliateBase: Initialized with org YOUR_ORG_ID

Visit your site with a test parameter:

https://yoursite.com?via=test

Then check:

console.log(window.affiliatebase_referral);
// Should output the referral ID

3. Check Network Requests

In the Network tab, look for requests to:

api.affiliatebase.com/api/track

A successful response (200 status) confirms tracking is working.

Accessing Referral Data

After the script loads, referral data is available via:

// Referral ID (string)
window.affiliatebase_referral

// Full referral object
window.AffiliateBase.referral

Use this data to pass to your checkout system. See Stripe Checkout Integration for details.

Important Notes

Localhost Limitations

The tracking script won’t populate window.affiliatebase_referral on localhost. Test on a deployed site or use a tunneling service like ngrok.

Script Loading Time

The script loads asynchronously. If you need to access referral data immediately:

// Wait for script to load
window._abq = window._abq || [];
window._abq.push(function() {
  console.log('Referral:', window.affiliatebase_referral);
});

Multiple Scripts

Only include the tracking script once per page. Multiple instances may cause tracking issues.

Troubleshooting

If the script isn’t working:

  1. Check for typos in your organization ID
  2. Verify the script loads in the Network tab
  3. Look for errors in the Console
  4. Check for ad blockers that might block the script
  5. Review CSP headers if you have Content Security Policy

See Script Not Loading for detailed troubleshooting.

Next Steps

With the script installed: