Problèmes d'ajout de composant CSS/JS : Robustification des liens pour préserver la fonctionnalité des liens

Résumé TL;DR :

  • Problèmes pour intégrer des liens Javascript et CSS afin d’activer les pop-ups d’infobulle Robustify sur les hyperliens de notre Discourse.
  • Certaines similitudes avec ce cas précédent, bien que nous nous arrêtions avant d’interroger l’API Robustify ; il serait peut-être judicieux de suivre cette voie à terme, mais nous avions l’intention de commencer simplement par activer les pop-ups pour les hyperliens correctement encapsulés.

Détails :

Je vous écris avec une question, espérons-le, simple concernant l’implémentation d’une petite application CSS/JS sur notre forum Discourse : nous essayons d’utiliser une petite application soignée mise en place par Mementoweb qui attache une boîte pop-up à tous les hyperliens d’une page, vous permettant de choisir entre accéder au site ou voir une version mise en cache antérieure du site si le lien n’est plus fonctionnel. C’est une fonctionnalité vraiment soignée !, et nous espérons qu’elle pourrait résoudre certains des problèmes inévitables liés au retour sur un site web quelques années plus tard et à la découverte de liens morts vers des pages non maintenues. Initialement, j’espérais simplement essayer de m’assurer qu’elle fonctionnerait lorsque l’un de nous générerait manuellement un code sur le site Robustify (exemple).

L’application s’exécute sur quelques lignes de code - les liens sont encapsulés avec une balise a href plus longue, et il y a des liens vers une feuille de style CSS et du code Javascript dans les balises head. J’étais un peu incertain si Discourse autoriserait la personnalisation Javascript, mais j’ai été vraiment encouragé en lisant le Guide du débutant et en voyant l’étendue des possibilités de modifications. Nous utilisons un thème distant (Sam’s Simple Theme) et j’ai essayé d’ajouter notre code à l’en-tête du site en tant que nouveau composant :


Je n’ai pas encore réussi à le faire fonctionner, mais j’ai cru l’avoir résolu hier, en me renseignant sur les plugins et en remplaçant notre type de JS par “text/discourse-plugin” version=“0.8.13” ; j’ai également essayé de résoudre les légères variables de la relocalisation du CSS (en liant directement la feuille au lieu d’un DOI ; en copiant les balises directement dans l’espace CSS ; en l’incluant comme CSS intégré, etc.) sans succès - les messages avec des liens encapsulés apparaissent toujours sans pop-up :


Toute aide serait très appréciée !, et je remonterai ce post si je trouve une solution entre-temps.

Pouvez-vous partager une capture d’écran de la console JavaScript de votre navigateur et de l’onglet Network ? Il pourrait s’agir d’un problème de politique de sécurité de contenu (CSP) qui empêche le chargement du code JS sur la page.

2 « J'aime »

Merci Faizaan :slight_smile: J’inclus une capture d’écran ci-dessous, je ne vois pas immédiatement de problème de CSP mais je suis heureux d’essayer une autre machine si cela peut aider :

J’ai jeté un coup d’œil au code et il semble y avoir une sorte d’écrasement qui empêche l’incorporation des balises Javascript illustrées dans la capture d’écran du message précédent :

image

Je ne suis pas sûr à 100 % si cela résulte du remplacement de la valeur script-type de text/javascript par text/discourse-plugin ; j’ai le sentiment que cela ne fonctionnait pas avec la valeur d’origine, et il n’y a plus de pointeur vers le DOI JS indiqué dans le code du composant.

Merci pour votre aide sur ce point - je me demande s’il ne serait pas plus facile d’essayer de configurer l’API complète si j’ai plus de problèmes à faire fonctionner les liens individuels.