Au coin du Frag
Programmation, jeux et bien plus...

Des commentaires avec Mastodon

Publié le : 03 avril 2026
Temps de lecture : 2 min.

Des commentaires avec Mastodon

Crédit photo : Rolf van Root sur Unsplash

Je suis tombé sur ce formidable article qui explique comment mettre en place un système de commentaires sur le blog entièrement en code navigateur, sans base de données, sans script de tracking, sans publicité et sans logiciel tiers (enfin... presque). Le principe est d'utiliser un fil Mastodon pour héberger les commentaires.

L'intégration est extèmement simple.

Il faut tout d'abord inclure cette librairie Javascript dans l'entête des pages ou on souhaite avoir des commentaires. En ce qui me concerne, je l'ai placé dans le modèle de document de Zola de la façon suivante :

<script src="js/mastodon-comments.js" defer></script>

Ensuite, il faut ajouter l'appel au web component, toujours dans le modèle de page, de la façon suivante :

{% if page.extra.toot_id %}
<mastodon-comments 
    host={{ config.extra.mastodon_host }} 
    user={{ config.extra.mastodon_user }} 
    tootId={{ page.extra.toot_id}}>
</mastodon-comments>
{% endif %}

J'ai conditionné l'affichage des commentaire à la présence d'un attribut toot_id dans la page.

Cet attribut référence un toot de votre compte Mastodon qui servira de point de départ au fil de commentaires. Toutes les réponses faites sur ce toot seront considérées comme des commentaires de la page.

Les paramètres de configuration globaux sont placés dans le fichier config.toml du site :

[extra]
mastodon_host="mastodon.tetaneutral.net"
mastodon_user="manubernat"

Quand je publie un nouvel article, il me suffit de faire un toot à son sujet. Ensuite, je récupère l'identifiant du toot pour activer les commentaires.
En réalité, je peux même faire le toot avant de publier puisque l'URL final de la publication est facile à calculer.