Cos'è l'editor di Gutenberg? come ha preso il mondo WordPress con una tempesta? tutto quello che vuoi sapere

Pubblicato: 2019-02-15

Con 1 sito Web su 4 che utilizza WordPress, è senza dubbio uno dei Content Management System (CMS) più utilizzati disponibili. Dai suoi primi giorni, è passato da un sistema di gestione dei blog a un diffuso CMS in buona fede. Ma detto questo, le cose stanno cambiando molto velocemente nel mondo di WordPress e secondo noi le cose stanno cambiando per sempre!

Editor di testo tradizionali, sull'orlo dell'estinzione!

La modifica dei contenuti di WordPress, tradizionalmente, riguardava la modifica di pagine di testo con poche immagini. Non ha fornito alcuna esperienza utente di trascinamento della selezione per la creazione di contenuti. Inoltre, per l'incorporamento di contenuti complessi, gli sviluppatori utilizzano codici brevi, che sono un tipo speciale di sintassi. Con tutte queste limitazioni, la comunità di sviluppo di WordPress aveva bisogno di un editor molto più semplice, che potesse rendere lo sviluppo più veloce ed efficiente.

Con WordPress 5.0 rilasciato il 6 dicembre 2018, è stato introdotto un nuovo editor chiamato Gutenberg. Prende il nome da Johannes Gutenberg, l'inventore della macchina da stampa.

In che modo Gutenberg è diverso dall'editor TinyMCE o da qualsiasi editor di testo tradizionale?

L'editor di Gutenberg segue un approccio basato sui blocchi. Consente la creazione di qualsiasi layout di contenuto con facilità e l'utente può modificare il contenuto in movimento, se necessario. I blocchi possono essere quasi qualsiasi cosa come:

  • Testo
  • Immagine
  • Incorporare
  • Pulsante
  • Widget
  • Tabelle
  • E tanti altri.

L'utente può anche creare blocchi personalizzati, se necessario, e utilizzarli più volte. I temi e i plugin possono migliorare la compatibilità con Gutenberg aggiungendo nuovi tipi di blocchi. Con questo approccio, ci sono possibilità inimmaginabili. E siamo sicuri che la comunità degli sviluppatori di WordPress innoverebbe al meglio delle proprie capacità.

Ci sono casi in cui molti di voi stanno utilizzando una versione di WordPress inferiore alla 5.0 e vogliono giocare con il plug-in Gutenberg, per cominciare è possibile seguire i passaggi seguenti:

Come installare il plug-in Gutenberg?

Puoi iniziare scaricando e installando il plug-in Gutenberg dal repository dei plug-in di WordPress.org. Nel caso in cui tu sia una persona del repository, la raccomandazione standard è di clonare la versione di sviluppo di Gutenberg ospitata su GitHub. Un altro vantaggio dell'utilizzo del repository di sviluppo è che otterresti la versione di sviluppo React.js che è già in bundle con il repository Gutenberg.

La versione di sviluppo fornisce anche una segnalazione degli errori più dettagliata che aiuta con un debug efficace.

Comprendere il layout di Gutenberg

  1. Quali sono i diversi tipi di blocchi disponibili?
Layout di base di Gutenberg

