TinyMCE-Icons im Rich-Text-Feld anpassen

Möchten Sie anpassen, welche Formatierungsicons in Ihren Rich Text-Feldern angezeigt werden? Standardmäßig zeigt WPForms zwei Symbolleisten mit Standardformatierungsoptionen an.

Diese Anleitung zeigt Ihnen, wie Sie diese Symbolleisten anpassen, um genau die Werkzeuge einzuschließen, die Ihre Benutzer benötigen.

Die Standardfelder für die obere Symbolleiste sind:

• Textformatierung zum Markieren von Text als Überschriften oder Absatztext
• Fett
• Kursiv
• Aufzählungszeichen
• Nummerierte Liste
• Blockquote
• Links ausrichten
• Zentriert ausrichten
• Rechts ausrichten
• Link einfügen/bearbeiten
• Mehr lesen-Tag einfügen
• Symbolleiste umschalten (dies schaltet die untere Symbolleiste ein und aus)

Die Standardfelder für die untere Symbolleiste sind:

• Durchgestrichen
• Horizontale Linie
• Textfarbe
• Als Text einfügen
• Formatierung löschen
• Sonderzeichen
• Einzug verringern
• Einzug vergrößern
• Rückgängig machen
• Wiederholen
• Liste der Tastenkombinationen (ein modales Fenster wird mit diesen Tastenkombinationen angezeigt)

In diesem Tutorial zeigen wir Ihnen, wie Sie mit PHP die Symbole anpassen, die Ihren Besuchern angezeigt werden.

Einrichtung Ihres Formulars

Erstellen Sie zuerst ein Formular und fügen Sie ein Rich Text-Feld hinzu. Wenn Sie Hilfe beim Erstellen Ihres Formulars benötigen, lesen Sie unsere Anleitung zum Erstellen Ihres ersten Formulars.

Anpassen von Symbolleisten-Icons

Um die verfügbaren Formatierungsoptionen zu ändern, müssen Sie PHP-Code zu Ihrer Website hinzufügen. Wenn Sie nicht sicher sind, wie Sie benutzerdefinierten Code hinzufügen, lesen Sie bitte unseren Leitfaden zum Hinzufügen von Code-Snippets zu WordPress-Websites.

So passen Sie beide Symbolleisten an:

So passen Sie die Symbolleisten an:

• Für die obere Symbolleiste: Ändern Sie das Array in Zeile 10
• Für die untere Symbolleiste: Ändern Sie das Array in Zeile 42
• Fügen Sie Schaltflächen nach Bedarf hinzu oder entfernen Sie sie, wobei das gleiche Format beibehalten wird

Symbolleisten vollständig entfernen

Wenn Sie die Formatierungs-Symbolleisten vollständig entfernen möchten, können Sie dies mit CSS tun. Wenn Sie Hilfe beim Hinzufügen von CSS zu Ihrer Website benötigen, lesen Sie unseren Leitfaden zum Hinzufügen von benutzerdefiniertem CSS zu WordPress.

.wpforms-field .wp-editor-tabs, .wpforms-field .quicktags-toolbar {
    display: none !important;
}

So entfernen Sie Symbolleisten aus einem bestimmten Formular:

div#qt_wpforms-1000-field_25_toolbar, #wp-wpforms-1000-field_25-editor-tools {
    display: none;
}

Ersetzen Sie 1000 durch Ihre Formular-ID und field_25 durch Ihre Rich-Text-Feld-ID. Wenn Sie Hilfe beim Auffinden dieser IDs benötigen, lesen Sie unseren Leitfaden zum Auffinden von Formular- und Feld-IDs.

Und das ist alles, was Sie brauchen, um das Rich-Text-Formularfeld anzupassen! Möchten Sie als Nächstes die Symbole anpassen, wenn Sie das Bewertungsfeld verwenden? Lesen Sie unseren Leitfaden zur Anpassung des Aussehens von Bewertungssymbolen für weitere Details.