Il tuo partner dedicato per tutto ciò che riguarda WordPress

Come creare un modello di prodotto su Elementor

Sommario

Il modello di prodotto Elementor è la cosa migliore che puoi aggiungere al tuo sito e-commerce. Puoi iniziare facilmente con il sito Web di e-commerce installando WooCommerce. Tuttavia, la pagina del prodotto in WooCommerce offre pochissime funzionalità. Inoltre, l'aspetto è lo stesso, il che lo rende un po' noioso. Pertanto, puoi scegliere l'alternativa e utilizzare un modello di prodotto Elementor. Questa guida tratterà il modo esatto per creare il miglior modello di prodotto Elementor che puoi utilizzare per tutti i prodotti.

Cominciamo con la panoramica e poi vedremo i passaggi per farlo.

 

Panoramica del modello di prodotto Elementor

Il modello di prodotto Elementor è il modello che ti consente di modificare la pagina del prodotto e aggiungere nuovi elementi alla pagina. Qui non vedremo come creare una pagina di prodotto individuale, nota anche come pagina di destinazione delle vendite. Vedremo invece come creare un modello di prodotto Elementor utilizzabile per ogni singolo prodotto.

Pertanto, la prossima volta che pubblichi un prodotto, considera automaticamente il nuovo modello. Ogni volta che l'utente visita la pagina del prodotto, vedrà una nuova pagina del prodotto con il nuovo modello. Pertanto, puoi sicuramente utilizzare questa tecnica qui.

Ti consente di creare un modello di prodotto Elementor completo.

La cosa principale che devi tenere a mente qui è il nome degli elementi. Molti elementi possono essere aggiunti alla pagina del prodotto. Se sai quali sono gli elementi che devi aggiungere e ne conosci il nome, sei a metà strada. Quindi, quando stai leggendo questa guida. Assicurati di ricordare il nome.

Inoltre, avrai bisogno Elementor pro se desideri creare un modello di prodotto Elementor. Non è possibile farlo dalla versione gratuita di Elementor. Quindi, se hai intenzione di creare un modello, puoi eseguire subito l'aggiornamento alla versione pro.

Successivamente, possiamo avviare direttamente la guida e vedere come creare un modello completo.

 

Preparare le cose

La prima cosa che devi fare è la preparazione prima di iniziare i passaggi. Qui faremo solo i preparativi di base.

Quindi, per cominciare, devi installare il plugin Elementor e WooCommerce. È inoltre necessario installare la versione Pro di Elementor. Ti darà un nuovo plugin che è il plugin Elementor pro che puoi installare.

Dopo averlo installato e attivato, puoi iniziare la guida.

 

Crea un modello vuoto

Andremo prima su Elementor e poi faremo clic sul generatore di temi. Il generatore di temi ti consentirà di creare una pagina per il modello.

Quando fai clic su di esso, ti verrà chiesto quale tipo di modello di prodotto Elementor desideri creare. È necessario selezionare "Singolo prodotto" Qui.

In alcune versioni precedenti, dovrai fare la stessa cosa andando su Modelli e quindi creare da lì il nuovo modello di prodotto singolo. In ogni caso, i passaggi sono quasi simili.

Quando sei lì, devi selezionare il layout Elementor che desideri. Il layout predefinito è quello consigliato e funzionerà nella maggior parte dei casi. Quindi, puoi mantenere il layout predefinito e poi passare alla parte successiva.

Inizieremo ora a creare una pagina di prodotto completa e vedremo quali sono le cose che devi aggiungere.

Modello di prodotto Elementor

Carrello menu

La maggior parte delle persone dimenticherà questa cosa. Se lo hai già nel tema, non devi preoccuparti.

Tuttavia, se non lo hai nel tema o ne hai creati tanti da solo utilizzando Elementor, devi aggiungere il carrello del menu.

Ci sarà un widget per lo stesso. verrà visualizzata l'icona del carrello nel menu. Gli utenti possono vedere gli articoli del carrello da qui.

 

Briciole di pane

Una volta fatto questo, la prima cosa che gli utenti vedono sono i breadcrumb. Questa non è altro che la posizione del prodotto.

Negozio > Scarpe > Scarpe casual > Model123

Ecco come appaiono le briciole di pane. Quindi, puoi aggiungere il breadcrumb anche sulla pagina web. Una volta aggiunto, puoi procedere alle informazioni effettive sul prodotto.

