Editor di blocchi di WordPress: tutto ciò che devi sapere (2022)
Pubblicato: 2022-04-23
WordPress ha rilasciato il suo nuovo editor Block che ora ha sostituito il vecchio editor classico. Questo editor funziona in un modo completamente diverso ed è la direzione in cui si sta dirigendo WordPress.
Se non conosci WordPress Block Editor e stai cercando una risorsa per capire come funziona, sei nel posto giusto!
In questo post, ti guiderò attraverso questo nuovo editor di blocchi di WordPress.
Inoltre, ti mostrerò come funziona e come puoi abbandonare l'editor classico per questo editor molto migliore e produttivo.
Quindi iniziamo.
- Che cos'è l'editor blocchi di WordPress?
- Editor blocchi vs editor classico: qual è la differenza?
- Una rapida introduzione all'interfaccia dell'editor di blocchi
- Un'introduzione ai blocchi
- Conversione di vecchi post in blocchi
- Inserimento di un nuovo blocco
- Duplicazione, spostamento e rimozione di blocchi
- Creazione di blocchi riutilizzabili
- Aggiunta di più blocchi all'editor blocchi
Che cos'è l'editor blocchi di WordPress?
L'editor blocchi di WordPress è il nuovo editor predefinito di WordPress che si basa sui blocchi. I blocchi sono elementi di contenuto che puoi utilizzare per aggiungere paragrafi, immagini, video, pulsanti, elenchi e altro.
E Gutenberg è il nome del progetto del nuovo editor di blocchi di WordPress. Il progetto prende il nome da Johannes Gutenberg, che inventò la macchina da stampa meccanica a caratteri mobili.
WordPress ha affermato che uno dei più grandi obiettivi del nuovo editor era consentire agli utenti di creare post ricchi e bellissimi layout con pochi clic.

Con la nuova interfaccia a blocchi, è ora possibile per gli utenti di WordPress creare bellissime pagine e post senza la necessità di alcun plug-in per la creazione di pagine.
Per capire meglio il blocco, dobbiamo dare un'occhiata a quanto è diverso dal classico editor.
Editor blocchi vs editor classico: qual è la differenza?
Il nuovo editor di blocchi è molto diverso dall'editor classico.
Vediamo come:
Ecco come appare l'editor classico di WordPress:

E questo è il nuovo Block editor di WordPress:

Sembrano molto diversi in superficie. Ma queste differenze sono molto maggiori se ti immergi in profondità in ciascun editor.
La più grande differenza tra l'editor classico e l'editor di blocchi è questa:
L'editor classico è un semplice editor di testo con varie opzioni di formattazione. Puoi aggiungere immagini, codici brevi, video, ecc. Proprio come aggiungi in qualsiasi altro editor di testo.
Block editor, d'altra parte, utilizza blocchi in cui ogni elemento o entità è rappresentato come blocchi. Quindi, qualsiasi immagine, galleria, video o shortcode che aggiungi ai tuoi contenuti ha la forma di un blocco.
Ecco perché è anche chiamato Editor blocchi.
L'editor dei blocchi viene fornito con molti blocchi predefiniti che possono essere aggiunti al tuo contenuto. Inoltre, puoi aggiungere molti nuovi blocchi utilizzando un plug-in per blocchi Gutenberg.
Quindi, ora conosci la differenza tra l'editor classico e l'editor di blocchi.
La domanda è:
In che modo l'editor di blocchi di Gutenberg è migliore dell'editor classico?
Ci sono molti vantaggi nell'usare l'editor di blocchi rispetto all'editor classico.
Il più grande è che è facile da usare rispetto al classico editor. Puoi anche modificare singoli blocchi che ti danno un maggiore controllo sul design e sul layout della tua pagina.
Leggi: Gutenberg (editor di blocchi) vs. Editor classico: quale scegliere?
Una rapida introduzione all'interfaccia dell'editor di blocchi
Diamo uno sguardo approfondito all'interfaccia dell'editor di blocchi di Gutenberg. Ogni volta che crei un post o una pagina in Gutenberg, ecco come appare l'editor:

