Come creare un tema personalizzato con Elementor

Iscriviti…. resta sempre aggiornato sui nuovi articoli e scarica la guida gratuita “Elementor Semplice” 

Stanco del solito tema? Vuoi creare un template personalizzato? 

In questo articolo ti mostrerò come creare un tema personalizzato

Dopo aver letto questo articolo sarai in grado di personalizzare le pagine del tuo sito.

Sei pronto?

Partiamo!

Trovare un tema che sia in tutto e per tutto quello che stiamo cercando è quasi impossibile, per questo motivo i grandi brand assumono uno sviluppatore per la creazione di un tema personalizzato.

Anche se non sei un grande brand con Elementor puoi creare un tema personalizzato partendo da un tema WordPress.

Creiamo il tema personalizzato

Prima di passare alla costruzione della struttura ti consiglio di avere già pensato a quale struttura dovrà avere il tuo sito (per sito intendo anche un blog).

Ogni tipologia di sito ha una struttura diversa, per esempio un blog avrà una homepage, una pagina chi sonouna pagina articoli, i singoli post e una pagina contattami.

Per creare questo tema avrai bisogno di creare un tema personalizzato per la homepage, uno simile per le pagine articoli e chi siamo, uno simile per i post.

E’ necessario creare un tema per i post perchè devi inserire il widget che mostra l’articolo.

La costruzione di questo tema è molto più semplice di quanto possa sembrare infatti tutte le pagine avranno alcuni elementi comuni per esempio Header e Footer, poi a seconda del tipo di pagine inserirai i widget che ti servono.

Per creare un tema personalizzato come ti mostrerò in questo articolo è necessario avere Elementor Pro.

Scelta del tema

Per prima cosa devi scegliere un tema che abbia poche o nessuna personalizzazione e che sia veloce.

Questo perché andando a costruire il tema non ti serve nessuna personalizzazione del vecchio tema.

Io di solito quando costruisco un tema personalizzato utilizzo Hello Theme di Elementor.

Creazione del tema

Adesso che hai installato il tema da cui partire nel menu di WordPress scegli Template>Nuovo

Menu - Come creare un tema personalizzato con Elementor

Nella schermata che si apre scegli Singolo come tipo di Template e Tipo di post scegli Pagina come vedi nella nell’immagine qui sotto e poi inserisci il nome che vuoi

Nuovo template - Come creare un tema personalizzato con Elementor

Clicca su crea template

La prima cosa che si apre è la libreria Elementor che ti suggerisce di utilizzare delle strutture già pronte.

Libreria - Come creare un tema personalizzato con Elementor

Oppure puoi chiedere la libreria e creare la tua struttura personalizzata.

In questo articolo ti mostrerò questa seconda opzione.

Una volta chiusa la libreria avrai la tua pagina di Elementor

pagina - Come creare un tema personalizzato con Elementor

Nella colonna di sinistra noterai alcuni nuovi widget di Elementor, questi widget ti serviranno quando dovrai crea il tema per le pagine ma questo lo vedremo nel corso dell’articolo.

La prima cosa che creiamo è la Homepage.

Homepage

Innanzitutto creiamo un header come ti ho mostrato nell’articolo “Come creare un Header con Elementor

Per fare questo utilizzerai i widget che trovi nella sezione sito 

Widget - Come creare un tema personalizzato con Elementor

Ora che hai un Header puoi inserire i widget che ti servono all’interno della pagina, la scelta dei widget dipenderà da cosa vuoi mostrare nella Homepage.

Infatti potresti decidere che anche se stai costruendo un blog di mostrare solo un paio di articoli in homepage e utilizzare la pagina per mostrare le altre sezioni del sito tipo inserire una sezione di presentazione, uno dove presenti l’ebook che hai scritto etc.

Lo scopo di questo articolo è darti gli strumenti per costruire la tua struttura per questo motivo mi limiterò ad indicarti il come fare.

Infine devi creare il Footer 

Il footer non è altro che una sezione che possiamo creare come tutte le altre sezioni, Ele- mentor ti mette a disposizione dei template di footer che puoi utilizzare e modificare. 

Vediamo qualche trucco. 

Copyright 

Per inserire il copyright ti consiglio di utilizzare il “Widget Shortcode”, una volta inserito questo widget nella sezione clicca su dinamico nella colonna sinistra sopra al box dove inserire lo shortcode, nel menu che si apre scegli data corrente. 

Nella schermata che si apre imposta formato data “Personalizzato” e nel campo formato inserisci “Y” 

Footer - Come creare un tema personalizzato con Elementor

Poi clicca su avanzato, nel campo prima inserisci copyright © dai uno spazio dopo il sim- bolo, passa al campo dopo dai uno spazio e inserisci il nome del sito. 

Vedrai che la dicitura copyright avrà questo aspetto: 

Copyright © anno sito 

Con questo trucco avrai l’anno del copyright sempre aggiornato

Link privacy 

È possibile inserire un collegamento alla pagina privacy per fare ciò puoi utilizzare o il widget Intestazione oppure il Widget testo inserisci la parola privacy o quello che vuoi e poi inserisci il link nel campo link del widget scelto. 

Un altro modo è creare un menu solo con la voce privacy oppure con i link che vuoi inserire e poi inserire il widget menu nella sezione. 

