Elenca i prodotti in Elementor con la tabella dei prodotti WooCommerce

In questo post, ti mostreremo come combinare Elementor e WC Product Table per creare un sito WordPress più personalizzato aumentando allo stesso tempo le vendite del tuo negozio WooCommerce.

WordPress semplifica il processo di creazione di un sito Web e di renderlo operativo rapidamente. WooCommerce è un plugin per WordPress che ti consente di trasformare qualsiasi sito Web WordPress in un negozio online perfettamente funzionante. Corri il rischio di produrre un sito imitatore, tuttavia, se continui con le opzioni e funzionalità predefinite, questo potrebbe non essere appropriato per le tue esigenze aziendali. È fondamentale individuare gli strumenti migliori per progettare e personalizzare il tuo sito web finché non è quello che desideri.

molti plugin per migliorare le funzionalità del tuo negozio: Elementor, ad esempio amp è lo strumento più semplice per personalizzare la pagina del tuo prodotto WooCommerce. Sebbene sia uno dei suoi vantaggi più significativi, presenta anche alcuni inconvenienti significativi. Ad amp , quando combini plugin di autori diversi, corri il rischio di riscontrare errori di compatibilità e altre complicazioni; questo non è il caso quando si utilizzano i plugin WooCommerce Product Table e Elementor per i siti Web WordPress. Avrai un maggiore controllo sull'aspetto e sulla funzionalità del tuo sito quando utilizzi uno di questi plugin e possono essere utilizzati insieme per ottenere risultati ancora più eccellenti.

• Una rapida panoramica della tabella dei prodotti WooCommerce e dei framework Elementor
• Per incorporare una tabella prodotti WooCommerce in un editor di testo o in un widget shortcode, segui questi passaggi:
• Accordi, schede e commutatori possono essere utilizzati per organizzare diverse tabelle di prodotti.

Una rapida panoramica della tabella dei prodotti WooCommerce e dei framework Elementor

Come affermato in precedenza, è disponibile una vasta selezione di plugin WordPress per assisterti nella creazione di un sito WordPress migliore e personalizzato in base alle tue esigenze specifiche. Alcuni plugin sono progettati per essere utilizzati su larga scala, mentre altri sono progettati per aggiungere un aspetto o una funzionalità particolare.

Elementor è un amp del primo tipo di applicazione:

Il nostro plugin per la creazione di pagine ti offre un'interfaccia completamente nuova per costruire pagine web e creare il tuo sito web WordPress. Ottieni un grande controllo sul modo in cui viene creato il tuo sito Web selezionando e personalizzando un'ampia libreria di widget, blocchi e layout.

Sebbene la tabella dei prodotti WooCommerce sia una soluzione più generale, è anche più mirata:

Questo plugin ti consente di creare tabelle dinamiche e completamente personalizzabili che elencano i tuoi prodotti e servizi WooCommerce. Tuttavia, grazie alla loro interazione con WooCommerce, queste tabelle sono particolarmente adatte per visualizzare articoli e servizi in modo intuitivo e visivamente accattivante per gli acquirenti online. Il plugin Posts Table Pro interagisce allo stesso modo con Elementor ed elenca qualsiasi tipo di contenuto WordPress in una tabella anziché semplicemente i prodotti WooCommerce (se desideri visualizzare qualcosa di separato dai prodotti, come post, pagine o documenti), puoi invece utilizzare.

Se utilizzati insieme tra loro, Elementor e WooCommerce Product Table offrono funzionalità significativamente diverse. Puoi utilizzarli per produrre impatti altamente significativi che ti aiuteranno ad aumentare il numero di vendite per il tuo negozio WooCommerce.

Ora è il momento di mettersi al lavoro. Nelle sezioni seguenti, esamineremo alcuni amp reali di come utilizzare la tabella dei prodotti WooCommerce e l'Elementor per creare effetti simili a quelli mostrati sopra.

Quando si tratta di combinare questi due plugin , il cielo è il limite e queste sono solo alcune delle possibilità. Con un po' di tentativi ed errori, puoi mettere insieme varie pagine utilizzando lo stesso approccio fondamentale che dimostreremo.

Innanzitutto, dovrai assicurarti che entrambi plugin siano installati correttamente sul tuo sito. È positivo che l'installazione di Elementor e la configurazione della tabella dei prodotti WooCommerce siano indolori e semplici. Anche WooCommerce stesso deve essere installato e abilitato prima di poter procedere con questo passaggio. Allora sarai pronto per andare a lavorare sul tuo progetto.

Per incorporare una tabella prodotti WooCommerce in un editor di testo o in un widget shortcode, segui questi passaggi:

Cominciamo con l'applicazione più fondamentale e vantaggiosa possibile. In alternativa, se desideri semplicemente utilizzare una tabella di prodotti dinamica sul tuo sito Web Elementor, puoi aggiungerla a un widget e visualizzarla sul front-end del sito Web.

Assicurati di utilizzare l'editor Elementor quando apri qualsiasi pagina o post per raggiungere questo obiettivo. Se ti viene presentata l'interfaccia familiare di WordPress, fai clic sul pulsante Modifica con Elementor per passare all'interfaccia di Elementor:

