Come creare un footer con Elementor? Tutorial in italiano

In questo articolo scopriamo come creare un footer con Elementor, un nuovo tutorial in italiano di tornatutto.

Autore

Alessio Realini

Data

Tutorial

Di cosa parliamo in questo articolo

In questo articolo scopriamo come creare un footer con Elementor, un nuovo tutorial in italiano di tornatutto. Con questa semplice guida passo passo riuscirai a realizzare il piè di pagina del tuo sito in maniera veloce, professionale e responsive per tutti i dispositivi. Tutto questo utilizzando Elementor PRO, il page builder WordPress più utilizzato ad oggi sul mercato.

Se vuoi saperne di più sui prezzi di Elementor PRO, quali sono i piani e cosa consigliamo, ti suggeriamo di leggere questo articolo che abbiamo già pubblicato. In alternativa abbiamo scritto anche quali sono 5 esempi per capire cosa è possibile fare con questo page builder WordPress. Di recente abbiamo anche condiviso un altro tutorial che spiega come installare e attivare le versioni free e PRO di Elementor sul proprio sito e una guida passo passo che ti insegna a creare il tuo primo header con Elementor.

Ad ogni modo, partiamo con questa guida su come creare un footer con Elementor. Vedrai che è molto semplice e ti garantirà un risultato eccellente. Ti ricordiamo che puoi acquistare la licenza di Elementor PRO tramite il nostro link affiliato che ci garantirà un piccolo contributo a sostegno del progetto tornatutto!

Come creare un footer con Elementor: che cos’è un footer?

Prima di scoprire come creare questo elemento nel nostro sito, una piccola parentesti per chi si sta affacciando al mondo del web design. Infatti, per tanti che leggeranno questo articolo, la parola “footer” potrà risultare nuova.

Il primo aspetto più importante è capire che il footer è un template, un modello insomma che viene visualizzato solitamente in una o più parti del nostro sito web. In italiano “footer” andrebbe tradotto in piè di pagina del sito, quella sezione che vediamo sempre comparire in basso e che può presentare, tra gli altri, i seguenti elementi: logo, breve descrizione dell’attività, icone con link ai social, menù rapidi di navigazione, iscrizione alla newsletter, riferimenti legali, partita IVA e link alle privacy/cookie policy.

Il Theme Builder di Elementor PRO. L’area dove puoi gestire, creare ed eliminare tutti i tuoi template

Quindi, ricapitolando, il footer in un sito è un template che appare in basso e solitamente serve a contenere alcuni elementi molto importanti per una corretta navigazione del sito da parte degli utenti.

Meglio usare il tema Hello o il plugin Elementor PRO?

Altra piccola parentesti. Nella maggior parte dei casi, i temi WordPress offrono la possibilità di creare header e footer senza doversi appoggiare a Elementor PRO. Con la licenza PRO di questo page builder, però, ti consigliamo di installare un tema snello con poche funzionalità come Hello Elementor, il tema ufficiale sviluppato sempre da Elementor. Così avrai la possibilità di utilizzare tutti gli strumenti che Elementor PRO ti mette a disposizione senza dover appesantire il tuo sito con un tema “classico”.

Per rispondere alla domanda, quindi, ti suggeriamo di usare il plugin Elementor PRO per creare tutti i template del tuo sito, incluso il footer.

Come creare un footer con Elementor: la guida

Ora che abbiamo capito cos’è un footer, possiamo proseguire e scoprire come realizzarne uno nel nostro sito con Elementor PRO. Proseguendo in questo tutorial in italiano, diamo per scontato che tu abbia già acquistato la licenza di Elementor PRO e che l’abbia installato e correttamente attivato nel tuo sito. Se non l’hai fatto, puoi seguire quest’altro tutorial che abbiamo già pubblicato.

In questa sezione puoi creare un nuovo template con Elementor PRO

