Editor Gutenberg di WordPress: guida utente definitiva per principianti
Pubblicato: 2020-06-18Negli ultimi 18 anni, WordPress ha subito enormi cambiamenti e progressi. Ma il cambiamento più grande è avvenuto nel 2017, quando hanno introdotto per la prima volta il nuovo editor di contenuti, Gutenberg, nel mondo degli utenti e degli sviluppatori di WordPress.
Ora, Gutenberg dovrebbe essere il futuro di WordPress ed è anche considerato l'editor di WordPress predefinito. Questo editor di blocchi trasforma il processo di creazione e pubblicazione di contenuti in WordPress. Ciò significa che se sei un fan di WordPress, allora hai bisogno di una forte presa su Gutenberg.
Per aiutarti, qui copriamo tutto ciò che devi sapere su Gutenberg con alcune semplici linee guida passo dopo passo.
Sommario
- Un'introduzione all'editor Gutenberg di WordPress
- Come utilizzare l'editor Gutenberg di WordPress (guida passo passo)
- Aggiungi il titolo al tuo post/pagina
- Scrivi il tuo testo usando il blocco di paragrafo
- Cambia il colore del tuo testo
- Aggiungi un blocco di intestazione
- Blocco pulsanti Aggiungi e stile
- Inserisci un blocco immagine
- Aggiungi video incorporati ai tuoi contenuti
- Come funziona effettivamente l'interfaccia dell'editor di Gutenberg
- Come abilitare l'editor Gutenberg in WordPress
- Suggerimento bonus: introduzione di alcuni blocchi Gutenberg avanzati in WordPress
- Ricomincia da Gutenberg, altrimenti esci dal trend!
Senza ulteriori indugi, esploriamo le cose insieme.
Un'introduzione all'editor Gutenberg di WordPress
L'editor Gutenberg apporta alcuni cambiamenti significativi nel modo in cui modifichi in WordPress. Ha sostituito l'editor TinyMCE come editor WordPress predefinito, quando la versione 5.0 di WordPress è stata lanciata il 6 dicembre 2018.
Con i blocchi Gutenberg, puoi facilmente aggiungere diversi tipi di contenuto ai tuoi post o pagine e quindi riorganizzare il layout direttamente all'interno dell'editor. Migliorerà la tua intera esperienza di editing al livello successivo.
L'editor si sforzerà di creare una nuova esperienza di creazione di pagine e post che semplifichi la scrittura di post ricchi e abbia "blocchi" per rendere facile ciò che oggi potrebbe richiedere codici brevi, HTML personalizzato o scoperta di incorporamento di "carne misteriosa".
Matt Mullenweg, co-fondatore di WordPress
Inoltre, ti consente di creare contenuti dinamici applicando stili e impostazioni diversi. All'inizio ti sembra complesso se utilizzi l'editor classico da molto tempo. Ma gradualmente, man mano che ti ci abitui, puoi sentire l'utilità.
Tuttavia, riduce il fastidio di ottenere plug-in ed estensioni extra. Oltre a questi, questo nuovo editor di WordPress ha un sacco di possibilità per tutti, inclusi blogger, scrittori, fotografi e aziende.
Puoi trovare l'immagine qui sotto dove vedrai l'editor di blocchi di Gutenberg.
Se vuoi ottenere il massimo da questo strumento, devi conoscere il Gutenberg in dettaglio. In questa guida per l'utente Gutenberg definitiva, ci concentreremo su come un utente può gestire l'editor Gutenberg in modo più efficace.
Puoi controllare rapidamente la storia completa di WordPress Gutenberg Blocks.
Entriamo nel profondo.
Come utilizzare l'editor Gutenberg di WordPress (guida passo passo)
Il principale cambiamento che Gutenberg apporta nell'editor di WordPress è un approccio di modifica basato sui blocchi. Un blocco può essere qualcosa come:
- Un'intestazione
- Un paragrafo di testo
- Un'immagine
- Un video incorporato
- Una citazione
- Un pulsante e altri
Dopo aver cliccato sul pulsante “+” otterrai una finestra che include tutti i blocchi disponibili. Puoi cercare il blocco richiesto da qui e utilizzarlo nei tuoi contenuti:
In questo momento, proveremo a dimostrarti come utilizzare alcuni blocchi popolari di cui le persone di solito hanno bisogno durante la creazione di contenuti.
1. Aggiungi il titolo al tuo post/pagina
Ogni contenuto ha un titolo. Quindi devi aggiungere un titolo nel tuo post o pagina. In Gutenberg, puoi aggiungere il tuo titolo attraverso questo processo.
2. Scrivi il tuo testo usando il blocco di paragrafo
Per aggiungere prima un paragrafo devi aggiungere un blocco paragrafo. Quindi scrivi semplicemente il tuo contenuto sul blocco. Ecco come funziona.
Nota: il sottomenu sopra il blocco ti consente di modificare l'allineamento del testo e la formattazione del testo del contenuto del blocco. Puoi effettuare ulteriori personalizzazioni dal menu di destra dell'editor.
3. Cambia il colore del tuo testo
A volte devi cambiare il colore del testo, puoi farlo qui.
4. Aggiungi un blocco di intestazione
Come il paragrafo, puoi facilmente aggiungere la tua intestazione nel contenuto del tuo post usando il blocco Intestazione.
5. Blocco pulsanti Aggiungi e stile
Il pulsante è uno degli elementi importanti del contenuto. In Gutenberg, puoi aggiungere il tuo pulsante in modo molto semplice. Inoltre, puoi anche inserire più pulsanti nella stessa riga.
Inoltre, puoi cambiare il colore del testo o dello sfondo del pulsante come mostrato sopra.
6. Inserisci un blocco immagine
Aggiungiamo un'immagine nel tuo contenuto seguendo questo esempio.
7. Aggiungi video incorporati ai tuoi contenuti
Gutenberg ti consente anche di inserire qualsiasi tipo di video da incorporare nel tuo post. Vediamo come puoi utilizzare questo blocco di incorporare video.
Guarda com'è facile! Ora puoi usare l'editor di blocchi Gutenberg seguendo gli esempi sopra. Puoi anche aggiungere altri tipi di contenuto a blocchi e personalizzarli usando l'editor Gutenberg.
Inoltre, se vuoi saperne di più sull'uso dell'editor Gutenberg, puoi trovarlo qui.
Vediamo come funziona l'interfaccia dell'editor di Gutenberg
Gutenberg è un potente editor di blocchi per WordPress che ti consente di modificare il contenuto del tuo post molto facilmente. Ancora più importante, sono disponibili tonnellate di blocchi avanzati in modo da poter creare facilmente i tuoi contenuti web senza sforzo.
Usare i blocchi Gutenberg è facile e divertente. Trascina e rilascia semplicemente i blocchi di cui hai bisogno. Inoltre, non è necessario concentrarsi sulla conoscenza del codice.
In effetti, ogni volta che vuoi modificare qualcosa sui blocchi Gutenberg, hai la piena libertà di fare quello che vuoi. Per la tua preoccupazione, dai un'occhiata a questo blog per conoscere la modifica dei blocchi di Gutenberg.
Vediamo come utilizzare l'editor e i blocchi Gutenberg con esempi di vita reale.
1. Diverse modalità di scrittura
Nell'editor Gutenberg troverai tre diverse modalità di scrittura per aiutare i tuoi stili di scrittura.
Barra degli strumenti in alto: La barra degli strumenti in alto aiuta a visualizzare tutti i blocchi nello stesso punto.
Modalità Spotlight: Spotlight è completamente diverso dalla modalità Top Toolbar. Infatti, quando selezioni questa opzione puoi modificare solo un blocco che vuole modificare. E l'altro blocco resta da disabilitare.
Modalità a schermo intero : rimuove tutte le dashboard della barra laterale sinistra e ti consente di lavorare in modalità a schermo intero.
2. Scorciatoie da tastiera di Gutenberg per velocizzare il flusso di lavoro
Ci sono molte scorciatoie da tastiera in questo editor. Usando queste scorciatoie puoi anche lavorare più leggero e risparmiare più volte.
- Ctrl + Alt Backspace elimina il blocco selezionato
- Per inserire un nuovo blocco prima dei blocchi selezionati - Control + Alt + T
- Per inserire un nuovo blocco dopo i blocchi selezionati- Ctrl + Alt + Y
- Visualizzazione della guida: Maiusc + Alt + H
- Salva le modifiche: Ctrl + S
- Annulla le ultime modifiche: Ctrl + Z
- Ripeti l'ultimo annullamento: Ctrl + Maiusc + Z
- Mostra o nascondi la barra laterale delle impostazioni Ctrl + Maiusc +,
- Vai alla parte successiva dell'editor Ctrl + '
3. Cerca blocco dalla libreria
La ricerca di un blocco è molto semplice nell'attuale editor WordPress predefinito. È possibile cercare un blocco particolare dall'indice ricercabile della Libreria dei blocchi Gutenberg. Otterrai la finestra semplicemente facendo clic sul pulsante "+".
4. Passa dall'editor visivo all'editor di codice
Inoltre, a volte è necessario passare dall'editor visivo all'editor di codice per apportare alcune modifiche. Lo fai proprio qui.
5. Gutenberg delinea il tuo documento
Una struttura del contenuto è una parte molto importante della struttura del contenuto. Nell'angolo in alto a sinistra del tuo editor, troverai una piccola "i" in un cerchio. Cliccando su questo, puoi vedere la struttura completa del tuo blog a colpo d'occhio.
6. Modello di blocco riutilizzabile
Usando questo, puoi usare il tuo precedente progetto di blocco che hai salvato in precedenza. Quindi ti fa risparmiare molto tempo. Ecco come lo usi.
Ottieni alcuni suggerimenti utili su questo editor di blocchi da qui.
Come abilitare l'editor Gutenberg in WordPress
Qui discuteremo di come gli utenti possono abilitare l'editor di blocchi Gutenberg nella dashboard di WordPress. Se stai utilizzando WordPress 5.0 e versioni successive, non dovrai abilitarlo separatamente. Perché ora WordPress viene fornito con Gutenberg per impostazione predefinita.
D'altra parte, se stai ancora utilizzando l'editor classico e stai pianificando di passare all'editor Gutenberg. Quindi puoi facilmente installare e attivare il plug-in Gutenberg come l'altro processo di attivazione dei plug-in.
Puoi trovare il link per il download di Gutenberg qui.
Bonus: introduzione di alcuni blocchi Gutenberg avanzati in WordPress
Come abbiamo detto, Gutenberg è incentrato su molti blocchi utili diversi che usiamo sempre per progettare post o pagine. Qui tratteremo alcuni di quei potenti blocchi che puoi usare per dare un aspetto extra elegante al tuo blog.
Generalmente, Gutenberg separa i loro blocchi in 7 diverse categorie. Troverai nelle seguenti liste:
- Più usato
- Blocchi comuni
- Formattazione
- Elementi di layout
- Widget
- Incorpora
- Riutilizzabile
Concentriamoci su alcuni blocchi utili.
Citazione: vediamo spesso l'uso di citazioni nei blog o negli articoli. In questo nuovo editor di WordPress, puoi utilizzare il blocco "Citazione" per aggiungere una citazione. Puoi applicare stili diversi per mostrare la tua citazione in modo accattivante.
Shortcode: è un altro blocco essenziale che puoi utilizzare sulla pagina del tuo sito Web o sul post. Con questo blocco shortcode, puoi facilmente aggiungere il banner di affiliazione desiderato, l'immagine del prodotto e altro ancora.
Classico: a volte avrai bisogno del tuo editor classico di WordPress per modificare il contenuto del tuo post. Grazie a Gutenberg per avere questo fantastico blocco in modo da poter utilizzare facilmente il tuo vecchio editor.
HTML personalizzato: questo blocco ti aiuta anche ad aggiungere codice HTML personalizzato nei post del tuo blog.
Inoltre, puoi esplorare più blocchi Gutenberg utilizzando plugin di terze parti.
Ricomincia da Gutenberg e andiamo avanti a tutti!
L'editor Gutenberg è uno dei principali cambiamenti nella storia di WordPress. Potrebbe volerci del tempo per adattarsi a questa interfaccia completamente nuova. Ma a lungo termine renderà le tue mani più potenti per creare contenuti sorprendenti.
Si spera che questa guida all'editor di Gutenberg per WordPress ti aiuti a imparare molti aspetti utili di questo fantastico editor di blocchi. Pertanto, puoi gestire questo editor di blocchi senza problemi.
Allora, cosa ne pensi dell'editore di Gutenberg finora? Lo trovi utile o no? Condividi la tua esperienza o le tue domande sull'editor di Gutenberg WordPress inserendo un commento qui sotto.