Se hai un’attività WooCommerce, probabilmente hai sentito parlare di shortcode (codici brevi). Sono piccoli snippet che ti consentono di aggiungere e personalizzare diversi aspetti del tuo negozio online senza scrivere lunghi blocchi di codice.
In questo post, daremo un’occhiata a cosa sono gli shortcode di WooCommerce, perché dovresti usarli e come sfruttarli al meglio.
Iniziamo.
WooCommerce shortcode: tutto quello che devi sapere
Se lavori con WordPress, probabilmente hai familiarità con WooCommerce. Attualmente, il 93,7% di tutti i siti web di e-commerce WordPress utilizza il rinomato plugin WooCommerce.
Questa piattaforma open-source completamente personalizzabile sviluppata da WooThemes, è nata come qualsiasi altro componente aggiuntivo, ma è subito decollata con milioni di download. Ad oggi, è stato scaricato 70 milioni di volte ed è diventato il principale plugin di eCommerce, alimentando un totale del 28% dei negozi online.
Nonostante la sua ottima reputazione e il suo successo, il team lavora continuamente per rendere WooCommerce ancora migliore.
Durante il suo percorso di sviluppo, ha fornito agli utenti shortcode di vario tipo per personalizzare i loro siti. Con gli shortcode, gli utenti possono trasformare i loro negozi e personalizzarne l’interfaccia, il check-out, le funzionalità, il processo di elencazione dei prodotti e altro ancora.
Quindi, per aiutarti a ottenere il massimo dagli shortcode, in questa guida daremo uno sguardo a:
- Una breve spiegazione degli shortcode
- Perché sono necessari per la tua attività
- Un elenco di shortcode WooCommerce
- Come utilizzarli al meglio
Cosa sono gli shortcode di WooCommerce?
Cominciamo con le basi. Gli shortcode WooCommerce shop sono piccoli snippet che ti aiutano a ottenere una funzionalità o visualizzare contenuti sul tuo sito eCommerce senza scrivere lunghe righe di codice. In altre parole, sono macro che consentono l’interazione dinamica con il contenuto del tuo sito .
Puoi utilizzarli ovunque nel tuo negozio per personalizzarlo, mostrare prodotti o semplicemente pulsanti call to action. E la parte migliore è che non hai bisogno di alcuna conoscenza di codice per iniziare a usarli. Hai solo bisogno di una passione ardente per il business online e una profonda comprensione di ciò che desideri per il tuo negozio. Gli shortcode faranno il resto in modo pulito ed ordinato.
In poche parole, gli shortcode di WooCommerce sono utili per tre motivi principali:
- Ti fanno risparmiare tempo perché non devi scrivere lunghe righe di codice, dandoti la possibilità di lavorare su altro.
- Poiché non aggiungono un markup al contenuto del post, i gestori dei negozi potranno modificare lo stile della pagina in un secondo momento.
- Più flessibilità. Anche se questo dipenderà dai parametri impostati dall’utente, è possibile applicare lo stesso shortcode a situazioni diverse.
Perché hai bisogno degli shortcode di WooCommerce?
Non sei ancora convinto? Ripensaci perchè gli shortcode di WooCommerce possono fare molto di più di quanto immagini.
In primo luogo, con gli shortcode , avrai il pieno controllo del tuo sito . Ciò significa che puoi visualizzare liberamente i prodotti, aggiungere pulsanti di invito all’azione o pulsanti di qualsiasi tipo ovunque nel tuo negozio senza chiedere aiuto a nessuno sviluppatore. Significa anche che non devi nemmeno lavorare con lunghi e complessi blocchi di codice.
Questo è perfetto per coloro che vogliono provare varie strategie nei loro negozi online. Ad esempio, anziché accompagnare i clienti attraverso un processo di vendita standard come qualsiasi altro negozio, potresti voler visualizzare un pulsante Aggiungi al carrello su uno dei tuoi post per incoraggiare le conversioni. E la parte migliore è che gli shortcode ti consentono di scegliere tra molti pulsanti di invito all’azione che inserisci sul tuo sito.
Inoltre, gli shortcode di WooCommerce ti consentono di aggiungere prodotti alla home page, creare una griglia di articoli in offerta per mostrarli ai clienti e mostrare i tuoi prodotti ovunque desideri. È anche possibile creare una pagina di tracciamento dell’ordine!
E questa è la magia degli shortcode, offrono infinite opzioni per personalizzare il tuo negozio .
Quali tipi di shortcode WooCommerce esistono?
Poiché è difficile valutare quanti shortcode offre WooCommerce, li elencheremo in base alla loro categoria. Ecco una rapida panoramica degli shortcode di WooCommerce che tratteremo in questa guida:
- Shortcode di pagina
- Shortcode Prodotti (questa è la categoria più corposa)
- Shortcode di pagina del prodotto
- Shortcode dei prodotti correlati
- Pulsante Aggiungi al carrello o shortcode URL
Come ottenere il massimo dagli shortcode di WooCommerce ?
Vediamo cosa può fare ogni tipo di shortcode e come sfruttarlo al meglio.
1. Shortcode di pagina
WooCommerce crea 4 pagine predefinite con gli shortcode inclusi, quindi non dovrai aggiungerli manualmente. Tuttavia, se per qualche motivo non fosse così, potresti ricreare le pagine con gli shortcode e assegnarle nelle impostazioni.
All’interno degli shortcode della pagina troverai:
Carrello
[ woocommerce_cart]
Questo shortcode viene utilizzato per la pagina del carrello e ti permette di visualizzare il contenuto del carrello una volta che i clienti aggiungono i loro prodotti.
Visualizza anche l’interfaccia per i codici coupon e altri elementi per una pagina del carrello standard.
Questo è un semplice shortcode, quindi non aggiungere altre condizioni o parametri ad esso.
Check-out
[ woocommerce_checkout]
Una volta che i tuoi clienti hanno scelto tutti i prodotti / servizi che desiderano acquistare, faranno clic sul check-out, ed è qui che entra in azione lo shortcode per il checkout.
Mostrerà tutte le informazioni necessarie che l’acquirente deve vedere prima del checkout, come metodo di pagamento, informazioni di fatturazione, informazioni di spedizione, ecc.
Anche questo è un semplice shortcode che non accetta argomenti aggiuntivi.
Il mio account
[ woocommerce_my_account]
I clienti possono vedere e modificare i dettagli del proprio profilo, come nome, indirizzo e-mail, password, nonché i dettagli dell’ordine come l’indirizzo di spedizione e di fatturazione. Con questo shortcode, gli utenti saranno in grado di visualizzare, modificare e aggiornare quei dettagli.
Modulo di tracking dell’ordine
[ woocommerce_order_tracking]
A differenza dei tre shortcode di pagina precedenti, questo non viene generato automaticamente per impostazione predefinita, ma puoi aggiungerlo in modo che i tuoi clienti possano vedere e monitorare lo stato degli ordini in corso.
Se desiderano controllare lo stato di un ordine, gli acquirenti devono inserire i dettagli dell’ordine nel modulo di tracciabilità dell’ordine.
Puoi utilizzare questo shortcode WooCommerce per una singola pagina o combinarlo con altri shortcode per visualizzare il modulo di tracking.
Puoi utilizzare questo shortcode nella pagina Il mio account per consentire ai tuoi clienti di accedere al modulo di tracking.
2. Shortcode del prodotto
Tieni presente che per utilizzare gli shortcode del prodotto avrai bisogno di WooCommerce 3.2 e versioni successive. Queste versioni consentono di utilizzare lo shortcode del prodotto per tutti i tipi di visualizzazione del prodotto. Se disponi di una versione precedente, controlla questo documento perché dovrai utilizzare shortcode diversi per ogni tipo di raggruppamento di prodotti.
[ products]
2.1 Attributi degli shortcode del prodotto
Quando utilizzi gli shortcode dei prodotti, dovrai specificare quali prodotti desideri visualizzare in base a condizioni diverse che ti consentiranno di filtrare i prodotti per ID articolo, SKU, categorie, attributi e così via. Supportano anche l’impaginazione, l’ordinamento casuale e i tag di prodotto.
Esaminiamo alcuni shortcode del prodotto:
Limita la quantità di prodotto
Con l’attributo limit, puoi stabilire un limite al numero di prodotti visualizzati. Ad esempio, puoi limitare il numero di prodotti da mostrare a 8 articoli come segue:
[ products limit="12"]
Si noti che per impostazione predefinita, il limite è “-1”, il che significa che verranno visualizzati tutti i prodotti.
Modifica il layout del prodotto
Con gli shortcode di WooCommerce puoi anche cambiare il layout per diversificare la visualizzazione del prodotto. Scegli tra i seguenti attributi a seconda delle preferenze dei tuoi clienti: colonne, impaginazione o ordina per.
a. Columns
Se desideri impostare un certo numero di colonne, dovrai aggiungere l’attributo “coumns” e indicare il numero che desideri. Quindi, se vuoi 6 colonne con un prodotto diverso in ciascuna di esse, puoi utilizzare ::
[ products limit="12" columns="4"]
b. Paginate
Un altro esempio è l’attributo paginate, che divide i tuoi prodotti in pagine diverse. Con questo shortcode, puoi specificare il numero di elementi mostrati in ogni pagina.
Per usarlo, imposta paginate = “true”, quindi inserisci il seguente shortcode:
[ products limit="12" columns="4" paginate="true"]
c. Ordina i prodotti con “orderby”
L’ attributo orderby offre una vasta gamma di opzioni in quanto ti consente di ordinare i tuoi prodotti in base a diversi criteri per visualizzarli come desideri aggiungendo condizioni come:
- id: mostra i prodotti per ID prodotto.
- popularity : con questo attributo, verranno mostrati per primi i prodotti che vengono acquistati di più.
- title : ordina i prodotti in base al titolo. Questo è l’ordine predefinito di orderby.
- rating : un altro modo interessante per ordinare i prodotti è basato sul loro valore medio di valutazione.
- date: per ordinare gli elementi in base alla data di pubblicazione. Per impostazione predefinita, viene visualizzato per primo il prodotto più vecchio. Tuttavia, puoi modificarlo utilizzando l’attributo data.
- rand : con questo attributo, puoi modificare l’ordine dei prodotti quando la pagina viene ricaricata. Tuttavia, con i siti in cui la memorizzazione nella cache è abilitata e i prodotti vengono salvati in un ordine fisso, questo attributo potrebbe non funzionare.
- menu_order : funziona solo quando hai impostato gli ordini di menu e mostrerà i prodotti in base a quell’ordine. Il numero più basso verrà mostrato per primo.
Se desideri più personalizzazione, puoi fare un ulteriore passo avanti e combinare queste opzioni semplicemente aggiungendo uno spazio tra di loro. Ad esempio, potresti provare a mescolare gli shortcode per visualizzare sei colonne di prodotti in un ordine basato sulla loro popolarità in questo modo:
[ products limit="12" columns="4" orderby="popularity"]
Più attributi del prodotto
Ci sono molti altri attributi di prodotto in WooCommerce che puoi usare combinandoli con lo shortcode “products” . Alcuni dei principali sono:
- SKU: puoi visualizzare i tuoi prodotti in base alla loro SKU (unità di stoccaggio). Se desideri aggiungere più SKU, separali semplicemente con virgole.
- on_sale : come suggerisce il nome, questo attributo mostrerà tutti i prodotti del tuo negozioin saldo.
- category : è anche una buona idea mostrare i prodotti in base alle loro categorie. Puoi avere più categorie.
- best_selling : questa è una buona opzione se vuoi mostrare per primi i tuoi prodotti più popolari e più venduti.
- top_rated : seguendo la stessa logica, puoi anche mostrare i tuoi articoli più recensiti.
- class : questo attributo ti aiuta a cambiare l’ordine utilizzando CSS personalizzati aggiungendo una classe wrapper HTML.
Se desideri visualizzare i tuoi prodotti più venduti, quattro per riga, con un massimo di dodici articoli, puoi utilizzare :
[ products limit="12" columns="4" best_selling="true"]
Visibilità
Questo attributo ti consente di visualizzare i prodotti in base alle impostazioni di visibilità. Alcune delle opzioni sono:
- catalog : Recupera i prodotti visibili solo nella pagina del negozio
- search: mostra i prodotti che sono visibili solo nella pagina di ricerca
- visible: è una combinazione dei due precedenti in quanto recupera i prodotti visibili nella pagina del negozio e nei risultati di ricerca.
- hidden: mostra i prodotti a cui è possibile accedere solo tramite un URL diretto.
- featured : recupererà solo i prodotti contrassegnati come in evidenza
Ad esempio, se desideri visualizzare i tuoi prodotti in evidenza, quattro per riga, con un massimo di dodici articoli, puoi utilizzare questo shortcode:
[ products limit="12" columns="4" visibility="featured"]
Attributi del prodotto
All’interno degli shortcode dei prodotti, ci sono attributi del prodottoche puoi utilizzare per recuperare i prodotti su una determinata pagina o post. Più specificamente, è possibile recuperare materiale in base all’attributo disponibile o ai termini dell’attributo (si tratta di variazioni di quell’attributo). Puoi farlo includendo lo slug, specificando i termini e combinandoli con gli attributi. Questo può creare un pò di confusione, quindi diamo un’occhiata più da vicino a ciascuno di essi:
- attribute: aiuta a visualizzare i prodotti racchiudendo gli slug
- terms: menziona i termini degli attributi separati da virgole
- terms_operator: ti dà un maggiore controllo su come mostrare gli attributi. Ci sono tre operatori:
- AND : mostrerà i prodotti di tutti gli attributi che hai scelto.
- IN : Visualizza i prodotti che hanno quell’attributo scelto.
- NON IN : mostrerà i prodotti che non hanno gli attributi scelti.
Categorie
Seguendo la stessa logica degli attributi del prodotto, puoi anche visualizzare gli articoli in base alle loro categorie:
- category: per scegliere la categoria che si desidera visualizzare
- cat_operator: puoi applicare condizioni per mostrare gli elementi che desideri:
- AND: I prodotti visualizzati devono appartenere a tutte le categorie scelte
- IN: I prodotti visualizzati devono essere in almeno una delle categorie scelte
- NOT IN: I prodotti visualizzati non devono necessariamente essere in nessuna delle categorie scelte
- Puoi anche visualizzare i prodotti in base a un elenco separato da virgole di ID post o un elenco di SKU.
- Esistono molti altri shortcode / attributi che appartengono agli shortcode del prodotto: attributi speciali e categoria di prodotto. La logica è molto simile a quello che hai visto sopra, ma nel caso in cui desideri approfondire, puoi controllare questo documento.
- Se vuoi saperne di più sugli shortcode, puoi visitare questa pagina e dare un’occhiata alle 8 situazioni.
Se desideri visualizzare prodotti per categorie specifiche, quattro per riga, con un massimo di dodici articoli, puoi utilizzare questo shortcode:
[ products limit="12" columns="4" category="hoodies, tshirts"]
3. Shortcode della pagina del prodotto
Con questo tipo di shortcode WooCommerce, puoi mostrare diverse pagine di prodotto utilizzando due attributi: ID prodotto e SKU.
È importante notare che puoi persino utilizzare entrambi i seguenti shortcode:
[ product_page id="219"]
oppure
[ product_page sku="hoodie"]
4. Shortcode per i prodotti correlati
Se hai utilizzato negozi di e-commerce come Amazon o Alibaba, avrai notato che quando guardi un prodotto, ti vengono mostrati anche gli articoli correlati.
Ad esempio, se stai cercando una tenda, ti verranno mostrati altre tende simili e dei sacchi a pelo. Questo perché se hai bisogno di una tenda, probabilmente sarai interessato anche ad un sacco a pelo.
Mostrare ai tuoi clienti i prodotti correlati è un’ottima idea per aumentare le tue vendite . In WooCommerce questo è possibile con lo shortcode dei prodotti correlati. Puoi indicare esattamente quanti prodotti vuoi che gli utenti vedano.
Se vuoi mostrare 4 prodotti, lo shortcode dovrebbe essere:
[ related_products limit="4"]
5. Pulsante Aggiungi al carrello
Un pulsante Aggiungi al carrello è un altro ottimo modo per migliorare l’esperienza del cliente nel tuo negozio e aumentare il tasso di conversione. E la parte migliore è che è molto semplice.
Supponiamo che tu voglia visualizzare il prezzo di un prodotto e un pulsante Aggiungi al carrello su un articolo o una pagina, lo snippet che devi utilizzare è :
[ add_to_cart sku="hoodie"]
Gli shortcode di WooCommerce ti consentono anche di reindirizzare i tuoi acquirenti a un altro URL invece di aggiungere un articolo al carrello.
Per fare questo, devi scrivere:
[ add_to_cart_url id="219"]
per il prodotto con ID 219.
Elenco di shortcode utili per WooCommerce
Ecco un elenco degli shortcode WooCommerce più utili che puoi utilizzare sul tuo sito.
- Shortcode della pagina del carrello.
[ woocommerce_cart]
- Pagina di checkout
[ woocommerce_checkout]
- Account utente.
[ woocommerce_my_account]
- Modulo di tracking dell’ordine.
[ woocommerce_order_tracking]
- Shortcode dei prodotti.
[ products]
- Prodotti in evidenza
[ featured_products]
- Prodotti in offerta
[ sale_products]
- I più venduti.
[ best_selling_products]
- Prodotti recenti.
[ recent_products]
- Attributo del prodotto.
[ product_attribute]
- Prodotti più quotati.
[ top_rated_products]
- Categoria di prodotto: per visualizzare i prodotti di una categoria specifica.
[ product_category]
- Categorie di prodotti: mostra tutte le tue categorie di prodotti.
[ product_categories]
- Messaggi del negozio: per visualizzare i messaggi.
[ shop_messages]
- Filtro prodotto: visualizza un filtro di ricerca del prodotto.
[ woocommerce_product_filter]
- Filtro attributo.
[ woocommerce_product_filter_attribute]
- Filtro categoria prodotto.
[ woocommerce_product_filter_category]
- Filtro prezzo.
[ woocommerce_product_filter_price]
- Filtro tag prodotto.
[ woocommerce_product_filter_tag]
- Filtro valutazione.
[ woocommerce_product_filter_rating]
- Filtri prodotti in offerta: visualizza un filtro in tempo reale per i prodotti in saldo.
[ woocommerce_product_filter_sale]
- Reimposta filtro prodotto: visualizza un pulsante per cancellare tutti i filtri attivi.
[ woocommerce_product_filter_reset]
Shortcode WooCommerce: conclusione
Gli shortcode di WooCommerce ti aiutano a personalizzare il tuo negozio senza scrivere lunghe righe di codice. In questo modo puoi testare diversi layout e alternative per trovare quello giusto per il tuo negozio.
Anche se all’inizio possono sembrare complicati, con un pò di pratica ti semplificheranno la vita e ti aiuteranno a far crescere il tuo business.
Buon lavoro!
