Wo finde ich weitere Icons für meine Website? Beispiel:
Lass uns klären, woher solche Icons stammen – und wie du sie datenschutzfreundlich nutzt.
In der Community nutzen wir hauptsächlich Icons von Font Awesome. Diese Icon-Bibliothek bietet über 2.000 frei nutzbare SVG-Icons – perfekt für Webseiten und ideal zur visuellen Strukturierung von Inhalten.
Wie du Font Awesome DSGVO-konform nutzt:
Standardmäßig werden Font Awesome Icons per CDN (extern) eingebunden – das kann problematisch sein, weil dabei Verbindungen zu Servern außerhalb der EU entstehen.
Besser (und DSGVO-sicher):
- Lade nur die Icons herunter, die du brauchst (z. B. als .svg)
- Binde sie lokal auf deinem Server ein (z. B. in /wp-content/themes/child-theme/fontawesome/ - im Hintergrund bereits erledigt.)
- Füge sie dann direkt als -Code in deine Seite ein – siehe Anleitungsvideo unten
Hier findest du passende SVG-Icons:
- Geh auf fontawesome.com/search
- Suche nach dem gewünschten Symbol (z. B. paper-plane, lightbulb, check-circle)
- Klicke auf das Icon → Rechts findest du den Button „Copy SVG“
- Füge es direkt in deine Seite oder deinen Block ein
Verstanden. Und wie bekomme ich das Icon in einen GenerateBlocks Text-Block?
Gute Frage – denn da kommt es auf die Stelle an, wo du es einfügen willst.
Mit GenerateBlocks kannst du SVG-Icons direkt als HTML in einem Text-Block verwenden. Das ist besonders sinnvoll, wenn du ein Icon vor eine Zwischenüberschrift oder einen Pro-Tipp setzen willst.
So geht’s Schritt für Schritt:
- Erstelle einen GB Text-Block (GenerateBlocks)
- Wechsle zu Einstellungen / Block / Icons
- Füge dort den kopierten -Code direkt ein
- Optional: Gestalte das Icon nach deinen Vorstellungen (Position: vor oder neben dem Text, Farbe, Größe, Abstand etc.)
Das Icon wird direkt Inline angezeigt – ganz ohne zusätzliche Styles oder Plugins.
Bildliche Erklärung: Im folgenden Screen Recording siehst du, wie der SVG-Code kopiert und in einem GenerateBlocks Textblock eingefügt wird:
Mein Tipp zum Schluss:
Wenn du Icons häufiger nutzt, kannst du sie auch in einem **Element (GeneratePress)** oder **wiederverwendbaren Block** speichern – so musst du sie nicht jedes Mal neu einfügen.