 |
Résumé | Ce composant de thème ajoute une protection configurable pour les liens externes dans les messages cuits. Il applique des règles basées sur le niveau de confiance, des redirections optionnelles de connexion et d’information, des indicateurs visuels pour les domaines de confiance et une modale de confirmation de sortie personnalisable. |
 |
Aperçu | Theme Creator |
 |
Dépôt | \u003chttps://github.com/VaperinaDEV/external-link-shield\u003e |
 |
Guide d’installation | Comment installer un thème ou un composant de thème |
 |
Nouveau sur les thèmes Discourse ? | Guide du débutant pour utiliser les thèmes Discourse |
Installer ce composant de thème
Bonjour 
J’aimerais partager un Composant de Thème qui ajoute un contrôle granulaire sur les liens externes dans les messages cuits, combinant :
- un contrôle d’accès basé sur le niveau de confiance
- une protection pour les utilisateurs anonymes
- une modale de confirmation de sortie personnalisée
- et des indicateurs visuels pour les domaines de confiance par rapport aux domaines inconnus
Ce composant est conçu pour les communautés où les liens externes peuvent avoir des implications légales, de sécurité ou de confiance.
Fonctionnalités
Règles de niveau de confiance configurables
Tous les comportements basés sur le niveau de confiance sont entièrement configurables via les paramètres du thème.
Vous pouvez activer ou désactiver indépendamment :
- le blocage des utilisateurs anonymes
- le remplacement d’information pour TL0
- l’exigence de révélation manuelle pour TL1
- la modale de confirmation de sortie pour les niveaux de confiance supérieurs
Cela permet au composant de s’adapter à des politiques communautaires très différentes, allant d’un blindage strict des liens à une friction minimale pour l’utilisateur.
Liens externes conscients du niveau de confiance
Les liens externes se comportent différemment en fonction du niveau de confiance de l’utilisateur :
- Utilisateurs anonymes
- Les liens externes sont remplacés par un lien de connexion ou une URL personnalisée définie dans les paramètres.
- TL0
- Les liens sont remplacés par une redirection configurable, par exemple un sujet expliquant les niveaux de confiance ou toute autre URL définie dans les paramètres.
- TL1
- Les liens nécessitent une révélation manuelle (cliquer pour voir), puis cliquer sur le lien affiche la modale de confirmation de sortie.
- TL2+
- Les liens se comportent normalement mais affichent toujours une modale de confirmation de sortie.
Modale de confirmation de sortie
Avant de quitter le forum, les utilisateurs voient une modale qui :
- Indique clairement qu’ils quittent la communauté
- Affiche l’URL de destination complète dans des balises
\u003ccode\u003e - Respecte la préférence de l’utilisateur
external_links_in_new_tab
Ceci est particulièrement utile pour :
- les communautés soumises à des contraintes de conformité
- l’atténuation du phishing
- l’éducation des utilisateurs moins expérimentés
Comportement basé sur le domaine via les paramètres
Le composant introduit deux paramètres de thème :
internal_domains:
type: list
default: ""
description: "Vos domaines de forum et CDN (ex: example.com|example-cdn.com). Ceux-ci n'auront AUCUNE icône et AUCUNE modale."
excluded_domains:
type: list
default: ""
description: "Domaines externes de confiance (ex: youtube.com|google.com). Ceux-ci afficheront une icône de Cadenas mais ignoreront la modale/le blindage."
- Domaines internes
- Traités comme internes → pas d’icône, pas de modale
- Domaines exclus (de confiance)
- Affichent une icône de cadenas
- Sautent le contrôle du niveau de confiance et la modale
- Affichent une icône de cadenas
- Tous les autres liens externes
- Affichent une icône de lien externe
- Sont contrôlés et/ou confirmés en fonction du niveau de confiance
Indicateurs visuels (SCSS)
Les icônes sont ajoutées purement via CSS :
- Liens externes inconnus → icône external-link
- Liens externes de confiance → icône de cadenas (couleur succès)
Ceci maintient le DOM propre et évite l’injection d’icônes basée sur JS.
Cette capture d’écran montre comment le composant distingue visuellement :
- Domaines exclus : liens externes de confiance (icône de cadenas, pas de confirmation de sortie),
- Domaines internes : liens internes (pas d’icône, pas de confirmation de sortie),
- liens externes inconnus (icône external-link avec confirmation de sortie).
Cas d’utilisation
Ce composant est utile si vous souhaitez :
- Protéger les utilisateurs contre les liens externes dangereux ou trompeurs
- Éduquer les nouveaux utilisateurs avant de les laisser quitter le forum
- Appliquer la progression de la confiance de la communauté
- Ajouter des mentions légales/de conformité sans nuire à l’expérience utilisateur
