Cos’è e Come Creare un Template Elementor

Questo articolo ti guida passo-passo alla creazione di template Elementor per tutte le aree del sito, header, footer , articoli e archivi articoli, prodotti e archivi prodotti con WooCommerce. L’obiettivo è darti un metodo chiaro e riutilizzabile, così puoi impostare un sistema coerente e facile da mantenere.

Se vuoi supporto operativo, dai un’occhiata ai nostri piani web o alla nostra assistenza WordPress. Per informazioni ufficiali sul plugin visita il sito Elementor e, se ti serve, scopri come contattare l’assistenza di Elementor.

Che cos’è un template Elementor

Un template è un modello riutilizzabile che definisce struttura e stile di una porzione del sito (es. Header, Footer, Single Post, Archive, Single Product, Product Archive, Search Results, 404). Con il Theme Builder assegni condizioni di visualizzazione per decidere dove si applica ciascun template.

• Vantaggi principali? Coerenza grafica, velocità di aggiornamento, riuso tra pagine e progetti;
• Dove si crea? WordPress → Template → Theme Builder.

Theme Builder è una funzione tipicamente di Elementor Pro. Puoi approfondire sul sito ufficiale di Elementor.

Cosa serve

Per lavorare in modo stabile conviene preparare un ambiente pulito e aggiornato, con un tema leggero e, se necessario, plugin per contenuti.

• WordPress aggiornato e hosting affidabile con HTTPS;
• Elementor (Pro consigliato per Theme Builder, Loop e condizioni);
• Tema leggero (es. Hello) e, se ti servono campi personalizzati, ACF e/o Custom Post Type.

Come creare un template

Il processo è sempre lo stesso, entri nel Theme Builder, scegli il tipo di template, progetti il layout, imposti le condizioni e pubblichi. Questo rende il lavoro ripetibile e scalabile, ideale se gestisci più siti o cataloghi numerosi.

• Vai su Template → Theme Builder;
• Clicca Add New e seleziona Header, Footer, Single, Archive, Single Product, Product Archive, etc;
• Struttura il template con i widget di Elementor (container, griglie, testo, immagini, pulsanti);
• Imposta Include/Exclude e, se necessario, più condizioni specifiche.

Template base del sito

Impostare Header e Footer per primi ti dà subito coerenza visiva e punti di navigazione chiari su tutte le pagine. Sono la struttura portante dell’esperienza utente.

• L’obiettivo della header è orientare l’utente e facilitare l’accesso ai contenuti chiave.
• L’obiettivo del footer è fornire scorciatoie utili, informazioni legali e contatti.

Header

L’Header è quella parte in alto del sito che ospita brand, navigazione e funzioni rapide come ad esempio un mini carrello. Può essere sticky o trasparente sopra un’hero section e avere una variante dedicata per mobile.

• Crea con Add New → Header;
• Elementi tipici sono logo, menu, search, CTA (es. “Contattaci”);
• Scegli le opzioni come Sticky, trasparente in homepage, menu mobile off-canvas;
• Imposta le condizioni, Include → Entire Site la mostrerà in tutto il sito.

Footer

Il Footer raccoglie link secondari, contatti e legal. È il posto giusto per dare all’utente vie d’uscita ordinate e sempre disponibili.

• Crea con Add New → Footer;
• Elementi tipici sono menu secondario, privacy/cookie, social, copyright;
• Aggiungi funzioni fascia “utility” con link rapidi (assistenza, login, stato ordini);
• Imposta le condizioni, Include → Entire Site lo mostrerà in tutto il sito.

Template Articolo (Single Post)

Il Single Post definisce l’esperienza di lettura, struttura del contenuto, metadati e moduli di navigazione interni. Con le Dynamic Tags colleghi i campi del post senza cambiare layout ogni volta.

• Crea con Add New → Single → Post;
• La struttura consigliata è Titolo (H1), Featured Image, meta (Autore, Data), Breadcrumb, Contenuto, Articoli correlati;
• Extra utili sono Indice interno (ancore H2/H3), box autore riutilizzabile, callout per note
• Imposta le condizioni, applica a tutti i post o a specifiche categorie (es. “Guide”, “News”).

Template Archivio Articoli (Blog, Categorie, Tag)

Il template Archive per gli articoli organizza l’accesso ai contenuti del blog e migliora la scopribilità. Il cuore è un Loop/Grid con card pulite e coerenti.

• Crea con Add New → Archive;
• Pensa la struttura Titolo archivio dinamico (es. “Categoria: {{ term_name }}”), descrizione tassonomia, Loop/Grid di carte, paginazione o Load More;
• Con Loop Grid, struttura una card unica (immagine in evidenza, titolo dinamico, estratto, meta) e richiamala con Query per tassonomia corrente, autore, sticky post, etc;
• Migliorie: filtri per categorie/tag, ordinamenti (più recenti, più letti), hero dedicato per le categorie principali.

WooCommerce, template prodotti e archivi

Con WooCommerce lavorerai sia sulle schede Single Product sia sugli archivi prodotti (shop, categorie e tag). Chiarezza e coerenza sono fondamentali per far comprendere rapidamente valore e varianti.

