Guida completa all’editor Gutenberg wordpress

Guida completa Al nuovo editor

Hai installato da poco wordpress 5 ? Oppure hai effettuato l’aggiornamento a wordpress 5 ? Comunque sia, ti sei trovato di fronte il nuovo editor chiamato Gutenberg WordPress , il nuovo sistema a blocchi per inserire i post facilmente su wordpress, vediamo il suo funzionamento insieme grazie alla guida completa gutenberg wordpress.

Con l’aggiornamento alla versione 5.0, WordPress ha aggiornato il suo storico editor, molto simile ad un normale editor di testo in stile Word, in qualcosa di molto diverso.

Non più solo un editor di testi, ma un vero e proprio editor per costruire contenuti più moderni e ricchi.

In una rapida occhiata, vediamo come cambia nell’aspetto grafico l’editor gutenberg wordpress rispetto al vecchio editor TinyMCE.

Con Gutenberg cambia notevolmente l’esperienza di modifica di una pagina, passando da un’unica area per scrivere il tuo post a un approccio basato su blocchi di contenuto (più su esattamente quali blocchi ci sono in un secondo!)simili a quelli di Visual Composer.

L’obiettivo di Gutenberg wordpress è quello di fare in modo che WordPress “vada oltre il post o i modelli di pagina ma ti possa permettere di creare l’intera personalizzazione del sito”.

Ciò significa che alla fine sarai in grado di costruire l’intero sito utilizzando Gutenberg, incluse le pagine di destinazione e altri contenuti importanti.

In questa guida completa gutenberg wordpress vedremo come inserire paragrafi, link, immagini, riutilizzare blocchi, inserire il css e molte altre azioni nel nuovo editor.

Guida completa Gutenberg WordPress: Come si usa

In pratica gutenberg in wordpress può creare quasi ogni cosa, infatti può creare:

• Titoli
• Paragrafi
• Citazioni
• Immagini
• Video
• Blocchi css personalizzati
• widget
• Tabelle
• E’ molto altro

Iniziamo dall’inizio nella guida completa gutenberg wordpress, creando un post, otteniamo subito un blocco per il titolo e subito dopo il blocco paragrafo per poter iniziare a scrivere il nostro testo.

Ovviamente puoi trasformare il blocco in qualsiasi altra cosa cliccando sul (+) del blocco. E ricordati che in alto a sinistra di ogni blocco hai le impostazioni che si aprono cliccando i sei puntini.

Ogni blocco , quindi , come detto si presenta con la propria barra degli strumenti. I pulsanti nella barra cambiano in relazione al blocco che stai usando.

Se intendi andare a capo senza creare un ulteriore blocco pigia Shift + Enter, mentre se pigi solo enter creerai un nuovo blocco.

Inserimento Immagini e Video

C’è un blocco immagine che puoi usare proprio per questa funzione. Devi solo aggiungere il blocco e caricare l’immagine dal tuo computer o selezionarla dalla libreria media.

L’immagine può essere inserita nell’articolo o pagina anche con la tecnica del drag and drop e l’editor crea un blocco immagine in automatico.

Il blocco potrà essere spostato, sopra o sotto i blocchi esistenti semplicemente agendo sulle frecce che appaiono alla sua sinistra.

Inserita l’immagine, sulla barra di destra appaiono le impostazioni di blocco, dove puoi inserire i metadati per l’immagine come il testo alt, dimensione e aggiungere un collegamento all’immagine.

Per i video basta inserire l’url del video se vogliamo caricarlo su un sito esterno e poi metterlo su wordpress per non appesantire il nostro sito web.

Per inserire un immagine affiancata da un testo, basta che dopo aver caricato l’immagine nella barra degli strumenti selezioni immagine affiancata da testo a sinistra o destra ( dove vuoi tu ) e si crea automaticamente due blocchi affiancati.

Inserimento Link e shortcode

