avia layout editor enfold creare layout

Guida ad Avia layout builder di Enfold

Il tema Enfold è dotato di un potentissimo layout Builder, costruito con framework Avia, un Editor avanzato di Layout che consente di creare pagine ed articoli dall’aspetto accattivante, creativo, aggiungendo elementi grafici come immagini a tutto schermo, video, titoli speciali, suddivisioni della pagina in colonne dai formati particolari, icone, insomma tutto ciò che ci serve per avere un sito dalla grafica stupenda.

Possiamo usare l’Avia builder sia negli articoli che nelle pagine, a nostra discrezione, per creare ad esempio una Home page che contenga gli ultimi articoli pubblicati, fasce di diverso colore, immagini di sfondo, ecc. E’ facilmente intuibile la ricchezza di grafiche che si può combinare guardando le numerose demo nel sito ufficiale di Enfold.

Impostazioni di base Editor avanzato di Enfold

Puoi impostare le opzioni di base dell’editor di layout avanzato di Enfold, accedendo accedendo dal menù di sinistra di WordPress “Enfold” (nella mia schermata vedrai Enfold child, perché io usao un tema child), cliccando sulla linguetta “Layout builder”:

In questa schermata puoi decidere varie cose, come ad esempio la possibilità di vedere in anteprima o meno l’aspetto grafico degli elementi già nell’editor, cosa che io ho disattivato perché la trovavo veramente scomoda.
Puoi decidere, se più utenti hanno accesso al tuo backend, di nascondere le opzioni di layout e farle vedere solo all’amministratore, e molte altre opzioni che sono ben commentate.

Costruire pagine ed articoli con il layout builder avanzato di Enfold

Quando vuoi utilizzare l’editor avanzato di Layout di Enfold, dopo aver creato un nuovo articolo o una nuova pagina, dovrai cliccare in alto a destra sul bottone blu “Editor avanzato di Layout”.
La schermata dell’editor di WordPress cambierà leggermente, ed appariranno le linguette che contengono tutti i moduli utilizzabili nell’editor avanzano, raggruppate in “Elementi di Layout”, “Elementi di contenuto”, “Elementi media” e “Plugin aggiunti”. Premendo una di queste linguette, di apriranno sotto ad essa tutti i moduli che puoi utilizzare.

avia layout editor enfold

Elementi di Layout di Avia Layout builder

La tab “elementi di Layout” contiene tutti quei moduli che ti consentono di personalizzare il layout della tua pagina ed articolo. Potrai ad esempio suddividere la larghezza del sito in colonne di varie proporzioni, ad esempio affiancando due colonne della stessa larghezza (1/2), oppure una colonna da 1/5 e più colonne di varie misure.

elementi di layout avia layout builder enfold

Io trovo interessantissima la Sezione colore, perché attraverso di essa puoi utilizzare sfondi a tutto schermo, parallasse e video in movimento come sfondo, impostando l’altezza dell’elemento al 100% della pagina, quindi creando un sito fullscreen.
Ma le opzioni sono veramente tante e ti consiglio di provare e sperimentare.

Puoi inserire un elemento di Layout premendo su di esso oppure trascinandolo dove lo vuoi collocare.
Dopo averlo inserito, potrai personalizzarlo o duplicarlo con gli appositi bottoncini che appaiono in alto a sinistra ad ogni modulo quando ci passi sopra col mouse.

editor avanzato enfold

Le icone sono molto intuitive e sono presenti su tutte le tipologie di modulo messe a disposizione da Enfold.

Cliccando sull’icona di modifica, per ogni modulo si apre una nuova finestra pop-up con tutte le impostazioni possibili per quel modulo, e sono davvero tante, ti consiglio di spulciarle tutte!

Per gli utenti avanzati, è anche possibile assegnare un ID o una classe a ciascun modulo, per poter personalizzarlo ulteriormente attraverso i propri CSS. E’ possibile fare questo cliccando sulla tab “Avanzate” all’interno della pop-up di modifica di ogni modulo, nella sezione “impostazioni dello sviluppatore”

avia layout editor sviluppatore

In ogni elemento di Layout possono essere inseriti e nidificati altri elementi di Layout e gli elementi di Contenuto e Media.

Elementi di contenuto