Ecco un rapido riassunto degli elementi dell'interfaccia dell'editor di Gutenberg:
- Titolo del post/pagina del tuo blog.
- L'area del contenuto del tuo post/pagina.
- Ti consente di aggiungere nuovi blocchi.
- Pulsanti Annulla/Ripeti.
- Accedi alle impostazioni dei post in cui puoi aggiungere categorie, modificare l'immagine in primo piano, impostare la data di pubblicazione e altro ancora.
- Impostazioni per il singolo blocco selezionato. Ogni blocco può avere impostazioni di blocco diverse.
- Anteprima dal vivo o pubblicare/aggiornare il post.
Ora, che hai familiarità con l'interfaccia dell'editor di blocchi, diamo un'occhiata ai blocchi forniti con Gutenberg.
Un'introduzione ai blocchi
Hai letto che il nuovo editor funziona con i blocchi dall'inizio di questa guida. Ma cosa sono questi blocchi? E come funzionano?
Ecco i diversi tipi di blocchi disponibili in Gutenberg in base alle diverse categorie:
- Blocco paragrafo
- Blocco intestazioni
- Blocco immagine
- Blocco Galleria
- Blocco elenco
- Blocco preventivo
- Blocco audio
- Blocco di copertura
- Blocco file
- Blocco video
- Blocco HTML personalizzato
- Blocco da tavolo
- Blocco di codice
- Blocco classico
- Blocco preformattato
- Blocco Pullquote
- Blocco di versi
- Blocco colonne
- Blocco pulsanti
- Media e blocco di testo
- Blocco di interruzione di pagina
- Blocco separatore
- Blocco distanziatore
- Blocco codice breve
- ultimi post
- Blocco incorporamento di YouTube
Blocchi comuni
Questi sono i blocchi che vengono utilizzati molto spesso quando si lavora con i post. I blocchi comuni includono i blocchi di elementi più elementari.
Blocco paragrafo
Il blocco di paragrafi ti consente di scrivere del testo nell'editor di blocchi. È una semplice casella in cui puoi scrivere il contenuto per il tuo post.

Questo blocco viene fornito con le opzioni di formattazione standard che consentono di modificare la dimensione del carattere, l'allineamento, lo sfondo, il colore del testo, ecc. del paragrafo.
Blocco intestazioni
Il blocco intestazione ti consente di aggiungere intestazioni al tuo contenuto. Puoi scegliere il tipo di intestazione tra sei dimensioni (da H1 a H6).

Puoi modificare l'allineamento dell'intestazione, formattarli e persino inserire collegamenti.
Blocco immagine
Il blocco immagine consente di aggiungere un'immagine all'editor. Puoi inserire l'immagine dal tuo computer, dalla libreria multimediale di WordPress o da un URL.

Puoi aggiungere didascalie, modificare le dimensioni dell'immagine, aggiungere testo ALT e altro nel blocco immagine.
Blocco Galleria
Puoi creare bellissime gallerie con il blocco Galleria. Con questo blocco, puoi aggiungere più di un'immagine allo stesso blocco.

Puoi scegliere il numero di colonne per la galleria, aggiungere didascalie alle immagini e persino collegare le immagini della tua galleria.
Blocco elenco
Il blocco elenco consente di creare un elenco puntato o numerato.

Questo blocco include anche opzioni di formattazione standard che ti consentono di creare elementi secondari, aggiungere collegamenti di ancoraggio e formattare il testo dell'elenco.
Blocco preventivo
Il blocco delle virgolette ti consente di aggiungere belle citazioni ai tuoi contenuti.

Puoi aggiungere la citazione insieme al nome dell'autore e formattarla come qualsiasi altro blocco.
Blocco audio
Il blocco audio ti consente di caricare file audio nei tuoi contenuti. Il blocco mostra un bellissimo lettore audio.

È possibile personalizzare il lettore audio per riprodurre l'audio automaticamente e/o in loop.
Blocco di copertura
Il blocco copertina può essere utilizzato per aggiungere un'immagine o un video con una sovrapposizione di testo.

È possibile modificare il colore di sfondo e l'opacità della sovrapposizione.
Blocco file
È possibile aggiungere diversi tipi di file utilizzando il blocco file.

Il blocco file ti consente di visualizzare un pulsante, scegliere di aprire il file in una nuova scheda e altro ancora.
Blocco video
Il blocco video ti consente di caricare video sui tuoi contenuti.

Puoi riprodurre automaticamente i video, disattivarli, caricare una miniatura del video e altro ancora.
Blocchi di formattazione
I blocchi di formattazione includono blocchi di codice, blocchi HTML personalizzati e altri blocchi simili.
Esaminiamo ogni blocco di formattazione disponibile in Gutenberg.
Blocco HTML personalizzato
Il blocco HTML personalizzato ti consente di aggiungere rapidamente HTML personalizzato al tuo post e visualizzarlo in anteprima.

Blocco da tavolo
Ora puoi creare tabelle in WordPress senza utilizzare alcun plug-in.

Il blocco tabella ti consente di creare tabelle con facilità. È possibile selezionare il numero di righe e colonne e scegliere il layout.
Blocco di codice
Puoi visualizzare bellissimi frammenti di codice usando il blocco di codice.

Il blocco di codice non è un blocco in cui il codice è eseguibile. Serve solo per mostrare il codice ai tuoi lettori.
Blocco classico
Puoi aggiungere un piccolo editor classico usando il blocco classico.

