Install on MkDocs Material
Steps
1. Update mkdocs.yml
Add the CDN script and point to a custom overrides directory:
yaml
theme:
name: material
custom_dir: overrides
extra_javascript:
- https://cdn.jsdelivr.net/npm/@axiomhq/do11y@latest/dist/do11y.min.js2. Create the overrides template
Create overrides/main.html to inject the configuration meta tags:
html
{% extends "base.html" %}
{% block extrahead %}
<meta name="axiom-do11y-domain" content="AXIOM_DOMAIN">
<meta name="axiom-do11y-token" content="API_TOKEN">
<meta name="axiom-do11y-dataset" content="DATASET_NAME">
<meta name="axiom-do11y-framework" content="mkdocs-material">
{% endblock %}Replace AXIOM_DOMAIN, API_TOKEN, and DATASET_NAME with your Axiom credentials.
See the MkDocs Material docs for more on theme overrides.
Advanced configuration
To use options beyond the basic credentials, add an inline script in overrides/main.html before the CDN script loads. Because extra_javascript entries load after the page, place the inline config in the extrahead block as well:
html
{% extends "base.html" %}
{% block extrahead %}
<meta name="axiom-do11y-domain" content="AXIOM_DOMAIN">
<meta name="axiom-do11y-token" content="API_TOKEN">
<meta name="axiom-do11y-dataset" content="DATASET_NAME">
<meta name="axiom-do11y-framework" content="mkdocs-material">
<script>
window.Do11yConfig = { scrollThresholds: [25, 50, 75, 100] };
</script>
{% endblock %}See the configuration reference for all available options.