Come personalizzare le icone di TinyMCE per il campo Rich Text

Desideri personalizzare quali icone di formattazione appaiono nei tuoi campi Rich Text? Per impostazione predefinita, WPForms visualizza due barre degli strumenti con opzioni di formattazione standard.

Questa guida ti mostrerà come personalizzare queste barre degli strumenti per includere esattamente gli strumenti di cui i tuoi utenti hanno bisogno.

I campi predefiniti per la barra degli strumenti superiore sono:

• Formato Testo per contrassegnare il testo come intestazioni o testo normale
• Grassetto
• Corsivo
• Elenco puntato
• Elenco numerato
• Citazione
• Allinea a sinistra
• Allinea al centro
• Allinea a destra
• Inserisci/Modifica Link
• Inserisci Tag "Leggi di più"
• Attiva/Disattiva Barra degli strumenti (questo attiva e disattiva la barra degli strumenti inferiore)

I campi predefiniti per la barra degli strumenti inferiore sono:

• Barrato
• Linea orizzontale
• Colore Testo
• Incolla come testo
• Cancella formattazione
• Carattere speciale
• Riduci rientro
• Aumenta rientro
• Annulla
• Ripeti
• Elenco scorciatoie da tastiera (apparirà una finestra modale con queste scorciatoie)

In questo tutorial, ti mostreremo come usare PHP per personalizzare le icone che verranno visualizzate ai tuoi visitatori.

Configurazione del tuo modulo

Per prima cosa, crea un modulo e aggiungi un campo Rich Text. Se hai bisogno di aiuto per creare il tuo modulo, consulta la nostra guida alla creazione del tuo primo modulo.

Personalizzazione delle icone della barra degli strumenti

Per modificare le opzioni di formattazione disponibili, dovrai aggiungere codice PHP al tuo sito. Se non sei sicuro su come aggiungere codice personalizzato, ti preghiamo di consultare la nostra guida all'aggiunta di snippet di codice al sito WordPress.

Ecco come personalizzare entrambe le barre degli strumenti:

Per personalizzare le barre degli strumenti:

• Per la barra degli strumenti superiore: Modifica l'array alla riga 10
• Per la barra degli strumenti in basso: Modifica l'array sulla riga 42
• Aggiungi o rimuovi pulsanti secondo necessità, mantenendo lo stesso formato

Rimozione completa delle barre degli strumenti

Se desideri rimuovere completamente le barre degli strumenti di formattazione, puoi farlo utilizzando il CSS. Se hai bisogno di aiuto per aggiungere CSS al tuo sito, consulta la nostra guida su come aggiungere CSS personalizzato a WordPress.

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

Per rimuovere le barre degli strumenti da un modulo specifico:

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

Sostituisci 1000 con l'ID del tuo modulo e field_25 con l'ID del tuo campo Rich Text. Se hai bisogno di aiuto per trovare questi ID, consulta la nostra guida su come trovare gli ID dei moduli e dei campi.

E questo è tutto ciò che ti serve per personalizzare il campo modulo Rich Text! Successivamente, desideri personalizzare le icone quando utilizzi il campo modulo Valutazione? Consulta la nostra guida su come personalizzare l'aspetto delle icone di Valutazione per maggiori dettagli.