Il blocco classico ha tutte le opzioni di formattazione dell'editor classico.
Blocco preformattato
Il blocco preformattato ti consente di visualizzare il testo sul front-end mentre lo digiti.

Visualizza il testo in un carattere a spaziatura fissa.
Blocco Pullquote
Puoi enfatizzare qualsiasi testo dei tuoi contenuti usando il blocco pullquote.

Puoi personalizzare i colori del blocco cambiando il colore principale e il colore del testo.
Blocco di versi
I blocchi di versi sono usati per scrivere versi come poesie o testi.

I versetti vengono visualizzati in una nuova riga e puoi scrivere tutti i versetti che desideri.
Blocchi di elementi di layout
I blocchi degli elementi di layout ti consentono di personalizzare magnificamente il layout del tuo post.
Ecco i blocchi degli elementi di layout in Gutenberg:
Blocco colonne
Puoi aggiungere colonne al tuo contenuto usando il blocco colonne. Non è più necessario utilizzare plug-in shortcode per le colonne!

Il blocco colonna può essere personalizzato e puoi cambiare il colore di sfondo della colonna.
Blocco pulsanti
Puoi aggiungere bellissimi pulsanti al tuo post usando il blocco pulsanti.

Ci sono molte impostazioni per il blocco pulsanti che ti consentono di personalizzare il bordo e il colore del pulsante.
Media e blocco di testo
Il blocco media e testo può essere utilizzato per visualizzare testo e media fianco a fianco.

Questo blocco ha le opzioni di formattazione standard per il testo e i media.
Blocco di interruzione di pagina
Il blocco delle interruzioni di pagina ti consente di aggiungere semplici interruzioni di pagina ai tuoi contenuti.
Blocco separatore
Il blocco separatore è un semplice blocco che ti consente di aggiungere separatori al tuo post.
Blocco distanziatore
Questo blocco aggiunge spazio tra i blocchi.
Blocchi elemento widget
I blocchi di elementi widget ti consentono di aggiungere widget al tuo post. Questi blocchi di widget includono codici brevi, archivi, categorie, ricerca, tag cloud e altro ancora.
Blocco codice breve
Il blocco shortcode ti consente di aggiungere shortcode ai tuoi contenuti.

A differenza del classico editor in cui si incolla lo shortcode direttamente nel contenuto, il blocco shortcode consente di inserire facilmente uno shortcode.
ultimi post
Il blocco degli ultimi post ti consente di visualizzare gli ultimi post pubblicati sul tuo blog nei tuoi post.

Ci sono impostazioni che ti consentono di selezionare la categoria dei post, scegliere il numero di articoli da visualizzare, ordinare i post e visualizzare la data del post.
Incorpora elementi
Gli elementi incorporati ti consentono di incorporare contenuti da altre fonti nel tuo post.
Alcuni blocchi di elementi incorporati includono incorporamento di YouTube, Spotify, SlideShare e altro.
Blocco incorporamento di YouTube
Il blocco di incorporamento di YouTube ti consente di incorporare qualsiasi video di YouTube nei tuoi contenuti.

Quindi, questi sono i blocchi che vengono con Gutenberg.
Conversione di vecchi post in blocchi
Se il tuo interesse per l'editor di blocchi ha raggiunto il picco ora, è tempo di dare un'occhiata a come puoi convertire i tuoi vecchi post dell'editor classico in blocchi.
Il processo è molto semplice e richiede solo pochi clic.
Ecco come puoi farlo:
Vai a Post > Tutti i post nella dashboard di WordPress.

Fai clic su "Modifica" sul post che desideri convertire in blocchi.
Ora, se hai installato Gutenberg sul tuo WordPress, il post verrà caricato con la nuova interfaccia dell'editor di blocchi.
Ma tutti i tuoi contenuti saranno all'interno del "Blocco classico" di cui abbiamo discusso nella sezione precedente.

Il blocco classico è semplicemente un editor TinyMCE con tutte le funzionalità dell'editor classico.
È importante notare che solo perché il tuo post è caricato nel nuovo editor di blocchi non significa che sia stato convertito in blocchi.
Per convertire il blocco classico in blocchi singoli, fai clic sull'opzione "Converti in blocchi".

L'intero post verrà convertito in singoli blocchi.
E basta!
È così semplice convertire i tuoi vecchi post in blocchi.
Ma che ne dici di creare nuovi post con l'interfaccia dell'editor di blocchi?
Diamo un'occhiata a quello.
Inserimento di un nuovo blocco
Nelle sezioni precedenti, abbiamo dato un'occhiata all'interfaccia dell'editor di blocchi di Gutenberg. È un'interfaccia semplice e diretta che ti consente di creare facilmente post.
Per aggiungere qualcosa al tuo post, devi inserire un blocco.
Ecco i diversi modi in cui puoi inserire un blocco nel tuo post in Gutenberg.
Esistono tre modi per inserire un blocco e tutti sono abbastanza semplici.
Il primo è semplicemente fare clic sul segno "+" nell'editor dei post.
Puoi anche aggiungere un nuovo blocco facendo clic sul segno "+" nella barra degli strumenti in alto.
E l'ultimo è davvero fantastico. Basta digitare / e poi il nome del blocco e inserire il blocco nell'editor.

