How to add Asklet to MkDocs Material

Show Asklet below every page of a Material for MkDocs site with one template override.

Steps

01
Copy your snippet

In Asklet, open your website and click Copy website snippet at the top.
02
Turn on theme overrides

In mkdocs.yml, add custom_dir: overrides under theme, and create the overrides folder next to mkdocs.yml.
03
Extend the content block

Create overrides/main.html. Extend base.html and add the iframe after {{ super() }} in the content block (example below).
04
Check it on your live site

Deploy to a domain you listed in Asklet and open a page. Then click through to another one and check that its own survey loads too.

Your snippet looks like this

<iframe src="https://asklet.io/embed/s/<your-site>" title="Article feedback" width="100%" height="480" loading="lazy" referrerpolicy="unsafe-url" style="border:0"></iframe>

Keep referrerpolicy="unsafe-url" on the iframe - Asklet uses it to know which page the reader is on, so the right survey appears.
Material's own "Was this page helpful?" widget sends answers to Google Analytics (or to a custom integration you write), and readers who decline the analytics cookie never see it. If you switch, remove feedback under extra.analytics so nobody is asked twice.
With use_directory_urls on (the default), pages live at addresses like /guides/install/, so /guides/* covers one section.

The override

Use the src from your own snippet.

{% extends "base.html" %}

{% block content %}
  {{ super() }}
  <iframe src="https://asklet.io/embed/s/<your-site>" title="Article feedback" width="100%" height="480" loading="lazy" referrerpolicy="unsafe-url" style="border:0"></iframe>
{% endblock %}

Troubleshooting

A page shows the survey of the page you came from

With navigation.instant, Material loads pages without a full reload. If the survey is right after a reload but wrong after clicking a link, remove navigation.instant from theme.features.