ruoli<\/a> ‘non editor’ un pannello semplificato, che non permette di modificare o spostare i blocchi.<\/p>\n\n\n\nL\u2019interfaccia dell\u2019editor con GreenShift<\/h2>\n\n\n\n Dopo l\u2019attivazione di GreenShift l\u2019interfaccia di Gutenberg mantiene la stessa struttura, con i due pannelli laterali e l\u2019area di lavoro centrale, ma compaiono molte pi\u00f9 funzionalit\u00e0. Per iniziare, sulla barra laterale sinistra ora hai diverse decine di nuovi blocchi<\/strong>, che precedono i blocchi classici di Gutenberg.<\/p>\n\n\n\nIn pi\u00f9 nella barra dei comandi orizzontale trovi delle icone <\/strong>che ti permettono di accedere alle impostazioni generali di GreenShift senza uscire dall\u2019editor. <\/p>\n\n\n\nCliccando sulla \u201cG\u201d puoi accedere alle diverse sezioni dello Stylebook direttamente nel pannello laterale<\/strong> destro di Gutenberg. <\/p>\n\n\n\nL’icona a forma di database invece corrisponde a GreenShift Helpers<\/strong>, la libreria dei template di layout e sezioni del page builder.<\/p>\n\n\n\nPanoramica dei blocchi del builder<\/h3>\n\n\n\n I blocchi inseriti da GreenShift appartengono a 2 tipi principali<\/strong>: quelli propri di GreenShift (in blu) e quelli di GreenLight (in verde). A seconda della configurazione che hai scelto, vedrai prima i blocchi per principianti o quelli per esperti.<\/p>\n\n\n\nAll\u2019interno dei blocchi GreenShift trovi per primi i blocchi di layout (Layout Blocks<\/strong>), cio\u00e8 i contenitori che servono a definire la struttura della pagina: sezioni, colonne, griglie, box.<\/p>\n\n\n\nPoi ci sono i blocchi per il contenuto avanzati (GreenShift Content Blocks<\/strong>) che servono a creare heading, pulsanti, video, testi da cui partono popup, testi e forme SVG, ecc. <\/p>\n\n\n\nInvece i GreenShift Extra Blocks<\/strong> servono a inserire elementi aggiuntivi che possono arricchire la pagina come contatori, mappe, indici degli articoli, caroselli, pulsanti di condivisione. Il fatto di poterli inserire dal builder pu\u00f2 evitarti di installare dei plugin specifici e aiutarti a mantenere il sito veloce e ordinato.<\/p>\n\n\n\nI blocchi GreenLight sono organizzati allo stesso modo: elementi di layout, di contenuto, elementi extra e una sezione aggiuntiva dedicata agli elementi tag<\/em>.<\/p>\n\n\n\nDifferenza tra blocchi di GreenShift e blocchi GreenLight<\/h3>\n\n\n\n Come hai visto, questo builder per WordPress offre due tipi di blocchi, che possono essere combinati per costruire una pagina. Ma qual \u00e8 la differenza?<\/p>\n\n\n\n
I blocchi GreenShift<\/strong> sono pensati per essere intuitivi da usare anche per chi non conosce il codice, quindi sono molto visivi. <\/p>\n\n\n\nIn questo caso le opzioni del blocco sono divise in 2 tab: General e Advanced<\/strong>.<\/p>\n\n\n\nLe impostazioni generali<\/strong> permettono di definire in modo molto dettagliato aspetti come:<\/p>\n\n\n\n\ntipografia <\/li>\n\n\n\n sfondo<\/li>\n\n\n\n spaziatura<\/li>\n\n\n\n bordo<\/li>\n\n\n\n ombreggiatura<\/li>\n\n\n\n dimensione<\/li>\n\n\n\n testo contenuto<\/li>\n\n\n\n inserimento di un sottotitolo.<\/li>\n<\/ul>\n\n\n\nLe impostazioni avanzate sono dedicate all\u2019animazione del blocco. Alcune sono gratuite, altre possono essere attivate solo con l\u2019acquisto di un\u2019estensione a pagamento: Animation Addon.<\/p>\n\n\n\n
I blocchi GreenLight offrono un<\/strong> controllo totale sul codice e la massima flessibilit\u00e0 nella personalizzazione, usano nomenclature CSS standard e sono perfetti per chi ha gi\u00e0 competenze tecniche. <\/p>\n\n\n\nContengono due sezioni principali: una generale relativa al contenuto e al tag HTML e poi un men\u00f9.<\/p>\n\n\n\nQui trovi funzionalit\u00e0 come:<\/p>\n\n\n\n
\nLocal Styles<\/strong>, caratteristiche tipografiche e di stile che si possono applicare al singolo blocco;<\/li>\n\n\n\nInteraction layer<\/strong>, che permette di aggiungere un livello che gestisce i comportamenti dinamici degli elementi della pagina;<\/li>\n\n\n\nAnimation<\/strong>, con le funzionalit\u00e0 per rendere il blocco dinamico;<\/li>\n\n\n\nExtra options & Effects<\/strong>, che permette di aggiungere variabili CSS dinamiche, effetti legati allo spostamento del mouse, didascalie dinamiche (tooltip) <\/li>\n<\/ul>\n\n\n\nUn\u2019altra differenza <\/strong>tra i due tipi di blocchi riguarda il tag<\/strong>. I blocchi di GreenLight permettono di cambiarlo dopo l\u2019inserimento e passare a un altro tipo di blocco, come quelli di Gutenberg. Invece i blocchi di GreenShift permettono variazioni pi\u00f9 ristrette, per esempio di passare da un tipo di heading a un altro ma non da un titolo a un contenuto multimediale.<\/p>\n\n\n\nCome creare una pagina con GreenShift<\/h2>\n\n\n\n Come ormai avrai capito, per creare una pagina o un articolo con GreenShift non devi far altro che avviare l\u2019editor a blocchi di WordPress nel solito modo.<\/p>\n\n\n\n
A seconda delle opzioni che hai scelto, visualizzerai prima i blocchi GreenShift o i blocchi GreenLight<\/strong>.<\/p>\n\n\n\nIl plugin sfrutta l\u2019editor drag and drop<\/em> di Gutenberg, quindi per aggiungere i suoi blocchi alla pagina non devi far altro che trascinarli e rilasciarli <\/strong>nell\u2019area centrale dell\u2019editor.<\/p>\n\n\n\nPer costruire una pagina inizierai con l\u2019inserimento di un elemento contenitore, cio\u00e8 uno dei Layout Blocks. Per esempio io ho inserito Row\/Columns Advanced, ho scelto la struttura a due colonne e poi ho inserito nella prima un testo <\/strong>e nella seconda un\u2019immagine<\/strong>.<\/p>\n\n\n\n<\/video><\/figure>\n\n\n\nUna volta che ho inserito un elemento di GreenShift, posso cliccarci sopra per visualizzare le impostazioni nel pannello a destra<\/strong>, come avviene normalmente su Gutenberg ma con pi\u00f9 opzioni a disposizione.<\/p>\n\n\n\n<\/video><\/figure>\n\n\n\nQuando aggiungiamo <\/strong>blocchi di testo<\/strong> e heading <\/strong>di GreenShift dobbiamo ricordare che vengono inseriti con un tag <\/strong>div<\/em><\/strong>, quindi dovremo cambiarlo in <\/strong>p<\/em><\/strong> <\/em>se vogliamo rispettare le buone pratiche della SEO on-page<\/a>. <\/p>\n\n\n\nUn\u2019altra differenza rispetto ai blocchi di testo di Gutenberg consiste nel fatto che in GreenShift premendo Invio non creiamo un nuovo blocco, ma andiamo a capo all\u2019interno dello stesso blocco. Se vuoi creare un nuovo blocco<\/strong> GreenShift, invece, devi trascinare nell\u2019area di lavoro un nuovo elemento di testo oppure aprire il men\u00f9 del blocco nella barra dei comandi orizzontale e scegliere