 |
Riepilogo | Discourse FontAwesome Pro consente l’utilizzo delle icone Font Awesome Pro in Discourse con una licenza FontAwesome utilizzando il token del pacchetto NPM del tuo account. |
 |
Link al repository | https://github.com/discourse/discourse-fontawesome-pro |
 |
Guida all’installazione | Come installare i plugin in Discourse |
Configurazione
Questa configurazione richiede alcuni passaggi aggiuntivi rispetto a un plugin normale:
Innanzitutto, devi impostare una variabile d’ambiente aggiuntiva contenente la tua chiave di licenza Font Awesome Pro: DISCOURSE_FONTAWESOME_AUTH_TOKEN
Lo script di installazione deve anche essere chiamato durante l’inizializzazione come hook aggiuntivo “after_code”. Questo scarica e aggiunge gli SVG di FontAwesome Pro durante la compilazione utilizzando il tuo token di autenticazione. Si tratta di un blocco aggiuntivo separato dal blocco di clonazione del plugin.
Ecco un esempio di installazione in app.yml:
env:
DISCOURSE_FONTAWESOME_AUTH_TOKEN: 123456
hooks:
after_code:
- exec:
cd: $home/plugins
cmd:
- git clone https://github.com/discourse/discourse-fontawesome-pro.git
- exec:
cd: $home/plugins/discourse-fontawesome-pro
raise_on_fail: false
cmd:
- $home/plugins/discourse-fontawesome-pro/scripts/install.sh
Scelta di una famiglia di override:
Nelle impostazioni di amministrazione, puoi sovrascrivere la famiglia di icone predefinita di Discourse:
Scelta di uno stile di override:
Puoi anche sovrascrivere lo stile predefinito delle icone:
Duotone
Per avere il pieno controllo del supporto duotone, dovrai sovrascrivere il seguente CSS (in un tema o altrimenti) e sostituirlo con la tua combinazione di colori:
svg {
--fa-secondary-color: red;
--fa-secondary-opacity: 0.6;
}
Per colorare le singole icone, fai riferimento all’ID dell’SVG:
#fad-search .fa-secondary {
--fa-secondary-color: red;
--fa-secondary-opacity: 0.6;
}
Aggiornamento allo stile duotone
Se stai utilizzando selettori basati su classi come:.fa-secondary { color: red; }Dovrai aggiornare il tuo stile per utilizzare le proprietà CSS personalizzate invece. Le sovrascrizioni di colore basate su classi non funzionano più poiché sono state rimosse in Font Awesome v7
Sotto il cofano, questo utilizza il repository di FontAwesome per installare i font nella cartella SVG del plugin, permettendo a Discourse di recuperare gli sprite da lì.
Ospitato da noi? Questo plugin è disponibile nei nostri piani Enterprise.