• L’obiettivo del template per Single Product è informare e far scegliere con facilità.
• L’obiettivo del template per Product Archive è far filtrare e confrontare velocemente.

Template Prodotto (Single Product)

La scheda prodotto è quella pagina che unisce galleria, informazioni chiave e call to action. Con Dynamic Tags puoi mostrare badge e messaggi in base allo stato del prodotto.

• Crea con Add New → Single → Product;
• Blocchi fondamentali sono Galleria immagini, Titolo (H1), Prezzo, Valutazioni, Breve descrizione, Aggiungi al carrello, Meta (SKU, categorie), Tab (descrizione, recensioni, correlati);
• Alcune migliorie possono essere badge condizionali (In offerta/Novità), box benefici (spedizione, resi, garanzia) vicino al pulsante, sticky add to cart su mobile;
• Definisci stili globali per tipografia, colori e bottoni.

Template Archivio Prodotti (Shop, Categorie, Tag prodotto)

L’archivio prodotti deve permettere selezione e confronto rapidi, evitando rumore visivo. Una griglia pulita e filtri chiari fanno la differenza.

• Crea con Add New → Archive → Product Archive;
• Pensa ad un layout, Titolo e descrizione categoria (dinamici), barra filtri (prezzo, attributi, disponibilità), griglia prodotti con Loop personalizzato, paginazione o Load More;
• Query/ordinamenti per popolarità, novità, prezzo, valutazione; sezioni dedicate “In sconto”, “Novità”, “Best seller”;
• Dettagli UX, breadcrumb nello shop, badge (Nuovo/Promo), anteprima rapida se adatta al tuo catalogo.

Condizioni di visualizzazione e priorità

Le condizioni stabiliscono dove compare ogni template. La specificità della condizione decide quale prevale quando più modelli coprono la stessa area.

• Include: intero sito, tipi di contenuto (Post, Page, Product), tassonomie specifiche, singole pagine;
• Exclude: landing, checkout, carrello, account o pagine con layout dedicato;
• Priorità: il template più specifico vince (es. “Single Post → Categoria Guide” supera “Single Post → Entire Site”);
• Suggerimento: nomina chiaramente i template (es. “Header – Globale”, “Archive – Blog Magazine”, “Single Product – Default”).

Responsive e usabilità

Un buon template funziona su tutti i dispositivi. Cura le gerarchie, le spaziature e la leggibilità, con particolare attenzione al menu e ai pulsanti in versione mobile.

• Imposta breakpoint (mobile/tablet/desktop);
• Preferisci unità relative (%, em, rem) e larghezze massime coerenti;
• Controlla menu mobile, dimensione dei bottoni, spazi tra card e titoli non troncati;
• Evita annidamenti eccessivi di widget; usa Container con Flex/Grid.

Libreria, riuso ed esportazione

La Libreria Elementor ti permette di salvare template e parti riutilizzabili, esportarli e importarli tra progetti, velocizzando lo sviluppo e mantenendo coerenza.

• Salva Template e Template Parts (Hero, Callout, box autore, FAQ prodotto);
• Esporta/Importa set di template per replicarli su altri siti;
• Crea varianti (es. due Single Product: “Default” e “Premium”) con condizioni diverse.

Errori comuni e soluzioni

Piccoli accorgimenti evitano la maggior parte dei problemi. Verifica sempre condizioni, cache e coerenza degli stili, soprattutto quando i cambi non “si vedono”.

• Se il template non si applica, rivedi Include/Exclude e controlla conflitti con modelli più specifici;
• Se gli stili non si aggiornano, svuota cache (hosting/plugin/browser) e rigenera CSS in Elementor → Strumenti;
• Se il layout da mobile è sballato, controlla breakpoint, padding/margini e dimensioni immagini nelle card;
• Se lo shop è disomogeneo, uniforma dimensioni media e definisci stili globali.

Curiosità e trucchi utili

Elementor diventa potentissimo quando lavori in modo modulare e condizionale. Costruisci una volta, riutilizza ovunque e attiva/disattiva in base al contesto.

• Loop Template + Query mirate: listing “Più letti”, “In evidenza”, “In sconto”;
• Condizioni temporanee, banner stagionali o promozioni limitate nel tempo/categoria;
• Blocchi modulari, “Hero”, “FAQ prodotto”, “Tabella comparativa” come Template Parts.

Domande frequenti

Le risposte rapide ai dubbi più comuni ti aiutano a scegliere le funzioni giuste senza perdere tempo fra impostazioni e prove.

Con Elementor puoi creare template per articoli, archivi articoli, prodotti, archivi prodotti, e non solo. Puoi anche impostare condizioni precise e mantenere il tutto in modo semplice grazie alla Libreria e ai Template Parts. Se vuoi accelerare la messa in produzione o desideri un controllo esperto, scopri i nostri piani web, prova la nostra assistenza WordPress o contattaci su seowp.it. Per dettagli ufficiali sul plugin, visita il sito di Elementor o leggi come contattare l’assistenza di Elementor.