La parte migliore di questo metodo è che non devi digitare il nome completo del blocco. Il blocco fornisce automaticamente suggerimenti durante la digitazione.
Duplicazione, spostamento e rimozione di blocchi
La parte migliore dell'editor dei blocchi è che tutto è in un blocco. Quindi, se vuoi copiare un testo, un'immagine o una tabella, non devi copiare l'intera cosa.
Basta selezionare il blocco e scegliere cosa vuoi farne. Puoi duplicare i blocchi, spostarli semplicemente trascinandoli o rimuoverli.
Ecco come puoi farlo.
Duplicazione di blocchi
Duplicare i blocchi è molto semplice.
Per duplicare un blocco, seleziona il blocco e fai clic sulle sue impostazioni (tre punti verticali). Nelle impostazioni, c'è un'opzione per duplicare il blocco.
Cliccaci sopra e il tuo blocco sarà duplicato.

Puoi anche duplicare i blocchi selezionando il blocco e usando il tasto di scelta rapida Ctrl+Maiusc+D.
Blocchi in movimento
Puoi spostare i blocchi trascinandoli o semplicemente facendo clic sui pulsanti su e giù.
Passa il mouse sul tuo blocco e sul lato sinistro vedrai due pulsanti su e giù insieme a un pulsante nel mezzo.
Facendo clic sui pulsanti su/giù si sposta il blocco su/giù. Oppure puoi fare clic sul pulsante centrale e trascinare il blocco dove vuoi che sia.
Rimozione dei blocchi
Per rimuovere un blocco, fai clic sulle impostazioni del blocco e seleziona l'opzione di rimozione del blocco.

Puoi anche rimuovere un blocco usando il tasto di scelta rapida Maiusc+Alt+Z.
Creazione di blocchi riutilizzabili
Una grande caratteristica dell'editor di blocchi è il concetto di blocchi riutilizzabili. Un blocco riutilizzabile è fondamentalmente un blocco che può essere salvato e utilizzato su altri post.
Questa è una funzione davvero utile in quanto ora puoi salvare i blocchi e riutilizzarli.
Per creare un blocco riutilizzabile, fai clic sulle impostazioni del blocco e seleziona l'opzione "Aggiungi a blocchi riutilizzabili".

Quindi, dai un nome al blocco che stai salvando e fai clic sul pulsante Salva.

Questo salverà il tuo blocco nella libreria dei blocchi di Gutenberg.
Ora, ogni volta che vuoi utilizzare il tuo blocco riutilizzabile in altri post, puoi inserirlo come qualsiasi altro blocco.
Puoi anche gestire i tuoi blocchi riutilizzabili nella pagina di gestione dei blocchi. Da questa pagina puoi modificare o eliminare i tuoi blocchi. Puoi anche importare o esportare blocchi.
Aggiunta di più blocchi all'editor blocchi
I blocchi predefiniti forniti nell'editor dei blocchi sono davvero fantastici e ti aiutano a creare bellissimi post e pagine.
Ma cosa succede se vuoi fare un ulteriore passo avanti?
Per fortuna, l'editor dei blocchi consente agli sviluppatori di sviluppare i propri blocchi. Ciò ha portato gli sviluppatori a creare dei fantastici plugin per i blocchi Gutenberg.
Uno di questi plugin è Ultimate Blocks.

Questo plug-in di blocco è fatto per coloro che vogliono ravvivare i propri post del blog e renderli più attraenti.
Il plugin viene fornito con oltre 15 blocchi. Alcuni dei blocchi notevoli sono:
- Filtro contenuti
- Revisione
- Sommario
- Chiamare all'azione
- Clicca per twittare
- Condivisione sociale
- Conto alla rovescia
Ultimate Blocks è incredibilmente facile da usare e molto veloce. Con questo plugin, puoi aggiungere alcuni blocchi unici ai tuoi post e aumentare il tuo coinvolgimento e le condivisioni sui social.
Conclusione
Quindi, questo conclude la nostra guida all'editor blocchi di WordPress. Spero che questa guida ti abbia aiutato a imparare e capire meglio Gutenberg.
Se sei completamente nuovo di questo editor, il miglior consiglio che ho per te è di provarlo. Ti abituerai a usare questo fantastico editor.
E, se hai domande su questo post, sentiti libero di farle nella sezione commenti qui sotto.