Se è la prima volta che lavori con Elementor, facciamo un piccolo giro sulla piattaforma. Sulla destra apparirà un'ampia area in cui verranno visualizzati i tuoi contenuti, che verranno aggiornati in tempo reale man mano che li aggiungi e modifichi. Sul lato sinistro dello schermo è presente un elenco di "widget" che puoi trascinare nell'area designata e quindi riorganizzare e configurare secondo necessità:

Una tabella di prodotti può essere utilizzata con una varietà di widget Elementor diversi. Se desideri visualizzare solo una singola tabella di prodotti su una pagina, tuttavia, puoi farlo includendo una sezione di testo introduttivo nel codice HTML della pagina. Prendi il widget Editor di testo e spostalo in un posto vuoto come segue:

Successivamente, puoi fare clic all'interno del widget per rimuovere il testo predefinito e sostituirlo con qualsiasi contenuto desideri. Quando si tratta della tabella del prodotto stessa, puoi includerla incollando questo semplice shortcode:

[tabella prodotti]

Quando inserisci lo shortcode nella tua pagina, la tabella apparirà nella posizione specificata, che puoi verificare visualizzandola sul front-end:

Se desideri utilizzare un elemento solo per il codice stesso, puoi utilizzare il widget Shortcode.

Non dimenticare mai di salvare la pagina quando hai finito di posizionare la tabella, non importa dove decidi di metterla. Successivamente, probabilmente vorrai apportare alcune modifiche al modo in cui appare e funziona la tabella.

Ritorna alla dashboard di WordPress e vai alla scheda WooCommerce > Impostazioni per completare questa attività. Le tabelle dei prodotti possono essere trovate selezionando Prodotti nella parte superiore dello schermo e quindi Tabelle dei prodotti:

Un elenco completo di opzioni per configurare la tabella dei prodotti WooCommerce può essere trovato proprio qui. Hai il controllo completo sulle informazioni visualizzate nella tabella e puoi personalizzarle aggiungendo filtri e variabili, tra le altre cose. Controlla la documentazione del plugin per maggiori informazioni sulle diverse scelte.

Potrai modificare la tabella dei prodotti che hai appena creato utilizzando Elementor senza dover fare nient'altro. Una volta che hai finito di personalizzare il tavolo secondo le tue specifiche, salva semplicemente le modifiche e sei pronto per partire!

Accordi, schede e commutatori possono essere utilizzati per organizzare diverse tabelle di prodotti.

La soluzione di cui sopra funziona bene se desideri presentare un'unica tabella con i tuoi prodotti WooCommerce. Se intendi costruire molte tabelle, ognuna delle quali ha una diversa categoria di oggetti, questa non è l'opzione migliore.

Esistono diversi modi per ottenere ciò in Elementor. Il widget Accordion, ad amp , può essere utilizzato per generare lo stesso effetto che abbiamo visto nell'ultimo case study. Partendo dall'area di modifica a destra, sposta il widget Fisarmonica nell'area di modifica a sinistra.

Puoi creare tutte le schede separate che desideri facendo clic sui segni più e puoi personalizzare le intestazioni e il testo all'interno di ciascuna di esse. Inoltre, puoi aggiungere una tabella di prodotti a una o più schede utilizzando lo stesso shortcode menzionato in precedenza.

Naturalmente, aggiungendo semplicemente lo shortcode di base si otterrà una successione di tabelle di prodotti simili, che molto probabilmente non è quello che stavi cercando in primo luogo. Dovrai invece personalizzare ogni shortcode per visualizzare solo i prodotti specifici, ad amp gli articoli di una categoria specifica, anziché tutti i prodotti.

Il metodo che utilizzerai sarà determinato dai prodotti che desideri includere e omettere da ciascuna tabella in questione. Per ulteriori informazioni, consulta la guida completa per personalizzare gli shortcode della tabella prodotti WooCommerce.

Vale la pena notare che puoi ottenere un effetto simile con l'aiuto di altri utili widget Elementor; questo comprende il widget Toggle e il widget Schede, tra gli altri componenti. In termini di presentazione di diverse tabelle di prodotti WooCommerce in modo accattivante e ben organizzato, Elementor è il tuo strumento di riferimento.

Ripulisci il tuo markup sciatto grazie agli organizzatori online gratuiti di HTML, CSS e JavaScript!

Pensa attentamente alla progettazione del tuo sito di e-commerce se vuoi che la tua attività si distingua dalla concorrenza. Ad amp , ti consigliamo di determinare il modo più efficace di presentare i tuoi prodotti, idealmente in uno stile che sia allo stesso tempo facile da usare e visivamente accattivante.

Fortunatamente, l’utilizzo del plugin WooCommerce Product Table con Elementor rende questo compito semplice. Lo shortcode della tabella dei prodotti può essere utilizzato per visualizzare tutto ciò che il tuo sito ha da offrire (o solo una selezione) in modo veramente dinamico.