Questo componente tema aggiunge una protezione configurabile per i link esterni nei post elaborati. Applica regole basate sul livello di fiducia, reindirizzamenti opzionali di accesso e informazioni e indicatori visivi per i domini attendibili, oltre a una modale di conferma di uscita personalizzabile.
Vorrei condividere un Componente Tema che aggiunge un controllo granulare sui link esterni nei post elaborati, combinando:
controllo degli accessi basato sul livello di fiducia
protezione per gli utenti anonimi
una modale di conferma di uscita personalizzata
e indicatori visivi per domini attendibili rispetto a domini sconosciuti
Questo componente è progettato per comunità in cui i link esterni possono comportare implicazioni legali, di sicurezza o di fiducia.
Funzionalità
Regole di livello di fiducia configurabili
Tutti i comportamenti basati sul livello di fiducia sono completamente configurabili tramite le impostazioni del tema.
È possibile abilitare o disabilitare indipendentemente:
il blocco degli utenti anonimi
la sostituzione informativa per TL0
il requisito di rivelazione manuale per TL1
la modale di conferma di uscita per livelli di fiducia più elevati
Ciò consente al componente di adattarsi a politiche comunitarie molto diverse, da una rigorosa protezione dei link a un minimo attrito per l’utente.
Link esterni consapevoli del livello di fiducia
I link esterni si comportano in modo diverso a seconda del livello di fiducia dell’utente che visualizza:
Utenti anonimi
I link esterni vengono sostituiti con un link di accesso o un URL personalizzato definito nelle impostazioni.
TL0
I link vengono sostituiti con un reindirizzamento configurabile, ad esempio un argomento che spiega i livelli di fiducia o qualsiasi altro URL definito nelle impostazioni.
TL1
I link richiedono la rivelazione manuale (clicca per visualizzare), quindi facendo clic sul link viene visualizzata la modale di conferma di uscita.
TL2+
I link si comportano normalmente ma mostrano sempre una modale di conferma di uscita.
Modale di conferma di uscita
Prima di lasciare il forum, gli utenti vedono una modale che:
Indica chiaramente che stanno lasciando la comunità
Mostra l’URL di destinazione completo nei tag <code>
Rispetta la preferenza dell’utente external_links_in_new_tab
Comportamento basato sul dominio tramite impostazioni
Il componente introduce due impostazioni del tema:
internal_domains:
type: list
default: ""
description: "I domini del tuo forum e CDN (es. example.com|example-cdn.com). Questi non avranno icona né modale."
excluded_domains:
type: list
default: ""
description: "Domini esterni attendibili (es. youtube.com|google.com). Questi mostreranno un'icona a LUPPO ma salteranno la modale/protezione."
Domini interni
Trattati come interni → nessuna icona, nessuna modale
Domini esclusi (attendibili)
Mostrano un’icona a lucchetto
Saltano il controllo del livello di fiducia e la modale
Tutti gli altri link esterni
Mostrano un’icona di link esterno
Sono soggetti a controllo e/o conferma a seconda del livello di fiducia
Indicatori visivi (SCSS)
Le icone vengono aggiunte puramente tramite CSS:
Link esterni sconosciuti → icona di link esterno
Link esterni attendibili → icona a lucchetto (colore di successo)
Ciò mantiene pulito il DOM ed evita l’iniezione di icone basata su JS.
Ma i visitatori non autenticati possono aprire un link esterno direttamente (è loro consentito aprire i link). È previsto così e l’informazione/avviso viene mostrato solo ad alcuni TL?
È fantastico Don, grazie per averlo creato e condiviso!
Mi chiedo perché i collegamenti esterni attendibili utilizzino un’icona a lucchetto? Intendo dire che può essere interpretato come “bloccato” quando in realtà sono consentiti.
Proverò questo componente; sembra coprire tutti i nostri casi d’uso per i collegamenti esterni. Proverò anche a spostare le icone a destra, perché capisco che sia lo standard comune.
Come sempre, sto solo condividendo i miei pensieri e sarei felice se il TC potesse essere migliorato grazie a essi.
Sostituzione delle icone SVG mask-image mantenute manualmente con elementi <svg class="d-icon"> reali, renderizzati tramite iconHTML() e inseriti accanto ai link da secure-links.js
Aggiunta delle impostazioni:
exit_confirmation_continue_icon
external_link_icon,
trusted_link_icon,
external_link_icon_color,
trusted_link_icon_color,
link_icon_position (prima/dopo)
Correzione di un crash quando enable_anonymous_blocking è disabilitato: currentUser.trust_level veniva letto per gli utenti anonimi (null), causando un errore e lasciando silenziosamente il tag <a> originale non elaborato/non protetto; ora i visitatori anonimi ricevono un passaggio ben definito (icona + modale di conferma opzionale, senza gating TL)
Quando si anteprima un argomento nella finestra modale Anteprima argomento, il clic su un’immagine per ingrandirla (apertura della lightbox) attiva anche la finestra modale di “conferma uscita” del componente External Link Shield, anche se questi collegamenti alle immagini non sono link esterni. Si tratta di immagini caricate localmente e servite dal nostro stesso dominio/CDN, non di immagini collegate tramite hotlink o esterne.
Mi chiedo se questa fantastica funzionalità potrebbe essere aggiunta ai link nella barra laterale.
Abbiamo diversi link esterni lì, e penso che sarebbe una buona idea anche di stilizzarli. Forse senza modale e/o restrizioni, dato che la situazione ideale è evitare attriti inutili (si tratta di link verificati).
Sono curioso riguardo a questo, perché non sono ancora sicuro di aver compreso appieno il caso d’uso.
La barra laterale consente già di assegnare un’icona a ciascun collegamento, e i link aggiunti da un amministratore sono già verificati. Le sezioni della barra laterale create dagli utenti sono simili in quanto l’utente sta esplicitamente aggiungendo link che già conosce e di cui si fida.
Quindi posso certamente vedere il valore nell’applicare lo stile per i link esterni lì, ma non sono sicuro di quale valore aggiuntivo il componente potrebbe offrire oltre al supporto alle icone già presente nella barra laterale, soprattutto dato che hai menzionato di non voler includere la finestra modale né le restrizioni.
Il tuo obiettivo principale sarebbe semplicemente indicare visivamente che un link nella barra laterale punta a un sito esterno, utilizzando lo stesso stile/icona del componente?
Grazie per aver preso in considerazione questa richiesta. Esatto, il comportamento desiderato è quello di informare gli utenti che si troveranno su una nuova pagina.
Funzionalità
Regole di livello di fiducia configurabili
Link esterni consapevoli del livello di fiducia
Modale di conferma di uscita
Comportamento basato sul dominio tramite impostazioni
lucchetto
Indicatori visivi (SCSS)
Casi d’uso
quando in realtà sono consentiti.
: 
