Block-Editor und Block-Themes
Icons mit Shift+Alt+I einfügen, Favoriten behalten, aus eingefügtem SVG ein Icon machen und in Block-Theme-Templates ein Icon pro Beitrag zeigen.
Zwei Pro-Funktionen machen Icons im WordPress-Block-Editor schneller: Schnell einfügen, eine Tastatur-Auswahl für jedes Icon deiner Website, und Block-Theme-Unterstützung, mit der Templates auf jedem Beitrag ein anderes Icon zeigen. Diese Anleitung erklärt beide.
Bevor du loslegst
- Deine Pro-Lizenz ist aktiv.
- WordPress 7.1 oder neuer, denn beide Funktionen fügen den WordPress-Icon-Block ein.
- Unter Icons → Funktionen, Gruppe Im Editor: Schnell einfügen und/oder Block-Theme-Unterstützung sind an.
- Damit deine Sets in der Auswahl auftauchen, ist auch Mehrere Sammlungen an.
Schnell einfügen
Ein Icon einfügen
Auswahl öffnen
Setze in einem Beitrag oder einer Seite den Cursor dorthin, wo das Icon hin soll. Drücke Shift+Alt+I (auf dem Mac: Ctrl+Option+I). Du kannst auch die Befehlspalette öffnen (Strg+K oder Cmd+K) und Ein Icon einfügen ausführen.
Suchen
Tippe einen Teil des Namens, zum Beispiel "tuer". Die Liste filtert beim Tippen, über alle Sammlungen der Website.
Einfügen
Bewege dich mit den Pfeiltasten und drücke Enter, oder klicke das Icon an. Es kommt als Icon-Block in den Beitrag. Ist gerade ein Icon-Block ausgewählt, wird stattdessen sein Icon getauscht.
Favoriten und zuletzt genutzte Icons
Die Auswahl zeigt oben Favoriten und Zuletzt genutzt. Klicke auf den Stern an einem Icon für Zu den Favoriten hinzufügen, ein zweiter Klick nimmt es wieder heraus. Favoriten werden pro Benutzer gespeichert, jedes Teammitglied behält also seine eigenen.
Aus eingefügtem SVG ein Icon machen
Füge SVG-Code in die Auswahl ein, oder lege irgendwo darauf eine .svg-Datei ab. Der Bereich Neues Icon aus SVG erscheint. Gib einen Icon-Name ein und klicke auf Hinzufügen und einfügen. Die SVG wird wie ein Upload bereinigt, als Icon gespeichert und eingefügt.
Nur Administratoren können auf diesem Weg Icons hinzufügen. Andere Benutzer können vorhandene Icons einfügen, sehen aber "Nur wer die Icon-Bibliothek verwalten darf, kann ein Icon hinzufügen. Wende dich an die Administration."
Auch im Website-Editor
Schnell einfügen funktioniert im Beitrags-Editor und im Website-Editor, in dem du Templates und Template-Teile eines Block-Themes bearbeitest.
Block-Theme-Unterstützung
Auf jedem Beitrag ein anderes Icon zeigen
Stell dir pro Leistung eine Seite "Leistungen" vor, jede mit eigenem Icon im Seitenkopf. Mit der Block-Theme-Unterstützung baust du den Kopf einmal im Template, und jede Seite bringt ihr eigenes Icon mit.
Einschalten
Schalte die Block-Theme-Unterstützung unter Icons → Funktionen ein.
Template bearbeiten
Gehe zu Design → Editor und öffne das Template, zum Beispiel für einzelne Seiten. Füge einen Icon-Block dort ein, wo das Icon erscheinen soll.
Verbinden
Verbinde in den Block-Einstellungen sein Icon mit der Quelle Easy-SVG-Icon in einem Custom Field (WordPress listet solche Quellen unter Attribute). Der Block liest das Icon jetzt aus der gerade gezeigten Seite. Bietet deine WordPress-Version für den Icon-Block keine solche Option, kann dein Entwickler die Verbindung in einer Minute im Code des Templates eintragen.
Icon pro Seite setzen
Jede Seite speichert die Adresse ihres Icons, zum Beispiel acme/ofen, im Custom Field easy_svg_icon. Setze es mit deinem Feld-Plugin, dem Bereich Individuelle Felder, oder lass es deinen Entwickler befüllen.
Das Feld easy_svg_icon wird von Pro registriert und bereinigt, es funktioniert also ohne Feld-Plugin.
Fertige Vorlagen
Hat deine Website mindestens drei Icons, bekommt der Block-Inserter eine Vorlagen-Kategorie Easy-SVG-Icons mit zwei Vorlagen: Eine Reihe Icons und Eine Überschrift mit Icons. Sie bestehen aus deinen eigenen Icons und sind ein schneller Start für einen Bereich mit Leistungsmerkmalen.
Gut zu wissen
- Funktioniert in einer Abfrage-Schleife. In einer Beitragsliste zeigt jeder Beitrag sein eigenes Icon.
- Überall dieselben Icons. Die Auswahl listet dieselben Icons wie der Icon-Block, die Page Builder und
easy_svg_icon(). - Eingefügte SVGs landen nie ungeprüft im Beitrag. Sie werden immer zuerst zu einem bereinigten Icon.
- Das Tastenkürzel stört die Editor-Kürzel nicht. Belegt eine Browser-Erweiterung es, nimm die Befehlspalette.
Häufige Fragen
Passende Anleitungen
Icons verwenden
Icon-Block, Shortcode und PHP.
Stile und Theme-Farben
Icons deinem Theme folgen lassen.
Für Entwickler: Das Custom Field und die Vorlagen sind in der Entwickler-Referenz beschrieben.