|||
-|-|-|
| Resumen | Discourse FontAwesome Pro permite el uso de iconos de Font Awesome Pro en Discourse con una licencia de FontAwesome utilizando el token del paquete NPM de su cuenta.
| Enlace al repositorio | https://github.com/discourse/discourse-fontawesome-pro
| Guía de instalación | Cómo instalar plugins en Discourse
Configuración
Esto requiere algunos pasos adicionales para habilitarlo en comparación con un plugin normal:
Primero, necesitará configurar una variable de entorno adicional que contenga su clave de licencia de font awesome pro: DISCOURSE_FONTAWESOME_AUTH_TOKEN
El script de instalación también debe llamarse durante la inicialización, como un hook adicional de “after_code”. Esto descarga y agrega los SVGs de FontAwesome Pro en la compilación utilizando su token de autenticación. Este es un bloque adicional separado del bloque de clonación del plugin.
Aquí hay un ejemplo de instalación en 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
Selección de una familia de reemplazo:
En la configuración del administrador, puede reemplazar la familia de iconos predeterminada de Discourse:
Selección de un estilo de reemplazo:
También puede reemplazar el estilo de icono predeterminado:
Duotone
Para tener control total sobre el soporte duotone, deberá reemplazar el siguiente CSS (en un tema o de lo contrario) y reemplazarlo con su propio esquema de color:
svg {
--fa-secondary-color: red;
--fa-secondary-opacity: 0.6;
}
Para colorear iconos individuales, haga referencia al ID del SVG:
#fad-search .fa-secondary {
--fa-secondary-color: red;
--fa-secondary-opacity: 0.6;
}
Actualización de estilo Duotone
Si está utilizando selectores basados en clases como:.fa-secondary { color: red; }Deberá actualizar su estilo para usar propiedades personalizadas de CSS en su lugar. Los reemplazos de color basados en clases ya no funcionan ya que fueron eliminados en Font Awesome v7
Bajo el capó, esto está utilizando el repositorio de FontAwesome para instalar fuentes en la carpeta SVG del plugin, y permite que Discourse recoja los sprites desde allí.
¿Alojado por nosotros? Este plugin está disponible en nuestros planes Enterprise.
