L'editor a blocchi di WordPress può sembrare confusionario al primo avvio. Il layout è diverso, tutto funziona a blocchi e trovare le opzioni di base potrebbe richiedere più tempo del previsto per i principianti.
Tuttavia, l'editor a blocchi è incluso di default in tutte le installazioni di WordPress , il che lo rende uno strumento gratuito per gli utenti.
Quindi, una volta capito come funzionano i blocchi, puoi creare pagine più velocemente, formattare i contenuti con facilità e controllare i layout meglio di quanto avresti mai potuto fare con l'editor classico.
L'editor a blocchi è progettato per essere intuitivo e flessibile, consentendo agli utenti di trascinare e rilasciare i blocchi nella posizione desiderata. Con un po' di pratica, è possibile creare e personalizzare le pagine in pochi minuti.
In breve
- L'editor di WordPress, noto anche come Gutenberg , ha sostituito l'editor classico in WordPress 5.0 e consente di creare contenuti utilizzando singoli blocchi.
- Ogni elemento della tua pagina, inclusi testo, immagini, pulsanti e layout, si trova in un blocco a sé stante con impostazioni dedicate.
- È possibile personalizzare colori, spaziatura, tipografia e allineamento direttamente dal pannello delle impostazioni del blocco, senza bisogno di codice.
- I modelli a blocchi ti offrono layout già pronti da cui partire, mentre i blocchi riutilizzabili ti consentono di salvare e riutilizzare i tuoi elementi in tutto il sito.
Che cos'è l'editor a blocchi di WordPress?
L'editor a blocchi, noto anche come Gutenberg, è l'editor di contenuti predefinito di WordPress. Ha sostituito l' editor classico in WordPress 5.0 a dicembre 2018.
Invece di un'unica area di testo, puoi creare contenuti utilizzando blocchi individuali. Ogni paragrafo, immagine, titolo, pulsante e video ha il suo blocco che puoi spostare, formattare e personalizzare in modo indipendente.
WordPress è passato a un sistema basato su blocchi, così puoi avere un maggiore controllo sui layout delle tue pagine senza dover ricorrere a un page builder separato o a un codice personalizzato.
Editor a blocchi di WordPress vs Editor classico
L'editor classico offriva un'area di testo di base con opzioni di formattazione limitate. Creare qualcosa che andasse oltre il testo e le immagini standard richiedeva l'installazione di plugin aggiuntivi o la necessità di competenze tecniche specifiche.
Con l' editor a blocchi , ogni elemento ha il suo blocco con impostazioni dedicate. Puoi spostare i contenuti, creare layout di colonne, aggiungere pulsanti, incorporare contenuti multimediali e regolare la spaziatura senza scrivere una sola riga di codice.
WordPress non sviluppa più attivamente l'editor classico. Passando all'editor a blocchi avrai accesso a tutto ciò che WordPress offre attualmente, tra cui la modifica completa del sito, i pattern di blocchi e i blocchi riutilizzabili.
Come navigare nell'interfaccia dell'editor a blocchi?
Quando si apre per la prima volta l'editor a blocchi, si ha la sensazione che sullo schermo stiano accadendo molte cose. Tuttavia, ci sono tre aree principali che è necessario conoscere. Una volta comprese tutte, navigare nell'editor diventa molto più semplice.
- Barra degli strumenti superiore: la barra degli strumenti superiore si trova nella parte superiore dello schermo. Utilizzala per aggiungere blocchi, annullare errori, visualizzare in anteprima i contenuti e accedere alle impostazioni di pubblicazione.
- Pannello Impostazioni: il pannello delle impostazioni si trova sul lato destro dello schermo. Mostra le impostazioni del blocco quando clicchi su un blocco e passa alle impostazioni del post, come categorie, tag e immagine in evidenza, quando non è selezionato nulla. Puoi accedere alla scheda del blocco da qui per configurare le impostazioni del blocco selezionato.
- Inserimento blocchi: l'inserimento blocchi è il pulsante blu con il simbolo "più" nell'angolo in alto a sinistra. Cliccandoci sopra, puoi usare la barra di ricerca per trovare e inserire rapidamente blocchi, navigare per categoria o trovare eventuali blocchi riutilizzabili salvati.
Puoi anche utilizzare la visualizzazione elenco per gestire e organizzare i tuoi layout in modo più efficace.
Tipi di blocchi disponibili
L'editor a blocchi organizza tutto in cinque categorie. Ogni categoria raggruppa i blocchi in base alla loro funzione, facilitando la ricerca di ciò di cui hai bisogno quando crei pagine e post.
I blocchi predefiniti coprono un'ampia gamma di tipologie di contenuto, consentendo agli utenti di creare pagine ricche di contenuti multimediali con immagini, video, gallerie e altro ancora.
Ecco cosa copre ciascuno di essi:
- Blocchi di testo: paragrafi, titoli, elenchi, citazioni, frammenti di codice e tabelle. Tutto ciò che scrivi sulla tua pagina rientra in questa categoria.
- Blocchi multimediali: immagini, video, file audio, gallerie di immagini e file scaricabili. Puoi utilizzare diversi blocchi, tra cui gallerie di immagini, per creare contenuti visivamente accattivanti e pagine ricche di contenuti multimediali.
- Blocchi di progettazione: colonne, pulsanti, gruppi, separatori e distanziatori. È possibile combinare più blocchi e altri blocchi per creare layout complessi e controllare la presentazione dei contenuti.
- Blocchi widget: barre di ricerca, elenchi di archivio, elenchi di categorie, ultimi post e calendari. Questi sono gli elementi funzionali che aggiungono valore alle tue pagine.
- Blocchi incorporati: YouTube, Vimeo, Spotify, Twitter e decine di altre piattaforme. L'editor a blocchi consente agli utenti di incorporare facilmente contenuti da fonti terze, come YouTube e Vimeo, direttamente nelle proprie pagine, senza bisogno di codice.
Blocchi WordPress più comuni usati dai principianti
All'inizio, non è necessario imparare tutti i blocchi in una volta. Questi sono i blocchi che userai in quasi ogni pagina e post.
Blocchi di paragrafi e intestazioni
Il blocco paragrafo è il blocco più basilare dell'editor. Ogni volta che inizi a digitare, ne stai utilizzando uno. Puoi modificare la dimensione del carattere, il colore del testo e l'allineamento direttamente dalla barra degli strumenti del blocco, senza dover modificare alcun codice.
I blocchi di intestazione funzionano insieme ai blocchi di paragrafo per strutturare i contenuti. Puoi scegliere tra H1 e H6 a seconda di come desideri organizzare la pagina.
Utilizzare correttamente i livelli di intestazione aiuta anche i motori di ricerca a comprendere i tuoi contenuti, il che è importante per la SEO .
Blocchi di immagini e media
Il blocco immagine ti consente di caricare immagini direttamente dalla tua libreria multimediale o da un URL. Una volta posizionata l'immagine, puoi allinearla a sinistra, a destra o al centro, regolarne le dimensioni e aggiungere testo alternativo per SEO e accessibilità.
Per le immagini multiple, il blocco Galleria le visualizza in un layout a griglia pulito. Puoi controllare il numero di colonne, le dimensioni delle immagini e se visualizzare le didascalie sotto ciascuna immagine.
Blocchi di pulsanti e collegamenti
Il blocco pulsante ti consente di aggiungere un invito all'azione in qualsiasi punto della pagina, senza alcuna competenza di progettazione. Puoi modificare il testo del pulsante, il link, il colore di sfondo, il raggio del bordo e il colore del testo, tutto dal pannello delle impostazioni del blocco.
Per i link in linea, è sufficiente evidenziare il testo in un blocco di paragrafo e cliccare sull'icona del link nella barra degli strumenti. Nessun codice, nessun plugin, solo un collegamento ipertestuale pulito aggiunto in pochi secondi.
Blocchi di elenco e citazione
Il blocco elenco crea elenchi puntati o numerati con un solo clic. È possibile passare da uno stile di elenco all'altro, applicare un rientro agli elementi per creare elenchi nidificati e formattare il testo all'interno di ogni elemento dell'elenco, proprio come in un blocco paragrafo.
Il blocco citazioni evidenzia affermazioni o citazioni importanti nel tuo contenuto. Aggiunge enfasi visiva a un testo, facendolo risaltare rispetto al resto della pagina.
Utilizzalo per testimonianze, punti chiave o qualsiasi cosa tu voglia che i lettori notino.
Come aggiungere, spostare ed eliminare i blocchi?
Ogni azione che esegui nell'editor Gutenberg si riduce a tre cose : aggiungere blocchi, spostarli e rimuoverli. Ecco come funziona ciascuna di queste azioni.
Aggiungere blocchi nell'editor di WordPress
Puoi aggiungere un blocco alla tua pagina o al tuo post in tre modi. Puoi aggiungere un nuovo blocco cliccando sul pulsante "Aggiungi nuovo blocco" o utilizzando il comando slash (digita / seguito dal nome del blocco):
- Inserimento blocchi: fai clic sul pulsante blu "più" nell'angolo in alto a sinistra per aprire l'inserimento blocchi. Qui puoi cercare o sfogliare qualsiasi blocco di cui hai bisogno, ed esplorare la libreria di modelli di blocchi per modelli e layout predefiniti che puoi inserire e personalizzare.
- Inserimento in linea: passa il mouse tra i blocchi esistenti sulla pagina e fai clic sul piccolo pulsante più che appare tra di essi.
- Comando barra: fai clic su un blocco di paragrafo vuoto, quindi digita una barra (/) seguita dal nome del blocco. Questo è un modo rapido per aggiungere un nuovo blocco all'istante.
Spostare e riorganizzare i blocchi in Gutenberg
Esistono tre modi per spostare un blocco in una nuova posizione sulla pagina:
- Pulsanti freccia: ogni blocco ha due pulsanti freccia sulla barra degli strumenti. Utilizzali per spostare il blocco verso l'alto o verso il basso di una posizione alla volta.
- Maniglia di trascinamento: afferra la maniglia di trascinamento a sei punti sul lato sinistro del blocco e trascinala ovunque sulla pagina.
- Panoramica del documento: apri il pannello di panoramica del documento dalla barra degli strumenti in alto per vedere tutti i blocchi elencati in ordine e trascinali nella posizione desiderata da lì.
Eliminazione e rimozione dei blocchi in WordPress
La rimozione di un blocco richiede solo pochi secondi:
- Menu a tre punti: seleziona il blocco, fai clic sul menu a tre punti sulla barra degli strumenti del blocco e seleziona Elimina.
- Scorciatoia da tastiera: seleziona il blocco e premi Backspace o Canc sulla tastiera per rimuoverlo immediatamente.
- Annulla un errore: premi Ctrl Z su Windows o Comando Z su Mac per recuperare un blocco eliminato per errore.
Personalizzazione dei blocchi senza programmazione
Non è necessario conoscere alcun codice per personalizzare l'aspetto dei blocchi. Ogni blocco nell'editor di WordPress ha il proprio pannello di impostazioni sul lato destro dello schermo.
Seleziona un blocco qualsiasi e la barra laterale si aggiornerà immediatamente per mostrarti esattamente cosa puoi modificare per quel blocco.
Ecco cosa puoi controllare direttamente dal pannello delle impostazioni del blocco:
- Impostazioni del testo: modifica la dimensione del carattere, lo spessore del carattere, l'altezza della riga e la spaziatura delle lettere per adattarle allo stile del tuo contenuto.
- Opzioni colore: aggiorna il colore del testo e il colore dello sfondo di qualsiasi blocco utilizzando il selettore colore o inserendo un codice esadecimale.
- Controlli di spaziatura: regola la spaziatura e il margine attorno al blocco per controllare quanto spazio deve essere lasciato sopra, sotto e attorno al contenuto.
- Impostazioni di allineamento: allinea il blocco a sinistra, al centro, a destra oppure impostalo sulla larghezza intera, a seconda delle esigenze di layout.
- Pattern riutilizzabili: salva qualsiasi blocco o gruppo di blocchi come pattern riutilizzabile. Utilizzalo su più pagine e post senza doverlo ricostruire ogni volta.
Utilizzo di modelli di blocchi e blocchi riutilizzabili
Sia i blocchi strutturati che quelli riutilizzabili consentono di risparmiare tempo durante la creazione delle pagine, ma funzionano in modo diverso. Ecco cosa fa ciascuno.
I pattern a blocchi sono layout già pronti all'uso, integrati nell'editor di WordPress. Li trovi nell'inseritore di blocchi nella scheda Pattern, e puoi anche accedere alla libreria ufficiale di pattern a blocchi, con un'ampia selezione di layout predefiniti, da WordPress.org .
Scegline uno che ti piace, trascinalo sulla tua pagina, aggiungi i tuoi contenuti e il gioco è fatto. Non devi partire da zero.
I blocchi riutilizzabili ora si chiamano "Pattern Sincronizzati". Ti permettono di creare e salvare i tuoi contenuti, che potrai riutilizzare in tutti i blocchi del tuo sito.
Una volta salvato, puoi trascinare un modello sincronizzato in qualsiasi pagina o post e, se lo modifichi, la modifica verrà applicata automaticamente ovunque appaia.
Perfetto per sezioni come call to action, dettagli di contatto o dichiarazioni di esclusione di responsabilità che usi ripetutamente.
Errori comuni che i principianti commettono con l'editor a blocchi
La maggior parte dei principianti riscontra gli stessi problemi quando inizia a utilizzare l'editor a blocchi. Ecco a cosa fare attenzione:
- Utilizzo eccessivo di blocchi: non tutto ha bisogno di un blocco dedicato. Aggiungere troppi blocchi separati per piccoli contenuti rende la pagina più difficile da gestire e rallenta il flusso di lavoro di editing.
- Ignorare la struttura dei titoli: molti principianti scelgono le dimensioni dei titoli in base al loro aspetto piuttosto che al loro significato. I livelli dei titoli indicano ai motori di ricerca come sono organizzati i contenuti. Saltare da H2 a H4 o utilizzare H1 più volte danneggia la SEO.
- Non utilizzare le impostazioni della barra laterale: il pannello delle impostazioni del blocco è dove avviene la maggior parte della personalizzazione. Saltarlo significa perdere i controlli tipografici, le opzioni di colore e le impostazioni di spaziatura già integrate.
- Interruzione accidentale dei layout: spostare i blocchi con la maniglia di trascinamento è facile, ma rilasciare un blocco nel posto sbagliato può compromettere il layout. Premi Ctrl + Z su Windows o Comando + Z su Mac per annullare e ripristinare rapidamente.
Conclusione
L'editor Gutenberg può sembrare intimidatorio quando lo si apre per la prima volta. Ogni elemento è un blocco, l'interfaccia è nuova e ci vuole un po' di tempo per abituarsi alle opzioni di base.
Una volta capito come funzionano i blocchi, creare pagine e scrivere contenuti diventa più veloce e flessibile. Puoi controllare i layout, personalizzare i contenuti e gestire l'intero sito senza toccare una sola riga di codice.
Inizia con i blocchi che usi più spesso. Impara a usare il pannello delle impostazioni. Risparmia tempo con pattern e blocchi riutilizzabili. Più usi l'editor, più ti sembrerà naturale.
Domande frequenti su WP Block Editor
Cos'è l'editor a blocchi di WordPress?
Gutenberg è l'editor di contenuti predefinito di WordPress. Ha sostituito l'editor classico di WordPress 5.0 e consente di creare pagine e post utilizzando singoli blocchi di contenuto anziché un'unica area di testo.
L'editor Gutenberg è adatto ai principianti?
Sì. Una volta capito il funzionamento dei blocchi, è semplicissimo da usare. Puoi creare pagine, formattare contenuti e personalizzare layout senza alcuna conoscenza di programmazione o esperienza di progettazione.
Posso tornare all'editor classico in WordPress?
Sì. Puoi installare il plugin Classic Editor dalla directory dei plugin di WordPress per ripristinare il vecchio editor. Tuttavia, WordPress non sviluppa più attivamente l'editor classico, quindi si consiglia di passare ai blocchi per un utilizzo a lungo termine.
Qual è la differenza tra un blocco e un widget in WordPress?
Un blocco è un elemento di contenuto che si aggiunge all'interno dell'editor di pagina o post. Un widget è un elemento di contenuto che si aggiunge ad aree esterne al contenuto principale, come barre laterali e piè di pagina. L'editor a blocchi ora supporta entrambi, con blocchi widget disponibili direttamente all'interno dell'editor.
Come posso aggiungere blocchi personalizzati all'editor di WordPress?
Puoi aggiungere blocchi personalizzati installando un plugin di WordPress che li includa. Molti plugin per la creazione di pagine e librerie di blocchi aggiungono nuovi blocchi direttamente al tuo strumento di inserimento blocchi. Puoi anche trovare e installare singoli blocchi dalla directory dei blocchi all'interno dell'editor.
