Documentation

Pixel Installation

Install the TrueTracked tracking pixel on your website to start collecting first-party data for accurate attribution. Choose the installation method that best fits your setup.

Method 1: Manual Installation (Insert Code)

Add the tracking script directly to your website's HTML. This works with any website or CMS.

1. Add the base loader script — Paste the following code before the closing </head> tag on every page of your site:

<script>
  !function(t,r,u,e){t.truetracked=t.truetracked||function(){
  (t.truetracked.q=t.truetracked.q||[]).push(arguments)};
  var s=r.createElement("script");s.async=1;
  s.src=u;r.head.appendChild(s)}
  (window,document,"https://t.ttrkd.com/tt.js?w=YOUR_WORKSPACE_ID");
</script>

Replace YOUR_WORKSPACE_ID with your actual workspace ID from Settings.

2. Track events — The SDK automatically tracks page views. For eCommerce events, add calls like:

// Product viewed
truetracked("event", "product_viewed", {
  items: [{
    id: "SKU-123",
    name: "Product Name",
    price: 29.99
  }]
});

// Add to cart
truetracked("event", "add_to_cart", {
  items: [{
    id: "SKU-123",
    name: "Product Name",
    price: 29.99,
    quantity: 1
  }]
});

// Checkout completed
truetracked("event", "checkout_completed", {
  order_id: "ORD-456",
  value: 59.98,
  currency: "USD",
  items: [{
    id: "SKU-123",
    name: "Product Name",
    price: 29.99,
    quantity: 2
  }]
});

Method 2: Shopify Installation

For Shopify stores, add the pixel to your theme's theme.liquid file.

1. In your Shopify admin, go to Online Store > Themes
2. Click Actions > Edit code
3. Open the theme.liquid file
4. Paste the base loader script before the closing </head> tag
5. Save the file

Shopify's checkout events are handled automatically via webhooks. See the Integrations guide to connect your Shopify store.

Method 3: Google Tag Manager

If you use GTM, you can install TrueTracked without modifying your website code directly.

1. In GTM, create a new Custom HTML tag
2. Paste the base loader script (same as Method 1) into the tag
3. Set the trigger to All Pages
4. Create additional Custom HTML tags for each eCommerce event you want to track
5. Use GTM's Preview mode to test, then publish

Using a Custom Domain

If you've set up a custom tracking domain, the script URL changes. Instead of using the default t.ttrkd.com domain, you'll use your custom subdomain:

<script>
  !function(t,r,u,e){t.truetracked=t.truetracked||function(){
  (t.truetracked.q=t.truetracked.q||[]).push(arguments)};
  var s=r.createElement("script");s.async=1;
  s.src=u;r.head.appendChild(s)}
  (window,document,"https://YOUR-CUSTOM-DOMAIN/tt.js");
</script>

Note that with a custom domain, you don't need to include the workspace ID in the URL — it's resolved automatically from the domain.

SPA (Single Page Application) Considerations

For React, Next.js, Vue, or other SPA frameworks, the SDK automatically detects route changes and tracks page views. No additional configuration is needed for client-side navigation.

For frameworks using custom routers, you can manually track page views:

// Call after each route change
truetracked("event", "page_viewed");

Debug Mode

Enable debug mode to see tracking events logged in your browser console:

truetracked("debug", true);

Troubleshooting

• Script not loading: Check that the script is placed before </head> and your workspace ID is correct.
• Events not appearing: Enable debug mode and check the browser console for errors. Ensure your ad blocker isn't blocking requests to t.ttrkd.com.
• Ad blockers blocking the script: Set up a custom tracking domain to bypass ad blockers.
• Duplicate page views in SPAs: The SDK handles this automatically. If you see duplicates, make sure you're not manually calling page_viewed in addition to the auto-tracking.

SDK Methods Reference