Divideremo la sezione prodotti in due parti. Il primo è quello che le persone solitamente cercano, come una breve descrizione, prezzo, valutazioni, ecc. La metà successiva coprirà più dettagli come l'elenco esatto di funzionalità, recensioni, ecc. La maggior parte delle persone guarderà solo la prima metà e prendere la decisione. Quindi, è necessario prestare la dovuta attenzione alla prima metà del prodotto.

Successivamente, puoi realizzare anche la seconda metà del modello di prodotto Elementor.

Modello prodotto Elementor Prima metà

Il primo modello di prodotto Elementor coprirà gli aspetti più importanti.

Innanzitutto, devi aggiungere il titolo del prodotto. Puoi aggiungerlo a tutta larghezza oppure quello preferito sarà nella colonna di destra dove quella di sinistra è l'immagine del prodotto.

Qui creeremo una sezione con due colonne.

Nella prima colonna abbiamo solo le immagini dei prodotti. Successivamente, nella colonna di destra, abbiamo una serie di informazioni sul prodotto che vedremo qui.

Puoi aggiungere il titolo come abbiamo menzionato il rivenditore. Sotto il titolo puoi avere la valutazione del prodotto. Ciò convincerà gli utenti ad acquistare il prodotto. Se c'è una valutazione mostrata direttamente lì, è più probabile che gli utenti acquistino da te. Quindi, puoi aggiungere le valutazioni lì.

Successivamente, puoi aggiungere il prezzo in basso. Puoi anche aggiungere lì la breve descrizione e quindi aggiungere il pulsante Aggiungi al carrello.

Ecco come appare la maggior parte delle pagine dei prodotti. Puoi sicuramente aggiungere il numero di quantità rimaste in fondo. Ciò innescherà la scarsità.

Ecco l'elenco delle cose che devi aggiungere qui. Inoltre, questi sono gli stessi nomi che puoi trovare nel widget. Quindi, puoi cercare i seguenti widget e quindi aggiungerli.

  • Immagini del prodotto
  • Titolo del prodotto
  • Prezzo
  • Valutazioni del prodotto
  • Breve descrizione
  • Pulsante Aggiungi al carrello
  • Stock di prodotti
  • Meta descrizione (SKU e altro)

Prodotto Seconda Metà

Dopo aver aggiunto tutte le cose sopra indicate, è il momento di mostrare maggiori dettagli sul prodotto,

Qui ci sono vari modi per aggiungere cose. Il modo più preferito sarebbe quello a schede. Potresti aver visto nello stesso WooCommerce che ci sono schede in cui gli utenti possono fare clic su qualsiasi scheda e vedere le informazioni che desiderano.

Se non desideri aggiungerlo alle schede, puoi anche aggiungerlo direttamente alla pagina. Dipende dalla quantità di informazioni che desideri inserire qui.

Di solito, la seconda metà prevede una lunga descrizione. Questo è tutto. Non ci sono altre cose di cui potresti aver bisogno qui. Tuttavia, le persone spesso giocano un po' e aggiungono più cose qui.

Ad esempio, se vendi articoli elettronici, hai una scheda per la descrizione, la seconda scheda per la tabella delle caratteristiche e la terza può essere il manuale. Puoi anche aggiungere gli aspetti tecnici in una nuova scheda.

Lo scopo principale di questa sezione è garantire che l'utente possa comprendere tutti i dettagli sul prodotto e che avrà risolto ogni domanda.

 

Domande frequenti e revisione

A proposito di domande, puoi anche aggiungere una sezione FAQ proprio come fanno i grandi siti di e-commerce. Questo risponderà alle domande più comuni degli utenti. Ciò aumenterà nuovamente le possibilità di effettuare una vendita.

La sezione successiva riguarda le recensioni. Qui è dove puoi aggiungere le recensioni dei clienti. Non visualizzare tutte le recensioni. Puoi semplicemente visualizzare le recensioni più utili del prodotto.

 

upsell

È qui che entra in gioco la vera magia del modello di prodotto Elementor. Una volta che l'utente è arrivato alla fine della pagina, potrebbe avere due cose in mente. O scorreranno direttamente verso l'alto e acquisteranno il prodotto oppure inizieranno a cercare un altro prodotto. Ci sono buone probabilità che l'utente lasci la pagina e cerchi i prodotti su un altro sito web. Sicuramente non vorrai farlo.

Pertanto, visualizzeremo “Prodotti che potrebbero piacerti" e "prodotti correlati" Qui. Puoi cercare prodotti e troverai molti widget simili che puoi aggiungere qui. Ecco come puoi aumentare le vendite dei prodotti.

