Problemi nell'aggiunta del componente CSS/JS: Rafforzamento dei link per preservare la funzionalità dei collegamenti

TL;DR riassunto:

  • Problemi nell’incorporare collegamenti javascript e CSS per abilitare i popup tooltip di Robustify ai collegamenti ipertestuali su il nostro Discourse.
  • Alcune somiglianze con questo caso precedente anche se ci stiamo astenendo dal interrogare l’API Robustify; potrebbe essere sensato seguire questa strada alla fine, ma avevamo intenzione di iniziare semplicemente abilitando i popup per i collegamenti ipertestuali correttamente racchiusi.

Dettagli:

Scrivo con una domanda, si spera, semplice sull’implementazione di una piccola app CSS/JS sul nostro forum Discourse: stiamo cercando di utilizzare una piccola e ordinata app messa insieme da Mementoweb che allega una finestra popup a qualsiasi collegamento ipertestuale su una pagina, permettendoti di scegliere tra accedere al sito o visualizzare una versione memorizzata nella cache precedente del sito se il collegamento non è più funzionante. È una funzionalità davvero ordinata! e speriamo che possa risolvere alcuni degli inevitabili problemi che si presentano quando si torna su un sito web un paio d’anni dopo e si trovano collegamenti interrotti a pagine non mantenute. Inizialmente speravo di provare solo ad assicurarmi che funzionasse quando uno di noi generava manualmente un codice sul sito Robustify (esempio).

L’app viene eseguita su un paio di righe di codice: i collegamenti sono racchiusi con un tag a href più lungo e ci sono collegamenti a un foglio di stile CSS e ad alcuni codici Javascript nei tag head. Ero un po’ incerto se Discourse avrebbe permesso la personalizzazione Javascript, ma sono stato davvero incoraggiato leggendo la Guida per principianti e vedendo quanta flessibilità c’era per le modifiche. Stiamo utilizzando un tema remoto (Sam’s Simple Theme) e ho provato ad aggiungere il nostro codice all’intestazione del sito come nuovo componente:


Non sono ancora riuscito a farlo funzionare, ma ieri pensavo di averlo risolto, leggendo sui plugin e cambiando il nostro tipo di JS in “text/discourse-plugin” version=“0.8.13”; ho anche cercato di risolvere le piccole variabili di ricollocazione del CSS (collegando il foglio direttamente invece che come DOI; copiando i tag direttamente nello spazio CSS; includendolo come CSS incorporato, ecc.) senza successo: i post con collegamenti racchiusi appaiono ancora senza popup:


Qualsiasi guida è molto apprezzata qui!, e aggiornerò questo post se nel frattempo mi imbatterò in una soluzione.

Puoi condividere uno screenshot della console JavaScript del tuo browser e della scheda Network? Potrebbe essere un problema di Content Security Policy (CSP) che impedisce il caricamento del codice JS sulla pagina.

2 Mi Piace

Grazie Faizaan :slight_smile: Includo uno screenshot qui sotto, non vedo immediatamente un problema CSP ma sono felice di provare un’altra macchina se può aiutare:

Ho dato un’occhiata al codice e sembra che ci sia una sorta di sovrascrittura che impedisce l’incorporazione dei tag Javascript mostrati nello screenshot nel post precedente:

image

Non sono sicuro al 100% se questo sia il risultato della sostituzione del valore script-type da text/javascript a text/discourse-plugin; ho la sensazione che non funzionasse con il valore originale, e non c’è più un puntatore al DOI JS indicato nel codice del Componente.

Grazie per il supporto con questo, mi chiedo se alla fine sarà più facile provare a configurare l’API completa se ci saranno più problemi nel far funzionare i singoli link.