La sezione “Elementi di contenuto” contiene tutti quegli elementi che hanno a che fare con testi, titoli, pulsanti, tabelle, elenco di articoli, newsletter, mduli di contatto, numeri animati, ecc.

elementi di contenuto avia layout builder

Gli elementi di contenuto utilizzabili in Enfold sono davvero tantissimi e vari, sicuramente quello che utilizzerai di più è il blocco di testo che ti consente appunto di scrivere un testo formattandolo in ogni suo particolare. Il modulo “Blocco di testo” verrà inserito e ci dovrai cliccare sopra per inserire un testo: si aprirà una pop-up con il “vecchio” editor di testo di WordPress, precedente a Gutember (ne ho parlato qui), dove potrai scrivere, formattare ecc, con l’aggiunta delle personalizzazioni possibili da Avia Layout builder

blocco di testo Avia layout builder

Molto utile il modulo “Articoli”, che ti consente di inserire nella pagina o nell’articolo gli ultimi articoli pubblicati, o gli articoli appartenenti ad una categoria o ad un tag, filtrarli e decidere se far vedere l’immagine in evidenza, l’autore e la data, in una visualizzazione a griglia, elenco, ecc.

inserire elenco articoli in pagina wordpress enfold

Ti consiglio anche in questo caso di provare ad utilizzare i vari moduli e sperimentare tutte le loro potenzialità.

Elementi Media di Avia Layout builder

elementi media avia layout builder

Gli elementi Media di Avia Layout builder sono tutti quegli moduli che hanno a che fare con immagini, video ed elementi multimediali come mappe e loghi.

Anche per quanto riguarda questi moduli, puoi inserirli cliccando su di essi oppure trascinandoli all’interno della pagina o di un modulo di Layout.

Plugin aggiuntivi

Nella linguetta “Plugin aggiuntivi” di Avia layout builder trovi tutti quegli elementi che puoi utilizzare e sono stati aggiunti tramite plugin a WordPress, quindi ogni sito avrà i suoi in base alla propria installazione.

Salvare modelli di pagina

Ogni gruppo di elementi che hai usato per costruire la tua pagina può essere salvato come modello ed essere riutilizzato in altri punti del tuo sito, in altre pagine ed in altri articoli.
Ad esempio se hai costruito un Layout per una pagina con una sezione colore, che ha una immagine di sfondo, contiene due colonne, una con testo e l’altra con un elenco di articoli, puoi salvare questa sezione e riutilizzarla in un’altra pagina.

modelli avia layout editor enfold

Modificare pagine ed articoli con Avia Layout Builder

Se hai delle pagine o degli articoli costruiti magari dal tuo sviluppatore WordPress e ora devi occuparti tu di modificare testi ed immagini, potresti trovarti un po’ spiazzato nel vedere i blocchi dell’editor avanzato e non sapere bene come fare.
Non vedrai infatti la pagina come appare sul sito, ma vedrai tutta una serie di blocchi, come qui sotto:

modificare pagina avia layout builder

Modificare le varie sezioni in realtà è semplice, ti basterà cliccare su uno dei blocchi che vuoi modificare e si aprirà la popup con le opzioni e il testo, e lì potrai operare le tue modifiche.
Ricordati sempre che per visualizzare le modifiche mentre stai lavorando sulla pagina, puoi sempre premere in alto a destra il tasto “Anteprima”.

Come ti sembra l’utilizzo di Avia Layout Builder in Enfold? Hai domande sul suo utilizzo? Se si, scrivimi pure qui sotto nei commenti e se vuoi acquistare il tema Enfold, clicca qui!

PRODOTTI CONSIGLIATI:


1 commento
  1. Chiara
    Chiara dice:

    Ciao!
    Grazie per le vostre preziosissime indicazioni!
    Avrei bisogno di un vostro aiuto…Ho scaricato il tema Enfold e importato la demo Enfold Health. Adesso vorrei modificare le immagini che di default vengono inserite nel portfolio ma non riesco a capire dove sono per poterle cambiare. Mi sapete aiutare?

    Rispondi

Lascia un Commento

Vuoi partecipare alla discussione?
Sentitevi liberi di contribuire!

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Questo sito usa Akismet per ridurre lo spam. Scopri come i tuoi dati vengono elaborati.