Um FontAwesome nicht von deren Server laden zu müssen (Stichworte: Performance und DSGVO), empfiehlt es sich, die praktischen Icons lokal einzubinden. Mit WordPress und GeneratePress geht das ganz einfach:
- FontAwesome-Webpack (zB Version 5.15.4) oder auch die neuere Version 6.5.1) herunterladen und entpacken
- Auf dem Webserver im Verzeichnis des Child-Themes ein Verzeichnis /fonts/fontawesome anlegen
- Aus dem heruntergeladenen und entpackten Webpack die Verzeichnisse /css und /webfonts und die darin enthaltenen Daten in dieses Verzeichnis hochladen
- Im WordPress-Dashboard unter Design -> Elements -> neues Element vom Typ Hook anlegen und zB mit „CSS – FontAwesome“ benennen
- Diesen Code als Inhalt einfügen:
<link href="https://example.com/wp-content/themes/generatepress_child/fonts/fontawesome/css/all.min.css" rel="stylesheet">- Unten unter Einstelllungen als Hook wp_head auswählen
- Unter Anzeigregeln als Standort Komplette Seite auswählen – oder Regeln für alle Seiten/Beiträge anlegen, auf denen FontAwesome-Icons verwendet werden
- Aktualisieren
- Ab sofort kann man FontAwesome-Icons auf die übliche Weise einbinden. Hilfreich bei der Suche nach bestimmten Icons sind die Übersichten für Version 6 free oder die Version 5 free.
Wer kein GeneratePress verwendet, muss das lokale CSS auf einem anderen Weg im Head- oder Footerbereich einbinden.