L’editor a blocchi ha diversi blocchi in cui puoi inserire testo. Il più utilizzato è il blocco paragrafo che ha nella barra degli strumenti un pulsante inserisci link.

Tutti gli altri blocchi comuni hanno il pulsante inserisci link.

Gli shortcode funzionano allo stesso modo di come funzionavano prima. Li si può aggiungere direttamente in un blocco paragrafo o utilizzando il blocco shortcode.

Inserire pulsanti html css

Puoi creare pulsanti nel nuovo editor gutenberg wordpress , rispeto al vecchio editor, in maniera veramente facile e veloce.

Creando un blocco e cliccando Pulsante, da qui negli strumenti sulla destra puoi decidere tutta la formattazione del pulsante, inoltre ti permette anche di inserire il link.

Inserire un css aggiuntivo , invece, si inserisce il codice css nella scheda css aggiuntivi del template, poi si richiama il nome del div negli strumenti blocco e poi Avanzate, qui mettere il nome che abbiamo dato al blocco div.

Blocchi riutilizzabili

I blocchi del nuovo editor gutenberg wordpress può essere facilmente salvato e riutilizzato per un altro posto o pagina.

Per farlo fai click sul pulsante menu nell’angolo a destra della barra degli strumenti e dal menu seleziona > Aggiungi a blocchi riutilizzabili.

Ti verrà chiesto di fornire un nome per il blocco riutilizzabile. Inserisci un nome e poi clicca sul pulsante salva.

L’editor salva il blocco come blocco riutilizzabile. Ora vediamo come poterlo riusare nei nostri lavori e aggiungerlo in altri articoli o pagine del sito.

Edita l’articolo o la pagina dove vuoi inserire un blocco riutilizzazbile. Dallo schermo di scrittura, fai click sul pulsante aggiungi blocco.

Troverai i tuoi blocchi salvati, elencati nella linguetta “Riutilizzabili”. Puoi trovarli anche scrivendo il nome nel campo di ricerca.

Tutti i blocchi riutilizzabili sono salvati nel database di WordPress e puoi gestirli facendo click sul link Gestisci tutti i blocchi riutilizzabili.

Il link porta alla pagina di gestione, dalla quale puoi modificare o cancellare i blocchi riutilizzabili. I blocchi riutilizzabili possono essere esportati ed utilizzati in altri siti WordPress.

Se fai scorrere il mouse sul nome del blocco, viene fornita un’anteprima di come si presenta il blocco. Per inserirlo nell’articolo o pagina fai click sul nome del blocco.

I blocchi riutilizzabili possono essere modificati. Ricorda però che le modifiche fatte ad un blocco riutilizzabile sono applicate in tutti i contenuti in cui il blocco è utilizzato.

Se non vuoi che i cambiamenti fatti ad un blocco riutilizzabile, si riflettano su tutti gli articoli o pagine in cui hai usato quel blocco, lo devi trasformare in blocco normale, a questo punto, non sarà più aggiornato quando farai cambiamenti al blocco riutilizzabile.

Creare colonne

Per le colonne è semplice , ti basta usare l’elemento colonne, una volta cliccato sulla destra puoi scegliere se inserire da 1 a 6 colonne.

In ogni colonna viene creato un blocco, dove puoi inserire qualsiasi cosa.

Con l’editor Gutenberg di wordpress puoi anche incorporare direttamente i principali social network, inoltre puoi inserire file da qualsiasi sorgente.

Puoi inserire qualsiasi plugin e widget installato. Veramente un ottimo aggiornamento.

I vecchi articoli e le pagine già pubblicate sono completamente al sicuro e non sono in alcun modo interessate dal nuovo editor.

Puoi ancora editarli, e Gutenberg li apre in automatico in un blocco contenente l’editor classico.

Puoi scegliere di editarli con il vecchio editor o di modificarli convertendoli in blocchi per usare il nuovo editor a blocchi,

Vuoi assistenza ? Vuoi creare un sito ? Hai bisogno di Seo ? Contattami