Gutenberg fornisce numerosi blocchi, suddivisi in diverse categorie. I blocchi più utilizzati sarebbero visti in alto, scorrendo verso il basso, ci sono altre sezioni come blocchi comuni, formattazione, elementi di layout, widget ecc. Possiamo scegliere il blocco di cui abbiamo bisogno, trascinarlo sul layout della pagina e iniziare a modificare. Alcuni dei tipi di blocco e la loro usabilità sono spiegati di seguito

  • Gli elementi in linea conterrebbero solo un blocco singolo per un'immagine in linea.
  • Un blocco comune conterrebbe testo normale, paragrafi, virgolette e molti altri elementi costitutivi di base.
  • La formattazione può essere utilizzata per contenuti come una tabella o per contenuti più formattati come le virgolette.
  • Gli elementi di layout possono essere utilizzati per dividere il testo in colonne.
  • I widget possono essere utilizzati per aggiungere categorie, codici brevi o per visualizzare i widget della barra laterale.
  • Gli incorporamenti potrebbero aiutare ad aggiungere YouTube, Twitter, Instagram o qualsiasi altro contenuto esterno.
  1. Esempio di come utilizzare i blocchi
  1. Di seguito è riportato il blocco di virgolette che è stato selezionato dalla categoria del blocco comune e posizionato sullo schermo. Una volta posizionato il blocco delle citazioni, puoi iniziare a modificare il testo secondo necessità.
  1. Puoi anche creare più layout di colonne. È possibile selezionare il blocco delle colonne dalla sezione degli elementi del layout. Una volta selezionato il blocco di colonne, puoi spostare qualsiasi sottoblocco all'interno di questo blocco di colonne per strutturare il contenuto.
  1. Come riorganizzare questi elementi costitutivi di base?
  1. La freccia su o giù può essere utilizzata per spostare i blocchi di un punto alla volta.
  2. Nel caso in cui desideri spostarlo più liberamente, puoi utilizzare l'icona a sei punti per trascinare e rilasciare dove necessario.
  • Come modificare il codice sorgente?
  1. Nel caso in cui sia richiesta la modifica a livello di codice sorgente, puoi fare clic sui tre punti verticali in alto a destra e selezionare Editor di codice.

  1. Per migliorare la tua esperienza di editing, Gutenberg offre una modalità a schermo intero, una barra degli strumenti fissa e una modalità Spotlight.

Una volta che hai finito con la modifica, fai semplicemente clic sul pulsante Pubblica e avrai il tuo post pronto!

Vantaggi (PROS) di Gutenberg

  • Secondo noi, Gutenberg sarebbe una benedizione per gli editori. Consentirebbe loro di creare alcuni temi e plug-in davvero innovativi utilizzando l'approccio di blocco di Gutenberg.
  • Lo sviluppatore può salvare le informazioni sul blocco e persino creare un nuovo blocco specifico per le sue esigenze. La parte migliore è che lo sviluppatore può creare un blocco una volta e usarlo ovunque.
  • Lo schermo nel complesso sarebbe meno ingombrante poiché l'approccio basato sui blocchi offre un layout pulito e ordinato.
  • Il layout dei blocchi è un approccio davvero ottimale per lo sviluppo mobile responsive. Ora sarà relativamente più facile rendere un sito web compatibile con i dispositivi mobili.
  • È così facile da usare che anche i principianti possono facilmente far fronte alla creazione del sito WordPress abbastanza facilmente.

Svantaggi (CONS) di Gutenberg

  • Considera che il 33% di tutti i siti Web su Internet sono costruiti utilizzando WordPress, la retrocompatibilità con Gutenberg è ancora discutibile. L'aggiornamento semplificherebbe le cose agli utenti finali o ai principianti, ma sarà un lavoro noioso per la comunità di sviluppatori rendere i siti Web WordPress esistenti compatibili con Gutenberg.
  • Poiché utilizza React, sarà alquanto difficile da imparare rispetto allo sviluppo standard di WordPress.
  • I plugin e i temi esistenti dovrebbero essere aggiornati per supportare Gutenberg e lo stesso potrebbe richiedere tempo per assimilare questa transizione.
  • Poiché tutto è basato su box, c'è una parte della comunità di sviluppatori che esprime preoccupazione per non riuscire a trovare l'elemento box corretto, il che alla fine porta a una disorganizzazione del layout.

Utilizzo dell'editor tradizionale (es. TinyMCE) con WordPress 5.0

Poiché WordPress 5.0 è già disponibile, tutti i siti Web WordPress devono essere aggiornati per ricevere gli aggiornamenti di sicurezza. Detto questo, esiste un plugin WordPress ufficiale chiamato "Classic Editor" (https://WordPress.org/plugins/classic-editor/) che consentirebbe agli sviluppatori di abituarsi a Gutenberg. Secondo la dichiarazione ufficiale menzionata nella descrizione di questo plug-in "Classic Editor sarà completamente supportato e mantenuto almeno fino al 2022, o per tutto il tempo necessario".

Se hai bisogno di aiuto per aggiornare e iniziare a utilizzare Gutenberg, non esitare a contattarci all'indirizzo [email protected]. Saremo più che felici di fornire i nostri servizi WordPress e portare il tuo sito web al passo con il settore.