DataSag guides · Updated 27 October 2026

Install DataSag on Docusaurus

Add DataSag to Docusaurus through the scripts array in docusaurus.config.js or docusaurus.config.ts. Create a project first, then replace the example public key with the key from your dashboard.

Where to put the tracking script

Add an object to the existing Docusaurus scripts array with src, defer and data-datasag-key attributes. Preserve the rest of your configuration. Build and serve the generated production site, then test a documentation route directly and through client navigation. The config runs in Node.js, so browser event calls do not belong there.

// Merge this entry into the existing scripts array.
export default {
  scripts: [{
    src: "https://www.datasag.com/tracker.js",
    defer: true,
    "data-datasag-key": "YOUR_PUBLIC_KEY"
  }]
};

The project tracking key is public and belongs in this snippet. Account credentials, provider API keys and database secrets do not. Keep your existing consent choices and only load analytics when your site's policy permits it.

Verify the published installation

  1. Publish the change to the domain visitors actually use. Open a nested page as well as the homepage.
  2. In browser developer tools, find one tracker.js script with the correct data-datasag-key value.
  3. Filter Network requests for /api/track. Confirm that a pageview payload names the path you opened and receives a successful response.
  4. Open the same DataSag project and choose a date range containing your test. Confirm the page appears before measuring campaigns or conversions.

Avoid this Docusaurus setup mistake

Docusaurus accepts string script entries, but an object is needed here to preserve the public tracking-key attribute and explicit non-blocking loading. Do not also insert the tracker through a client module, swizzled theme component or individual MDX page.

Keep pageviews separate from scroll, click and engagement events. A page can generate several tracking requests while still representing one visit to that path.

Events and conversions

Use a React browser handler in an interactive component or a goal attribute on rendered markup. For a completed action, wait for its actual success callback; a documentation link click only establishes intent.

<a href="/signup" data-datasag-goal="signup_click">Create account</a>

This attribute measures a click. To record a completed signup, call window.datasag.track in the application's confirmed success handler. Current plan details determine which event and campaign reports are available.

Setup and troubleshooting recipes

Platform reference

Official Docusaurus documentation explains the platform integration point. DataSag-specific behavior here follows the current tracker and project setup.

Need a different stack? Browse every installation guide.