Discourse FontAwesome Pro

:discourse2: Zusammenfassung Discourse FontAwesome Pro ermöglicht die Verwendung von Font Awesome Pro-Icons in Discourse mit einer FontAwesome-Lizenz mithilfe des NPM-Paket-Tokens Ihres Kontos.
:hammer_and_wrench: Repository-Link https://github.com/discourse/discourse-fontawesome-pro
:open_book: Installationsanleitung So installieren Sie Plugins in Discourse

Konfiguration

Dies erfordert einige zusätzliche Schritte im Vergleich zu einem normalen Plugin:

Zunächst müssen Sie eine zusätzliche Umgebungsvariable mit Ihrem Font Awesome Pro-Lizenzschlüssel einrichten: DISCOURSE_FONTAWESOME_AUTH_TOKEN

Das Installationsskript muss auch während der Initialisierung als zusätzlicher „after_code“-Hook aufgerufen werden. Dadurch werden die FontAwesome Pro-SVGs beim Build unter Verwendung Ihres Authentifizierungstokens heruntergeladen und hinzugefügt. Dies ist ein separater Block neben dem Plugin-Klon-Block.

Hier ist ein Beispiel für eine Installation 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

Auswahl einer Überschreibungs-Familie:

In den Admin-Einstellungen können Sie die Standard-Icon-Familie von Discourse überschreiben:

Auswahl eines Überschreibungs-Stils:

Sie können auch den Standard-Icon-Stil überschreiben:

Duotone

Um die volle Kontrolle über die Duotone-Unterstützung zu erhalten, müssen Sie das folgende CSS überschreiben (in einem Theme oder anderweitig) und durch Ihr eigenes Farbschema ersetzen:

svg {
  --fa-secondary-color: red;
  --fa-secondary-opacity: 0.6;
}

Um einzelne Icons zu färben, beziehen Sie sich auf die SVG-ID:

#fad-search .fa-secondary {
  --fa-secondary-color: red;
  --fa-secondary-opacity: 0.6;
}

:warning: Aktualisierung des Duotone-Stylings
Wenn Sie klassenbasierte Selektoren verwenden wie:

.fa-secondary { color: red; }

müssen Sie Ihr Styling aktualisieren, um stattdessen CSS-Custom-Properties zu verwenden. Klassenbasierte Farb-Überschreibungen funktionieren nicht mehr, da sie in Font Awesome v7 entfernt wurden


Im Hintergrund wird das FontAwesome-Repository verwendet, um Schriftarten in den SVG-Ordner des Plugins zu installieren, sodass Discourse die Sprites von dort übernehmen kann.

:discourse2: Von uns gehostet? Dieses Plugin ist in unseren Enterprise-Plänen verfügbar.

36 „Gefällt mir“

@featheredtoast Ich hatte noch keine Gelegenheit nachzusehen, aber lädt dies die aktuellste Version von Fontawesome Pro, wie 6.x, herunter?

Hier wurde eine Problemumgehung erwähnt:

Unterstützt die neueste Version bereits FA6 Pro? @featheredtoast

Ich fürchte, das ist noch nicht der Fall. Ich denke, das ist immer noch der Fall:

3 „Gefällt mir“

Für alle, die sich fragen, dies funktioniert immer noch nicht mit v6, selbst mit dem neuesten Core, der es unterstützt. Sie müssen immer noch --branch fa5 verwenden, damit die Pro-Icons funktionieren.

3 „Gefällt mir“

Wird dieses Plugin noch gepflegt? Ich frage mich, ob wir zu diesem Zeitpunkt FA(6) Pro-Icons verwenden könnten.

Es muss aufgeräumt werden – es steht auf der Liste, wir arbeiten daran – Entschuldigen Sie die Unordnung.

2 „Gefällt mir“

Hallo zusammen, ich habe dieses Plugin aktualisiert, damit es mit FontAwesome v7 funktioniert. Ich werde die Dokumentation in Kürze aktualisieren.

6 „Gefällt mir“

Ist es möglich, dass der regular-Stil in den Plugin-Einstellungen nicht korrekt angewendet wird? Wenn ich mir Find Icons with the Perfect Look & Feel | Font Awesome ansehe, sind die FA-Icons im regular-Stil alle hohl, aber auf meiner Website haben die Icons immer noch einen gefüllten Stil

2 „Gefällt mir“

Danke für die Meldung, die Korrektur wurde bereits zusammengeführt. Lassen Sie mich wissen, wenn Sie auf weitere Probleme stoßen.

2 „Gefällt mir“

Hallo Juan,
Hängt das zufällig damit zusammen?

1 „Gefällt mir“

Hat noch jemand ein Problem damit, dass das Icon „d-icon-d-watching-first“ nicht funktioniert, wenn das Plugin aktiviert ist?
Getestet auf 3.6.0.beta2

1 „Gefällt mir“

Gut bemerkt. Ich habe das Plugin gerade aktualisiert, damit es wieder das richtige Symbol anzeigt.

2 „Gefällt mir“

Anderer Fehler (erneut) aufgetreten mit folgenden Einstellungen:
Fa-Symbolstil auf “regular” gesetzt
Fa-Symbolfamilie auf “classic” gesetzt

Wenn ein Lesezeichen mit Erinnerung gesetzt ist, wird kein Symbol angezeigt:

CleanShot 2025-11-24 at 15.58.04@2x

2 „Gefällt mir“

Danke! Habe gerade einen Fix dafür hochgeladen. Sollte jetzt funktionieren.

2 „Gefällt mir“

@Alteras

Was halten Sie von einer zusätzlichen Plugin-Funktion, die es ermöglicht, für alle aktiven Zustands-Icons einen anderen Stil zu verwenden? Zum Beispiel sehe ich den Trend, gefüllte Icons (in FA: „solid“ Icon-Stil) für den aktiven Zustand und hohle Icons (in FA: „regular“ Icon-Stil) für den normalen Zustand zu verwenden.

Während der Nutzung von Discourse ist mir aufgefallen, dass es sich „seltsam“ anfühlt, hohle Icons (auch bekannt als FA Regular Stil) im aktiven Zustand zu haben.

2 „Gefällt mir“

Die API scheint mit dem $60 Lite-Plan nicht zu funktionieren. Ich vermute, Sie benötigen den $99 pro Jahr Pro-Plan, um die API für Pro-Icons zu verwenden…