Install DataSag on Material for MkDocs

Where to put the tracking script

Configure a local theme custom_dir and extend base.html in overrides/main.html. Add the deferred tracker inside an extrahead block while preserving parent content with super(). Merge these changes into your existing MkDocs configuration, build the site and inspect the generated document. Do not edit the installed theme package.

# Merge into mkdocs.yml:
theme:
  name: material
  custom_dir: overrides

<!-- overrides/main.html -->
{% extends "base.html" %}
{% block extrahead %}
  {{ super() }}
  <script defer src="https://www.datasag.com/tracker.js" data-datasag-key="YOUR_PUBLIC_KEY"></script>
{% endblock %}

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 Material for MkDocs setup mistake

Material may use instant navigation, which changes the reading experience without a complete document reload. Install the global tracker once and test actual path changes. A replacement block that omits parent content can remove unrelated theme functionality.

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

For click goals, use data-datasag-goal on HTML markup preserved in the generated page. Custom browser success handlers can call the existing API. Under instant navigation, bind your own handlers through the documented lifecycle rather than repeatedly installing the tracker.

<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

• Verify DataSag analytics on Material for MkDocs

  Check the rendered script, public project key, browser requests and first pageview before relying on your analytics.

• Fix DataSag analytics not working on Material for MkDocs

  Trace missing website visits through script placement, project keys, exclusions, consent, network delivery and report filters.

• Fix duplicate analytics pageviews on Material for MkDocs

  Separate legitimate engagement events from duplicate tracker installations and repeated pageview dispatches.

• Track custom events on Material for MkDocs

  Add click goals or completed-action events with DataSag's data attribute and browser JavaScript API.

• Track UTM campaigns on your website

  Create consistent tagged links and verify that campaign parameters reach your website and DataSag.

• Measure AI referral traffic on your website

  Check visits with observable AI referrers and understand the difference between traffic, citations and LLM visibility.

• Configure CSP for DataSag analytics on your website

  Diagnose blocked scripts, beacon requests and image fallbacks without disabling your site's Content Security Policy.

• Exclude your own analytics visits on your website

  Use DataSag's browser exclusion switch to keep your testing activity out of future tracked visits.

• Load analytics without blocking rendering on Material for MkDocs

  Choose a non-blocking script placement and verify actual loading behavior instead of relying on a fixed speed claim.

Platform reference

Official Material for MkDocs 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.