Bene adesso la tua homepage dovrebbe essere pronta.

L’ultima cosa che devi fare è pubblicare la pagina, quando clicchi sul tasto pubblica si aprirà una schermata chiamata Impostazioni di pubblicazione.

In questa schermata devi scegliere dove applicare il tema che hai creato

Nell’esempio che abbiamo fatto il tema dovrà essere applicato solo alla Homepage

Per farlo devi cliccare su “Aggiungi condizione” e selezionare Pagina principale come mostrato nell’immagine

Impostazioni pubblicazione - Come creare un tema personalizzato con Elementor

Ora che hai creato la homepage devi creare il tema per le altre pagine

Tema Pagine

Se l’Header e il Footer che hai creato per la Homepage saranno uguali anche per le altre pagine puoi velocizzare la creazione del tema cliccando coni il tasto destro della sezione che contiene l’Header e nel menu che si apre scegli salva come template.

La stessa cosa va fatta per la sezione che contiene il Footer.

Bene per creare il tema per le pagine devi ripetere lo stesso procedimento fatto per la homepage

Solo che questa volta ti limiterai a creare o ad inserire l’header e il footer creato in precedenza.

Vediamo come fare

Innanzitutto devi andare un’altra volta in Template>Nuovo

Nella schermata nel campo Seleziona il Tipo di Template scegli sempre singolo Singolo  e Tipo di post scegli Pagina

Una vota inserito un nome clicca su “crea Template” come abbiamo già visto.

Anche stavolta Elementor ti proporrà delle strutture già create

Chiudi la finestra e vai avanti 

La prima cosa che devi fare adesso è eliminare l’header di default del tema

Per farlo vai sempre in basso a sinistra e clicca su impostazioni e scegli come layout Elementor Canvas.

Per inserire l’header che hai già creato puoi utilizzare il widget Template e poi richiamare dal menu il tuo header

Template - Come creare un tema personalizzato con Elementor

Se non hai creato un Header in precedenza o non vuoi usare quello della homepage crea il nuovo Header.

E’ arrivato il momento di utilizzare i nuovi Widget che sono apparsi nella colonna di sinistra

Widget - Come creare un tema personalizzato con Elementor

Se vuoi che nelle tue pagine appaia il titolo devi utilizzare il Widget Titolo post

Per far apparire il contenuto delle pagine che inserisci con l’editor di WordPress non devi creare una pagina con Elementor ma devi utilizzare il Widget Contenuto Post

In questo modo anche i contenuti che hai già inserito nelle pagine appariranno con il nuovo tema.

La creazione del tema è personale per cui io posso solo dirti quali sono i widget da utilizzare per la costruzione delle pagine

  • Titolo Post
  • Contenuto Post
  • Immagine in evidenza (opzionale)

Ora che hai gli strumenti tocca a te combinarli in modo da creare il tema che più piace.

Infine devi inserire il Footer e la procedura è la stessa che hai usato per l’Header attraverso l’utilizzo del widget Template oppure la creazione ex-novo come ti ho mostrato in questo articolo.

Ora che hai creato la struttura devi solo applicarla alle pagine

Farlo come abbiamo visto è molto semplice

Clicca su pubblica

Nella schermata di Impostazione di Pubblicazione clicca sempre su aggiungi condizione e inserisci tutte le pagine come mostrato nell‘immagine

Visualizzazione - Come creare un tema personalizzato con Elementor

Se vuoi puoi anche escludere delle pagine cliccando sempre si aggiungi condizione ma modificando il primo campo in escludi e selezionando le pagine che vuoi escludere.

Ora il tema si applicherà a tutte le pagine del sito.

Blog 

Per personalizzare la pagina dei singoli articoli puoi utilizzare tutti i Widget del menu singolo

Naturalmente dovrai creare un nuovo template inserire i widget e nelle condizioni di visualizzazione dovrai scegliere articoli tutti gli articoli 

Conclusioni

In questo articolo abbiamo visto come creare un tema personalizzato per il tuo sito.

Per farlo abbiamo suddiviso la struttura del tema in 3 temi da creare e applicare rispettivamente:

  • alla Homepage
  • alle pagine
  • agli articoli

Creare un tema personalizzato per il proprio brand è uno dei fattori di successo perché aumenta la riconoscibilità.

Bene spero che questo articolo ti sia piaciuto, se hai domande o dubbi puoi scriverli nei commenti.

A presto

Ho un favore da chiederti, se questo articolo ti è piaciuto, condividilo.
Elementor la guida definitiva

Ti è piaciuto questo articolo?

Scopri l’eBook che ho scritto su Elementor.

Sei vuoi imparare ad utilizzare Elementor questo è l’eBook che fa per te!

Potrebbe anche piacerti

Elementor la guida completa

Ultimi articoli

Categorie
Passa a Elementor Pro
Per il tuo hosting
Per creare la tua Privacy Policy
Copyright © 2020 WP Semplice - Privacy Policy

Inizia col piede giusto
Iscriviti alla newsletter

In regalo per te la Guida Gratuita per scoprire come funziona Elementor!

guida elementor

Gli articoli ti sono stati utili?

Iscriviti alla newsletter per restare sempre aggiornato! 

Grazie ti contatteremo a breve