Il nuovo editor di Wordpess prende il nome da Gutenberg, l’inventore della stampa moderna, presentandosi con un sistema dei contenuti a blocchi e un completo restyling dell’interfaccia.
Le novità di Gutenberg Kirk con WordPress 5.3. Un editor migliorato per funzioni più avanzate.
Il nuovo editor prevede le seguenti novità:
- Ricerca testuale dei blocchi usando lo “/ “;
- Gestione delle colonne del blocco;
- Funzione “Gruppo”;
- Nuova gestore delle immagini.
La ricerca del blocco si usa scrivendo il nome del blocco prima della barra in diagonale “/”. Si aprirà una finestra dove vengono elencati i blocchi in base alla ricerca testuale.
Con le colonne puoi selezionare un layout e decidere quante colonne bisogna utilizzare. In ogni colonna puoi aggiungere un blocco diverso.
Puoi variare il numero delle colonne e modificare la larghezza di ogni singola colonna con un valore espresso in percentuale.
I comandi per variare le due opzioni appena descritte si trovano nella colonna di destra della pagina sotto la voce “Blocco“.
Il blocco “Gruppo” consente invece di unire in un unico contenitore diversi blocchi, in modo da poter essere riutilizzato senza dover richiamare singolarmente ogni elemento di cui è composto.
Il nuovo contenitore delle immagini consente di caricare immagini di grande dimensioni e di ridurle in automatico con un processo di ottimizzazione del peso.
Le dimensioni delle immagini possono anche essere impostate come “Larghezza Ampia” e “Larghezza piena” per ingrandire l’immagine.
E’ possibile, inoltre, aggiungere facilmente una maschera a forma di cerchio usato di norma per le immagini che contengono un volto.
La funzione “aggiungi blocchi” adesso mostra un’anteprima del blocco usando una miniatura.
Le opzioni con il nuovo editor di WordPress 5.0
Nuovo editor WordPress
Da come puoi vedere dall’immagine, il lato destro è occupato da un pannello che è suddiviso in due tab, il primo è il “Documento” dove viene mostrato sotto la voce “Stato e visibilità“, il
- numero delle revisioni, l’url dell’articolo (Permalink),
- l’inserimento delle immagini in evidenza,
- il formato articolo (Standard, Video, Audio, Quote, Gallery e Link),
- la categoria e i tag,
- l’attivazione suo post dei commenti (Discussione) e il riassunto.
Il secondo è il “Blocco“, le cui funzioni cambiano in base alla tipologia del blocco selezionato: testo, immagine, lista e così via.
Cliccando su “Pubblico“, sotto la voce “Stato e visibilità“, viene mostrata l’opzione “Pubblico” per pubblicare il post, “Privato” per mostrare l’articolo solo agli utenti amministratori e autori, “Protetto da password” che consente solo ai possessori della password di visualizzare il post.
Come programmare le tue pubblicazioni sul nuovo editor di WordPress
Per schedulare la data di pubblicazione di un post e decedire in che giorno e in quale orario deve essere pubblicato l’articolo, basta cliccare sulla scritta “Immediatamente” per vedere comparire il calendario.
Il “Blocco” delle immagini mostra le varie opzioni disponibili. Il campo “Alt text” per un testo alternativo, le impostazioni per le dimensioni dell’immagine sono regolabili sia come grandezze già preimpostate, sia come unità di misura in pixel.
Sotto la voce “impostazioni link” le opzioni disponibili sono: nessuna, file media, allegato pagina e url personalizzata .
Sotto la voce “Avanzate” è possibile attuare delle personalizza tramite le classi CSS.
Quando viene selezionto il blocco paragrafo nella sezione “Blocco” sono visualizzate anche le funzioni per il modificare il colore del testo e quello dello sfondo.
Il colore del testo e dello sfondo viene applicato all’intero paragrafo, infatti non è possibile applicare il colore ad una sola porzione del paragrafo o di sfondo.
Sempre in questa sezione, nella parte superiore del layout, trovi il pulsante “salva in bozza“, l’anteprima dell’articolo e il tasto per la pubblicazione. L’icona della rotella abilita e disabilità il pannello che contiene i tab “Documento” e “Blocco“, mentre l’icona rappresentata dai 3 punti in verticale consente di accedere al menù dove vengono mostrate ulteriori funzioni, come le opzioni per passare dall’editor visuale all’editor dei codici. Quest’ultimo tipo di editor mostra non solo il contenuto testuale, ma anche il codice HTML e CSS che formatta il contenuto dell’articolo.
La “modalità in evidenza” ricopre i vari blocchi della pagina di una sorta di velo sfocato, fatta eccezione del blocco dove è presente il cursore.
La barra dell’editor Gutenberg
Sul lato sinistro in alto trovi posizionati l’icona con il simbolo “+” che ti consente di aggiungere nuovi blocchi selezionadone la tipologia (paragrafo, immagine, lista etc…), mentre l’icona con la “i” all’interno del cerchio mostra alcune informazioni sul post come il numero delle parole, il numero dei titoli, il numero dei paragrafi, il numero dei blocchi e la struttura del documento.
La struttura del documento oltre ad evidenziare la suddivisione del contenuto fra titolo e i tag <H>, mostra eventuali errori nell’ordine di assegnazione dei tag.
L’immagine sottostante evidenzia il tag <H1> su uno sfondo giallo per indicare che tale tag è stato assegnato già al titolo del post, pertanto è necessario correggere l’errata assegnazione con un tag <H2>.
L’icona rappresentata da tre linee in orizzontale visualizza, invece un menù tramite il quale è possibile navigare all’interno della pagina spostandosi da un blocco all’altro.
Quando si selezione all’interno del post un blocco “paragrafo” oppure un blocco “immagine“, viene mostrato un pannello dal quale poter formattare direttamente il testo o gestire l’immagine. L’immagine sottostante mostra nello specifico la barra relativo al blocco paragrafo.
Tutte le barre hanno in comune l’icona rappresentata dai tre punti in verticale che consente l’accesso alle seguenti funzioni:
- Nascondi impostazioni blocco: Nasconde il pannello destro laterale;
- Duplica: copia il blocco;
- Inserisci prima: crea un nuovo blocco
- Inserisci dopo: crea un nuovo blocco
- Modifica come HTML: passa dall’editor visuale a quello per icodice;
- Aggiungi ai blocchi riutilizzabili: salva il blocco in questione potendolo riutilizzare in un momento successivo
- Rimuovi blocco: cancella il blocco.
Come spostare un blocco con il nuovo editor di WordPress
Una delle funzioni che il nuovo editor di WordPress mette a disposizione e che può risultare veramente utile è la posssibilità di poter facilmente spostare i blocchi in sezioni diverse della pagina senza sformattarla.
Questo è possibile proprio grazie alla divisione dei contenuti in blocchi.
La sezione cerchiata in verde nell’immaginie mette in evidenza i comandi che permettono lo spostamento del blocco in una posizione diversa. Come puoi vedere è intuitivo nel suo utilizzo. La freccia rivolta verso l’alto sposta il blocco di una posizione precedente, mentre la freccia rivolta verso il basso lo sposta in una posizione successiva.
Vuoi continuare ad usare il vecchio editor?
Se vuoi continuare ad usare l’editor precedente puoi installare il plugin “Classic Editor” e tornare in questo modo alla vecchia interfaccia.
Per maggiori informazioni su come usare questo CMS leggi questo post: la guida su come usare WordPress