Qui aggiungeremo altri widget simili che ci consentiranno di vendere di più. Successivamente, la pagina del prodotto sarà completata.

È quindi possibile salvare le modifiche e il gioco è fatto.

Salva il modello di prodotto Elementor

Ma aspetta, risparmiare non è così facile come sembra. Per i modelli normali, potremmo semplicemente premere il pulsante Salva e il gioco è fatto. Tuttavia, qui le cose sono diverse.

Qui dovrai fare qualche altro passo per salvare le modifiche esatte.

Quando premi il pulsante Salva, ti verrà chiesto di impostare le condizioni. È qui che le cose cambiano un po’. Dovrai impostare le condizioni qui.

Poiché vogliamo che tutti i prodotti utilizzino questo modello specifico, utilizzeremo questa condizione qui.

Basta includere tutti i prodotti e il gioco è fatto. Utilizzerà quindi lo stesso modello per tutti i prodotti.

Ma aspetta, cosa succede se desideri visualizzare il modello di prodotto Elementor solo per prodotti specifici e non per tutti i prodotti.

Hai due modi per farlo. Puoi impostare la condizione di esclusione ed escludere categorie specifiche. In alternativa, puoi anche includere i prodotti di una categoria specifica.

Ecco come puoi impostare le condizioni. Quando imposti le condizioni da includere, il modello di prodotto Elementor verrà mostrato a quel modello specifico.

Ora c'è un altro modo per impostare il modello di prodotto Elementor. Parliamone.

 

Importazione del modello di prodotto Elementor

Ora esiste un modo semplice per impostare il modello di prodotto Elementor. qui non otterrai funzionalità di personalizzazione complete ma è più semplice creare il modello utilizzando questo metodo.

Elementor ha alcuni dei modelli che puoi importare direttamente e iniziare a utilizzare. Puoi importare i modelli per il prodotto WooCommerce e quindi salvarli come modello.

Puoi importarlo proprio come importi il ​​modello normale.

Per questo, avrai due metodi qui. Puoi importare l'intero modello e iniziare ad apportare le modifiche da lì. Ora, se non vuoi farlo, c'è un'altra opzione che hai qui. Qui è dove puoi importare i blocchi e creare il modello tu stesso.

Elementor fornisce blocchi. Questi blocchi non sono altro che una sezione già creata per te. puoi iniziare direttamente a importare i blocchi. Ci saranno molti blocchi. Ad esempio, se desideri un blocco per la prima metà del prodotto, puoi importare direttamente quel blocco. Avrà già tutti gli elementi aggiunti. Se vuoi cambiare qualcosa qui, puoi sicuramente apportare le modifiche poiché è completamente modificabile. È possibile apportare le modifiche e poi pubblicarle. In questo modo puoi creare il miglior impatto del prodotto Elementor per il tuo sito web.

In alternativa, puoi anche importare il modello e personalizzarlo. La combinazione di entrambi renderà il tuo lavoro estremamente più semplice.

 

Le parole finali

Per concludere, ecco come puoi creare un modello di prodotto Elementor che funzioni bene con ogni singolo sito web. Invece di crearlo da zero, ti consigliamo di importare il modello o almeno i blocchi. Se importi i blocchi, il lavoro sarà molto più semplice per te. Ecco come puoi iniziare ad apportare le modifiche al modello di prodotto Elementor. Non dimenticare di aggiungere i widget nel modello già pronto. Puoi sicuramente aggiungere widget extra o personalizzare i widget esistenti secondo la tua scelta. Questo è il modo preferito per creare un modello di prodotto Elementor.

Come iniziare?

Scopri di più

Sviluppatori di Elementor

Assumi una forza lavoro remota flessibile e un'attenzione totale.

Inizia Ora

Hai problemi con WordPress?

Rivendica il tuo Manutenzione gratuita di WordPress

Nel frenetico panorama digitale di oggi, ogni sito web merita la cura e l'esperienza di un team di manutenzione professionale, garantendo prestazioni ottimali, maggiore sicurezza ed esperienze utente fluide, così puoi concentrarti sulla crescita della tua attività in tutta tranquillità.

Alexey Seryapin
Fondatore di WPServices

Codice coupon applicato!

Prenditi il ​​tuo tempo e continua a navigare tra i nostri servizi.

Alexey Seryapin
Fondatore di WPServices