Come utilizzare Gutenberg in WordPress: guida completa per principianti

Pubblicato: 2023-12-11

Dalla versione WordPress 5.0, l'editor classico è stato sostituito con Gutenberg come editor predefinito. Quindi, se utilizzi WordPress, devi utilizzare il nuovo Gutenberg o tornare all'editor classico per creare una nuova pagina o post.

Ma perché tornare indietro quando quello nuovo è più completo? Gutenberg noto anche come "Block Editor" introduce un nuovo approccio basato su blocchi alla creazione di contenuti con maggiore flessibilità e facilità.

Quindi è necessario avere una conoscenza da base ad avanzata dell'editor a blocchi Gutenberg. E questo blog ti renderà le cose facili.

Nel corso di questa guida imparerai le basi su come utilizzare Gutenberg in WordPress, nonché alcuni trucchi avanzati come blocchi e pattern riutilizzabili.

Indice [nascondi
Cos’è l’editor a blocchi Gutenberg WordPress?
Comprendere blocchi e schemi
Come utilizzare Gutenberg in WordPress?
Come funziona l'editor di blocchi Gutenberg in WordPress?
Passaggio 1: come aggiungere un blocco in Gutenberg
Passaggio 2: aggiungi contenuto al blocco
Passaggio 3: personalizza gli stili di blocco
Salvare e riutilizzare i blocchi in Gutenberg
Incartare

Cos’è l’editor a blocchi Gutenberg WordPress?

In una frase, Gutenberg è l’editor relativamente nuovo di WordPress che utilizza i blocchi per creare pagine web e post. L'editor di blocchi è stato introdotto pensando alla semplicità e alla flessibilità. In Gutenberg, ogni contenuto è un blocco individuale.

Pertanto, puoi progettare una pagina Web o un post con una combinazione di diversi tipi di contenuto tra cui testo, immagini, video, tabelle e altro. Questo editor ti aiuta a riorganizzare, definire lo stile e personalizzare ciascun blocco in modo indipendente, offrendo il massimo controllo sull'aspetto del tuo sito web.

Comprendere blocchi e schemi

Per sapere come funziona l’editor a blocchi Gutenberg, devi familiarizzare con un paio di nuovi termini. I blocchi e i pattern di blocco di WordPress sono i due termini che useremo di più nel descrivere Gutenberg. Quindi cerchiamo prima di capirli.

Blocchi:

I blocchi in Gutenberg sono gli elementi unitari utilizzati per creare contenuti. Ogni blocco rappresenta un elemento separato o un contenuto. Ad esempio, utilizzando il blocco paragrafo, puoi aggiungere contenuto testuale, il blocco immagine ti consente di aggiungere immagini al tuo contenuto.

Allo stesso modo, l’editor di blocchi di WordPress ha blocchi come intestazioni, gallerie, elenchi, citazioni, contenuti multimediali incorporati (come video o tweet) e altro ancora.

Oltre ai blocchi predefiniti, molti plugin si aggiungono all'elenco dei blocchi per l'editor Gutenberg.

Blocchi di Gutenberg

Modelli:

D'altra parte, i modelli sono un insieme di blocchi raggruppati per formare un layout o un disegno. Questi modelli aiutano gli utenti ad aggiungere rapidamente layout complessi o combinazioni di blocchi comunemente utilizzate con un solo clic. In definitiva, risparmiando tempo e fatica per creare pagine web.

I modelli possono variare da layout semplici come una sezione CTA con intestazione, testo e pulsanti a design più complessi come la sezione hero del sito Web, caroselli di testimonianze, sezioni dei membri del team, tabelle dei prezzi e altro ancora.

Modelli di blocchi di Gutenberg

Come utilizzare Gutenberg in WordPress?

Usare Gutenberg è semplice e facile. Scegli un blocco, aggiungi contenuto, personalizzalo e la tua pagina web è pronta! Eppure c’è di più. Scopriamo nel dettaglio come utilizzare Gutenberg in WordPress.

Come funziona l'editor di blocchi Gutenberg in WordPress?

Se utilizzi WordPress 5.0 o versione successiva, cosa più probabile, Gutenberg è già il tuo editor predefinito. Quindi non è necessario installare o attivare l'editor dei blocchi. Basta aprire una nuova pagina o pubblicare un post e potrai creare i tuoi progetti in WordPress.

Come utilizzare Gutenberg in WordPress - Aggiungi una nuova pagina

Passaggio 1: come aggiungere un blocco in Gutenberg

Aggiungere un blocco in Gutenberg, l'editor di blocchi predefinito di WordPress, è un processo semplice. Inserisci prima il titolo della pagina.

Ora per aggiungere un blocco,

  • Apri un campo per aggiungere un blocco: fai clic sull'icona "+" nell'editor o premi / sulla tastiera. Questo aprirà l'inseritore di blocchi.
  • Sfoglia e seleziona un blocco: puoi cercare un blocco digitandone il nome o scorrere i blocchi disponibili. Scegline uno e fai clic sul blocco che desideri aggiungere.

Puoi esplorare questi blocchi per creare contenuti diversi e coinvolgenti per il tuo sito WordPress. Una volta aggiunto il blocco, ora puoi aggiungere contenuto al blocco che hai selezionato.

Come usare Gutenberg in WordPress: aggiungi un blocco

Passaggio 2: aggiungi contenuto al blocco

Gutenberg offre una vasta gamma di blocchi per vari tipi di contenuti. Come detto in precedenza, ciò include paragrafi, titoli, immagini, video, pulsanti, tabelle e molto altro. Puoi aggiungere diversi tipi di contenuti alla tua pagina web utilizzando questi blocchi.

Ad esempio, se desideri creare una galleria di immagini, 1. seleziona il blocco della galleria, 2. Carica o scegli le immagini dal catalogo multimediale e avrai una galleria aggiunta alla pagina.

Allo stesso modo, se desideri aggiungere un'intestazione, seleziona semplicemente il blocco dell'intestazione e aggiungi il testo dell'intestazione.

Passaggio 3: personalizza gli stili di blocco

La cosa più sorprendente dell'editor di blocchi di WordPress è che puoi personalizzare ogni blocco in modo diverso. Ad esempio, due blocchi di paragrafo possono avere colori di testo e tipografia diversi.

Pertanto, quando aggiungi un blocco, il pannello laterale destro mostrerà le opzioni personalizzabili. Allo stesso modo, per un blocco di paragrafo, puoi personalizzare il testo e il colore dello sfondo, scegliere la dimensione del testo e la tipografia come la famiglia di caratteri, l'altezza della linea, la spaziatura delle lettere, ecc.

Personalizza gli stili dei blocchi Gutenberg

Salvare e riutilizzare i blocchi in Gutenberg

I blocchi riutilizzabili, ora denominati "Modelli sincronizzati" sono una delle funzionalità intuitive introdotte in Gutenberg. L'editor di blocchi di WordPress ti consente di salvare un blocco o un gruppo di blocchi con i suoi stili personalizzati e riutilizzarlo successivamente su altre pagine o post. Ciò consente di risparmiare tempo e fatica in larga misura.

Per rendere riutilizzabile un blocco Gutenberg,

  1. Seleziona un blocco o un gruppo.
  2. Fare clic sull'icona dei tre punti ( ⋮ ).
  3. Trova il "Crea modello/blocco riutilizzabile".
  4. Inserisci un nome.
  5. Abilita l'interruttore "Sincronizzato" per renderlo riutilizzabile.
  6. Infine, fai clic sul pulsante Crea.
Salvare e riutilizzare i blocchi in Gutenberg

Alla fine, il tuo blocco si trasformerà in blocchi riutilizzabili. Ora per utilizzare i blocchi riutilizzabili,

  1. Apri l'editor di WordPress per un post o una pagina in cui desideri aggiungere il blocco riutilizzabile.
  2. Fare clic sull'icona "+" per aggiungere un nuovo blocco.
  3. Nella scheda "Riutilizzabili", vedrai i blocchi riutilizzabili che hai creato. Clicca su quello che vuoi inserire.
Usa i blocchi riutilizzabili in Gutenberg

Nel complesso, i blocchi riutilizzabili possono essere una funzionalità che fa risparmiare tempo, soprattutto se disponi di determinati elementi o layout che utilizzi frequentemente nel tuo sito web.

Incartare

In conclusione, l’introduzione dell’editor a blocchi Gutenberg ha apportato un enorme cambiamento all’usabilità di WordPress. Ciò ha reso la creazione di pagine Web e post più semplice e flessibile.

Quindi, sapere come usare Gutenberg in WordPress è un requisito fondamentale per chiunque utilizzi il CMS WordPress in generale. Comprendendo l'editor basato su blocchi e la sua moltitudine di funzionalità, ora possiedi gli strumenti per creare layout visivamente accattivanti, contenuti ricchi di contenuti multimediali e siti Web intuitivi.