Di seguito la lista di azioni per creare un nuovo footer:

  • Dalla dashboard, clicca su “Template”;
  • Una volta su Template, clicca su “Template salvati”;
  • Da qui, clicca sul pulsante in alto “Add new template”;
  • Si aprirà un popup di Elementor, seleziona “Piè di pagina” dal menù a discesa;
  • Dai un nome parlante al tuo template: ad esempio “Main Footer”;
  • Alla fine clicca sul pulsante “Crea template”.
Il popup che ti appare quando clicchi su “Add new template” nella pagina “Template salvati”

Dopo aver cliccato su “Crea template” ti si aprirà l’editor di Elementor con un popup aperto di default, la libreria di Elementor dalla quale puoi scegliere un footer già pronto. Sono i kit di Elementor PRO che possono tornare utili a velocizzare la realizzazione di questi template o di intere sezioni del nostro sito.

La libreria di Elementor dove scegliere template già pronti realizzati dal team di Elementor. A destra in alto la X che chiude il popup per continuare in autonomia.

Proseguiamo con la guida passo passo:

  • Chiudi la libreria di Elementor cliccando sulla X che trovi in alto a destra (come indicato nell’immagine qui in alto);
  • Clicca sul + che vedi nell’editor, seleziona il layout “Flexbox” e scegli la struttura con la freccia che punta a destra (“Direzione riga”);
Il contenitore Flexbox a due colonne che devi selezionare
  • Clicca sul + all’interno del contenitore che è stato aggiunto automaticamente da Elementor o sul + che trovi in alto a sinistra;
  • Inserisci gli elementi/widget “Logo Sito” e “Editor di testo” nella colonna di sinistra e “Intestazione” e “WordPress Menu” nella colonna di destra. Dovresti essere a questo punto come indicato nell’immagine in basso;
La situazione dopo aver inserito i quattro widget nel contenitore Flexbox a due colonne

Ora puoi stilizzare graficamente i tuoi widget come meglio credi. Nel mio caso ho allineato il logo a sinistra, modificato il titolo in “Link veloci” e aggiustato il menù con un layout verticale senza indicatore e senza punti di interruzione.

Già che c’ero ho inserito anche un secondo contenitore subito sotto dove ho aggiunto il widget “Icone social” e dove potresti anche inserire i link per privacy e cookie policy o altre informazioni legali come la sede legale o la partita IVA della tua azienda/attività.

Il risultato finale
  • ora clicca sul pulsante in alto a destra (o in basso se non hai attivato il nuovo editor) di colore fucsia “Pubblica”;
  • si aprirà un popup che ti chiede dove vuoi visualizzare il template. Clicca su “Aggiungi condizione”;
  • In automatico Elementor include tutto il sito, non devi fare nulla se vuoi visualizzare questo footer in tutto il sito per l’appunto;
  • per concludere clicca sul pulsante in basso a destra del popup “Salva & chiudi” come indicato nell’immagine in basso.
L’ultimo step: le condizioni di visualizzazione di questo template footer

Ora puoi chiudere l’editor di Elementor. Hai visto come creare un footer con Elementor nel tuo sito web. Ovviamente puoi crearne più di uno o puoi modificare questo layout andando ad aggiungere più widget e funzionalità. Molto dipende da cosa stai cercando e le finalità del tuo sito.

Questo tutorial in italiano su come creare un footer con Elementor PRO si conclude qui. Ti ricordiamo che se non l’hai ancora acquistato, puoi effettuare l’acquisto di una licenza di Elementor PRO usando il nostro link affiliato. Ci aiuterai a produrre nuovi contenuti e tutorial in italiano di qualità per questo e per altri page builder, plugin e temi WordPress.

Se stai cercando altri tutorial su Elementor, puoi leggere questo articolo che ti spiega come realizzare un header con Elementor o quest’altro post dove spieghiamo passo passo come installare e attivare la tua licenza Elementor PRO nel tuo sito web.

Alessio Realini

Fondatore di tornatutto.it e web designer WordPress freelance dal 2021. Mi occupo di ideare e realizzare siti web, contenuti SEO per i miei clienti o per agenzie di comunicazione. Dal 2023 mi occupo di formazione con corsi online per piattaforme e realtà nel campo digital.

Lascia il primo commento