Add PageLens analytics to MkDocs (Material)

Steps

1. Set custom_dir: overrides under theme in mkdocs.yml.
2. Create overrides/main.html with the block below.
3. Rebuild with mkdocs build. Instant navigation is tracked automatically.

{% extends "base.html" %}
{% block extrahead %}
  <script defer src="https://app.pagelens.io/script.js" data-site-id="YOUR_SITE_ID"></script>
{% endblock %}

Replace YOUR_SITE_ID with the id from your site settings in PageLens. The dashboard shows the exact snippet with your id filled in.

Check that it works

Open your site in a new tab, then open PageLens. The live counter shows your visit within a few seconds. Visits from localhost are ignored by default.

Track custom events

Add data-pagelens-event to any button or form, or call the JavaScript API:

<button data-pagelens-event="signup" data-pagelens-prop-plan="pro">Start trial</button>

<script>
  window.pagelens?.track('signup', { plan: 'pro' })
</script>

You can also turn on autocapture for button clicks, form submissions and copy events in Site Settings → Tracking. No code is needed.

Avoid ad blockers

Some ad blockers drop requests to analytics domains. Serve PageLens from your own domain to count those visits too.

Other static sites & docs