I page builder sono oggi gli strumenti più semplici e intuitivi per la creazione di un sito web, tanto semplici da poter essere utilizzati anche se non sai cosa sia un page builder. Esatto: l’utilizzo di un page builder nella stesura e compilazione di un sito web è ormai la pratica più diffusa. Puoi però utilizzarlo anche se sei alle prime armi nella creazione del tuo blog, senza che sia necessario avere conoscenze di programmazione o progettazione web.
Letteralmente, un page builder è un “costruttore di pagine” web. Un plugin che si installa su un CMS e, tramite la funzione drag&drop, ossia trascina e rilascia, ne permette la massima personalizzazione.
Oggi, come spesso ripetuto, il CMS più noto e utilizzato nel mondo è WordPress. Flessibile, gratuito, variegato e utile sia per aprire il proprio blog che per progetti più complessi come gli e-commerce, WordPress ha permesso davvero a tutti di avvicinarsi attivamente al mondo del web e guadagnare online. Accanto WordPress, si trova spesso citato Elementor, page builder per eccellenza, così completo e intuitivo da permettere di dimenticare completamente il codice sorgente e di operare con semplicità: addirittura, definirlo un semplice page builder può essere riduttivo, in quanto le sue funzionalità permettono un utilizzo del sistema davvero ampio.
Con questa guida, potrai installare e personalizzare Elementor sul tuo sito WordPress, customizzando i template e il theme builder, anche nella versione free. Ti consiglio anche dei temi interessanti adatti a ogni progetto e come installare popup e plugin per la SEO. In questo modo, il tuo sito sarà sin da subito funzionale e completo, dall’impatto estetico armonioso e professionale. Sarà anche più facile posizionarlo sui motori di ricerca anche se non sei un professionista dello sviluppo web e della SEO.
Le versioni di Elementor WordPress
Elementor WordPress è disponibile nelle versioni free e pro (a sua volta prevista con vari tipi di abbonamento annuale). La versione gratuita ti permette di lavorare senza problemi e garantisce la progettazione e la stesura completa di un sito web. Non ha limitazioni e permette di raggiungere un ottimo livello qualitativo, sia estetico che funzionale. Le versioni pro, invece, arricchiscono l’offerta con dei widget e dei template aggiuntivi e ti consentiranno di operare a un livello superiore.
Se vuoi aprire il tuo primo blog per imparare i primi rudimenti, la versione gratuita di Elementor in italiano fa perfettamente al tuo caso; se, invece, vuoi gestire più siti e variegarli fra essi, le diverse opzioni della versione pro faranno meglio al tuo caso. Lo stesso discorso vale nel caso in cui tu voglia gestire progetti online per dei clienti.
Alcune delle opzioni aggiuntive previste dalla versione pro riguardano la presenza di widget utili per le sezioni di vendita. Le più note sono il conto alla rovescia per le promozioni, la slide delle recensioni, il modulo di contatto per i potenziali acquirenti.
Il passaggio dalla versione free ad uno qualunque degli abbonamenti pro è possibile in qualsiasi momento e questo permette un accesso graduale alla piattaforma senza avere limiti temporali. Si vanno così eliminare i periodi di prova proposti in molti casi dagli altri page builder sul mercato.
Quindi ti invito prima di tutto ad iniziare dalla versione gratuita di Elementor. La trovi a questo link:
Una volta effettuato l’accesso, fai click su “Try the free version” (prova la versione gratuita), come mostrato in questa immagine:
Dopo aver creato il tuo account, potrai scaricare gratuitamente Elementor e installarlo sul tuo blog WordPress.
Installazione e primo accesso
Per iniziare a utilizzare Elementor è necessario installare il plugin nell’editor di WordPress.
Il processo è il solito, come per qualsiasi altro plugin:
- Fai click su plugin
- Aggiungi nuovo
- Carica plugin
- Seleziona il plugin dal tuo computer (quello scaricato poso fa)
- Fai click su “installa”
Elementor gratis installato!
Una volta installato, nella sezione di creazione delle pagine, clicca su “Modifica con Elementor”.
In questo modo avrai accesso all’interfaccia vera e propria di modifica e di creazione della pagina.
Elementor si può usare con qualsiasi tema WordPress (per le modifiche) e i suoi modelli possono essere sempre importati. Sul lato sinistro della pagina si troveranno gli elementi inseribili tramite drag and drop
e sulla destra una prima anteprima del risultato finale. Il comando avviato col simbolo “+”
permette di definire il layout desiderato, andando a scegliere il numero di colonne, blocchi e elemeni che si potranno utilizzare.
Elementor non pone limiti al numero di blocchi e di colonne: è possibile impostarne secondo le proprie necessità grafiche. Attraverso la sezione in anteprima, potrai vedere in preview il risultato estetico, senza la necessità di andare online con il sito.
Gli elementi presenti sul lato sinistro possono essere modificati e trascinati secondo le proprie necessità. Puoi aggiungere caselle di testo, immagini, mappe, listini… tutto trascinando semplicemente il widget desiderato dalla colonna di sinistra verso la posizione prescelta nella pagina.
I Template Elementor
Uno dei motivi per cui Elementor è presto salito alla ribalta del mondo WordPress, è la sua ampia sezione di template disponibili. I template possono essere considerate le vesti grafiche complessive che avrà il sito. L’unione di tutti i blocchi, colonne, immagini e widget che si saranno impostati, assieme a titolo e intestazione del blog, menù e tasti.
La scelta del tema è molto importante e va fatta secondo i propri gusti e tenendo conto del messaggio che il sito deve dare dal primo accesso. Non useresti mai un tema rosa shocking con delle gif di fuochi d’artificio per il sito di uno studio medico, ma potresti usarlo per un blog rivolto a creativi o bambini. Esistono molte regole di neuromarketing e user experience che suggeriscono le scelte grafiche, ma spesso anche il semplice buon senso aiuta. Il segreto è chiedersi: se io entrassi in questo sito per la prima volta, lo riterrei professionale e autorevole, già dal primo impatto?
I template di Elementor si adattano sia a intere pagine che a singoli elementi. In questo modo li si può gestire a piacere anche partendo da modelli preconfigurati. Clicca sull’icona della cartella da customizzare per accedere alla libreria dei template e scegli il modello che più si addice ai tuoi gusti o al progetto finale.
Alcuni template presentano l’etichetta “Pro”: come intuirai, in questi casi si tratta di elementi e modelli disponibili solamente nella versione a pagamento.
L’applicazione del template scelto è molto intuitiva: basta cliccare sul pulsante “Inserisci” ed aggiungere il modello scelto.
Una volta caricato il template, potrai visualizzare tutte le impostazioni rilevanti nella colonna sulla sinistra. Ogni volta che crei una sezione, hai la possibilità di crearne un’ulteriore (cliccando sul tasto “+” con il mouse), spostarla (tasto con “…”) o eliminarla (tasto “X”).
Dopo aver provato a creare template con Elementor, sarà sempre possibile aggiungere elementi nuovi alla pagina, sempre trascinando i modelli interessati nella sezione centrale.
Il theme builder
La caratteristica più importante di Elementor è sicuramente il poter creare un preciso tema WordPress senza aver conoscenze specifiche di programmazione. Lo strumento Theme Builder, disponibile solamente nella versione a pagamento, permette, infatti, di creare pagine specifiche -come l’Error 404 o una search results- e di impostare elementi come l’header o il footer, in modo altamente personalizzabile. Il tutto senza intervenire sul codice sorgente del sito.
Per utilizzare il theme builder è necessario entrare nella sezione “Template” e poi selezionare “Theme Builder”. Da qui, avrai l’accesso alle varie schede personalizzabili.
Per esempio, per creare un header personalizzato, seleziona la voce “Aggiungi nuovo header”, rinominala e scegli fra i template disponibili. Una volta inserito, lo si potrà personalizzare a piacimento, andando per esempio a modificare i colori e le dimensioni. Si può anche decidere su quali pagine visualizzare il nuovo header appena creato, cliccando sul tasto “Pubblica”. Questa stessa procedura è applicabile nella stessa modalità anche per tutti gli altri elementi del template, che essi siano il footer o le singole pagine.
I temi disponibili e utilizzabili sono numerosi; per ottenere ottime prestazioni consiglio di utilizzare i temi suggeriti dagli sviluppatori di Elementor. Eccone alcuni ottimizzati presenti sia nella versione free che in quella pro:
- Hello Elementor: estensione principe di Elementor, tanto da essere usata dagli sviluppatori come test per le nuove relise, per l’importazione o per la creazione da zero. È un tema che come caratteristica principale ha la velocità di caricamento, il che è indicato per la creazione e il lancio di landing page.
- Layers: è il tema ideale per quanto riguarda la connessione con altri tool di marketing. È uno dei preferiti da chi lavora con gli e-commerce in quanto aiuta a migliorare il traffico.
- OceanWP: il punto di forza di questo tema è la grande varietà di layout. È presente anche in versione a pagamento, utile per gestire fino a 25 siti.
- Astra theme: questo tema si integra perfettamente con Elementor e con molti altri plug-in, permette un’ottima velocità di caricamento della pagina ed è ottimizzato per i motori di ricerca.
- GeneratePress: tema leggerissimo e di facile caricamento, offre una versione free e una a pagamento nella quale sono inclusi tutti i moduli aggiuntivi, come l’accesso alla libreria di template già predisposti per il sito che si vorrà creare.
Come creare popup con Elementor Pro
Un’altra funzione molto interessante di Elementor Pro è la possibilità di creare e inserire popup.
Anche in questo caso, si accede alla sezione “Template” e successivamente a “Popup”. Andando a cliccare sulla voce di aggiunta,
si seleziona il popup preferito e lo si può personalizzare nel contenuto e nella grafica. Il procedimento di inserimento è identico a quello utilizzato per qualsiasi elemento del theme builder, ma una volta cliccato il tasto “Pubblica” si avranno delle nuove opzioni disponibili.
Si può, infatti, scegliere dove mostrare il popup creato con l’opzione “Conditions”, oppure si può selezionare “Trigger”, cioè l’operazione di avvio del popup. In questo caso puoi definire variabili come la comparsa al caricamento della pagina, al clic su un singolo elemento, allo scroll della pagina stessa, oppure all’uscita. Addirittura, nella sezione “Advanced Rules” puoi impostare regole avanzate come la visualizzazione del popup per un determinato lasso temporale, oppure la comparsa solamente dopo una visualizzazione di un certo numero di pagine.
La gestione SEO con Elementor WordPress
Elementor implementa e gestisce perfettamente i maggiori plugin per la SEO presenti sul mercato come Yoast SEO e Rank Math. Ho già parlato dei vantaggi lato SEO nel loro utilizzo e ora approfondirò come affiancarli ad Elementor.
Se si utilizza Rank Math, nella colonna di sinistra sarà presente la voce “SEO”;
inserendo la keyword principale, verrà analizzato automaticamente tutto il testo e nella sezione “Preview” avremo l’anteprima dello snippet. Sfruttando il pulsante “Edit snippet”, potrai modificare il title, la meta tag description e il permalink della pagina.
Nota intreressante di Rank Math è che implementa anche una sezione Social dedicata.
Se invece il plugin utilizzato è Yoast SEO, seleziona l’icona con tre righe. Entra nel menù apposito e, cliccando su Yoast SEO, inserisci la frase o le parole chiave di interesse e consulta i suggerimenti forniti dal plugin. Questi serviranno per modificare e di migliorare i contenuti del testo con un’attenzione ai motori di ricerca. Anche in questo caso, la sezione “Anteprima” consentirà di modificare title, description e slug, sia per siti standard che per i social.
Il page builder Elementor in italiano può rendere il lavoro online semplice e altamente personalizzato. Non ti occorrerà studiare programmazione o web design per avere un sito funzionante e accattivante. La tentazione iniziale è quella di installare molti plugin, ma attenzione! Troppi plugin potrebbero appesantire di molto l’intero sito, che si caricherà con lentezza, portando l’utente ad abbandonare la pagina. Una serie di test e l’attenzione al tuo progetto aiuteranno a correggere questi errori e a rendere il sito snello e veloce, che poi è anche il motivo per cui Elementor ha avuto così tanto successo. E poi, non dimenticare: un sito non deve essere solo completo di belle sezioni e popup. Un sito di successo deve comunicare informazioni corrette e utili per il lettore, oltre che essere una vetrina valida per il tuo brand.
Che si tratti di un blog per raccontare una passione, un sito vetrina per un libero professionista o un piccolo e-commerce, Elementor è lo strumento che più ti aiuterà nello sviluppo e nella crescita del tuo progetto online.
Se vuoi delle informazioni in più sulla creazione di un business online, tra cui una video guida ad Elementor, puoi accedere gratuitamente al mio Start Kit:
START KIT – Metti insieme i pezzi!
Come iniziare a guadagnare online seriamente in 3 giorni, senza trucchi bizzarri né segreti deliranti.
2 risposte
Ciao Alessandro ho trovato questa giuda molto utile, per me che si queste cose non ne capisco una cippa, infatti quest’anno devo fare il sito per la mia attività, spero di riuscirci, grazie mille.
Ce la farai.