WooCommerce è uno dei plugin più diffusi per creare siti di e-commerce su WordPress. WooCommerce Blocks è uno dei plugin di WooCommerce, progettato per semplificare la creazione di negozi online su WordPress da parte degli utenti. WooCommerce Blocks aiuta a realizzare pagine di negozio personalizzate, a mostrare i tuoi prodotti e ad aggiungere funzionalità e-commerce avanzate come il filtraggio e la ricerca dei prodotti – il tutto senza scrivere una singola riga di codice. 

Devi installare il plugin WordPress WooCommerce Blocks per utilizzare questi nuovi blocchi. Questo plugin è un terreno di prova per funzionalità sperimentali che potrebbero essere aggiunte al core di WooCommerce.

In questa guida pratica, discuteremo le funzionalità dei blocchi WooCommerce e come personalizzarli. 

Che cos'è WooCommerce Block?

WooCommerce Blocks è una raccolta di blocchi integrati con l' editor a blocchi di WordPress (Gutenberg) che ti consentono di aggiungere facilmente varie funzionalità e caratteristiche di WooCommerce alle tue pagine e ai tuoi articoli. Senza scrivere codice, questi blocchi ti permettono di mostrare prodotti, categorie di prodotti, filtri di ricerca, carrelli, pagamenti e altro ancora.

In termini più semplici, i WooCommerce Blocks sono componenti predefiniti che puoi inserire nel tuo sito WordPress utilizzando l'editor a blocchi, offrendo un modo semplice per incorporare funzionalità di e-commerce basate su WooCommerce. Fanno parte del plugin principale WooCommerce, quindi li ottieni automaticamente quando installi e attivi WooCommerce sul tuo sito WordPress.

Inoltre, si integrano perfettamente con l'editor a blocchi di WordPress, consentendoti di creare pagine prodotto personalizzate, layout di categorie ed esperienze di acquisto utilizzando un'interfaccia familiare drag-and-drop.ext here ...

Elenco delle funzionalità del blocco WooCommerce

Dopo aver compreso cos'è un blocco WooCommerce, di seguito analizzeremo una per una ciascuna funzionalità offerta:

• Tutti i prodotti: Mostra tutti i prodotti del negozio in un formato a griglia.
• Filtri prodotto attivi: Visualizza i filtri prodotto attivi sotto forma di elenco o di chip (simili a pulsanti).
• Tutte le recensioni: Mostra tutte le recensioni dei prodotti.
• Prodotto più venduto: Visualizza i prodotti più venduti in un formato a griglia.
• Checkout: Mostra un modulo che consente ai clienti di completare i propri ordini.
• Carrello: Visualizza il carrello della spesa.
• Categoria in evidenza: Mette in evidenza categorie di prodotti specifiche insieme a pulsanti di invito all'azione.
• Prodotto in evidenza: Visualizza i prodotti in evidenza selezionati.
• Filtra per prezzo: Mostra un intervallo di prezzi che i clienti possono utilizzare per filtrare i prodotti. Puoi anche abilitare un intervallo di prezzi modificabile facendo clic su un pulsante o su un testo qui.
• Filtra per disponibilità: Consente di filtrare i prodotti in base allo stato di disponibilità. Questa funzione offre opzioni per visualizzare i prodotti disponibili, esauriti o in riordino.
• Filtra per valutazione: Consente ai clienti di filtrare i prodotti in base alle valutazioni.
• Filtra per attributo: Filtra i prodotti in base a dimensione o colore.
• Prodotti selezionati manualmente: Visualizza i prodotti selezionati manualmente in un formato a griglia, consentendoti di scegliere quali prodotti mostrare specificamente.
• Mini carrello: Fornisce una breve anteprima del carrello.
• Prodotti più recenti: Mostra i prodotti più recenti disposti in un formato a griglia. Possono essere personalizzati aggiungendo/rimuovendo elementi come titolo, prezzo, valutazione e pulsante di acquisto.
• Prodotto in offerta: Mostra i prodotti attualmente in offerta in un formato a griglia e può essere personalizzato aggiungendo/rimuovendo elementi come titolo, prezzo, valutazione e pulsante di acquisto.
• Ricerca prodotto: Aggiunge una barra di ricerca per facilitare i clienti nella ricerca dei prodotti.
• Prodotto per tag: Visualizza i prodotti con tag/etichette specifici in un formato a griglia.
• Prodotto per attributo: Mostra i prodotti con attributi specifici (colore, dimensione, ecc.) in un formato a griglia.
• Prodotto per categoria: Visualizza i prodotti in base alle categorie in un formato a griglia.
• Recensioni per prodotto: Mostra le recensioni raggruppate per prodotto.
• Recensioni per categoria: Mostra le recensioni dei prodotti di categorie specifiche.
• Prodotto singolo: Visualizza la vista dettagliata di un singolo prodotto.
• Prodotti più votati: Mostra i prodotti con le valutazioni più alte in un formato a griglia.

Come usare il blocco griglia prodotti in WooCommerce

Oltre a scoprire le funzionalità disponibili nei blocchi WooCommerce, proviamo a utilizzare o ad aggiungere una griglia di prodotti in WooCommerce. Assicurati di aver installato il plugin WooCommerce Blocks sul tuo sito web. Ecco come aggiungerlo:

1. Apri la pagina o il post in cui vuoi visualizzare la griglia dei prodotti, poi inserisci il titolo "Prodotto".

2. Nella navigazione a sinistra, fai clic sul pulsante (+) > scorri verso il basso fino alla sezione WooCommerce > seleziona "griglia prodotti".

3. Successivamente, per configurare il blocco, vai al pannello di destra.

In questo pannello puoi regolare diverse cose, tra cui:

• Impostazioni layout: Puoi personalizzare il numero di righe e colonne visualizzate nella griglia dei prodotti. Ad esempio, impostando entrambe su 2 per una visualizzazione equilibrata.
• Impostazioni contenuto: Puoi visualizzare un menu a tendina per ordinare i prodotti. Questa funzione consente ai clienti di ordinare i prodotti in base alle loro preferenze. Puoi disattivarla se non è necessaria.
• Stile avanzato: Puoi aggiungere classi CSS per personalizzare l'aspetto.

Come aggiungere prodotti in evidenza alla tua pagina

Il blocco Prodotto in evidenza ti consente di mostrare prodotti specifici sulla tua pagina o nel tuo articolo. Con questo blocco, puoi selezionare i prodotti, personalizzarne l'aspetto e inserirli nei tuoi contenuti per attirare i visitatori verso gli articoli che desideri promuovere.

Per aggiungere il blocco Prodotto in evidenza, segui questi passaggi:

1. Apri la pagina o l'articolo in cui desideri aggiungerlo. Ad esempio, se lo posizioni sopra la griglia dei prodotti, crea spazio in quell'area e fai clic sul pulsante "+" che appare.

2. Seleziona il pulsante "+" sulla barra degli strumenti del blocco per aprire l'elenco dei blocchi, quindi cerca e seleziona "Prodotto in evidenza".

3. Scegli i prodotti che vuoi mettere in evidenza, poi fai clic su "Fine".
4. Per personalizzare l'aspetto del blocco, fai clic su "Impostazioni". Nel pannello delle impostazioni, puoi regolare diverse cose, tra cui:

• Mostra o nascondi la descrizione e il prezzo del prodotto.
• Configura la visualizzazione dei media (immagine e video).
• Aggiungi testo alternativo per le immagini dei prodotti.
• Seleziona il colore di sovrapposizione del blocco.
• Regola l'opacità del blocco.

5. Dopo aver apportato le modifiche, puoi pubblicare o aggiornare la pagina per visualizzare il blocco del prodotto in evidenza.

Come aggiungere blocchi di filtro in WooCommerce

Il blocco Filtro di WooCommerce consente ai clienti di trovare facilmente i prodotti che corrispondono ai loro criteri di ricerca. Grazie alle opzioni di filtro, i clienti possono restringere rapidamente i risultati della ricerca ai prodotti a loro più pertinenti.

Per aggiungere il blocco filtro, segui questi passaggi:

1. Apri la pagina o il post in cui desideri inserire il blocco filtro.
2. Determina la posizione desiderata in cui inserire il blocco filtro.
3. Nella barra degli strumenti dell'editor a blocchi, fai clic sul pulsante "+" e cerca le opzioni di filtro di WooCommerce come Filtro prezzo, Filtro disponibilità, Filtro attributi e Filtro valutazione.

Ora, discutiamo di ogni tipo di filtro disponibile. 

Aggiungere il filtro per prezzo

Il blocco Filtro prezzo prodotto consente di aggiungere una funzionalità di filtro che permette agli utenti di selezionare l'intervallo di prezzo desiderato. L'intervallo di prezzo può essere visualizzato come pulsanti modificabili o come testo normale. È possibile aggiungere pulsanti se lo si desidera e regolarne il livello di intestazione.

Aggiungere il filtro per attributo

Il blocco Filtro attributi prodotto consente agli utenti di filtrare i prodotti in base ad attributi come colore e dimensione. Puoi scegliere gli attributi che desideri utilizzare dall'elenco disponibile. La sua visualizzazione può avvenire sotto forma di elenco o di menu a discesa. Puoi anche configurare il tipo di query come AND o OR. Altre funzionalità includono la visualizzazione del numero di prodotti, la selezione del livello di intestazione, l'aggiunta di pulsanti e la scelta del filtro.

Aggiunta del filtro per disponibilità

Il blocco Filtro prodotti per stato delle scorte consente agli utenti di visualizzare i prodotti in base al loro stato di disponibilità. Possono visualizzare i prodotti disponibili (in magazzino), esauriti (esaurito) o in arretrato. Puoi anche configurarlo per visualizzare il numero di prodotti, selezionare il livello di intestazione e aggiungere pulsanti. Questo blocco può essere utilizzato con altri blocchi WooCommerce, come Tutti i prodotti. Sfortunatamente, questo blocco non fornisce un'anteprima quando viene aggiunto alla pagina.

Blocchi Carrello e Pagamento

Il blocco del carrello aggiunge una visualizzazione del carrello alla tua pagina. Puoi includere un calcolatore dei costi di spedizione, selezionare un link per il pulsante di checkout e impostare una visualizzazione in modalità scura. Questo blocco fornisce anche una notifica che ti permette di impostare la pagina come pagina predefinita del carrello nelle impostazioni di WooCommerce. È incluso anche un link per inviare feedback.

Nel frattempo, il blocco checkout fornisce un modulo di pagamento per il tuo carrello. Ti verrà comunicato che questa pagina può essere impostata come pagina di pagamento predefinita nelle impostazioni di WooCommerce. È inoltre disponibile un'opzione per la visualizzazione in modalità scura. Questo blocco è composto da diversi elementi che puoi personalizzare singolarmente. Sfortunatamente, questo blocco non fornisce un'anteprima una volta aggiunto alla pagina.

Come personalizzare la pagina del negozio su WooCommerce

Dopo aver imparato a utilizzare i vari Blocchi WooCommerce, puoi combinarne diversi per creare una pagina negozio personalizzata e facile da usare. Per realizzare questo specifico layout della pagina negozio, segui questi passaggi.

1. Crea una nuova pagina e chiamala "Negozio".

2. Aggiungi il blocco Ricerca prodotto.

3. Aggiungi il blocco Elenco categorie di prodotti

Poi, imposta lo stile di visualizzazione sul menu a tendina.

4. Aggiungi il blocco Filtro prezzo .
5. Aggiungi il blocco Prodotti in evidenza e seleziona i prodotti che desideri mettere in evidenza. Configura come necessario.

6. Aggiungi il blocco Tutti i prodotti .

Imposta il numero di colonne e righe su 2 e disattiva l'opzione del menu a tendina di ordinamento.

7. Infine, pubblica la pagina per vedere il layout finale della pagina del negozio che hai creato.

Crea il tuo negozio online con WooCommerce Block e vendi i tuoi prodotti

Dopo aver creato con successo una pagina negozio personalizzata con WooCommerce Blocks, puoi iniziare a vendere i tuoi prodotti fisici e digitali. Soprattutto per i prodotti digitali, è fondamentale aggiungere un plugin per il download di file come WP File Download Addon.

Questo plugin ti consente di vendere prodotti digitali scaricabili in WooCommerce. WP File Download Addon semplifica la gestione dei file e delle categorie di file per i prodotti digitali di WooCommerce. Puoi creare rapidamente molti prodotti digitali scaricabili associati a uno o più file.

Inoltre, questo plugin si integra con Dropbox, Google Drive, Microsoft OneDrivee la funzionalità Social Locker . Puoi fornire file da questi servizi cloud come download digitali WooCommerce con accesso altamente limitato tramite connettori API cloud.

Con l'Addon WP File Download , vendere prodotti digitali nel tuo negozio online WooCommerce è diventato più accessibile ed efficiente. Dopo aver creato il tuo negozio con WooCommerce Blocks, questo plugin completa perfettamente la vendita dei tuoi contenuti digitali.

Conclusione

WooCommerce Blocks è un plugin che ti consente di creare un negozio online completo in WordPress senza scrivere codice. Con vari blocchi, come griglie di prodotti, filtri e vetrine di prodotti in evidenza, puoi facilmente creare un'esperienza di acquisto coinvolgente e intuitiva. La familiare interfaccia drag-and-drop rende lo sviluppo di un negozio online più rapido ed efficiente.

Dopo aver creato il tuo negozio online, il passo successivo è vendere prodotti fisici e digitali. Puoi utilizzare il plugin WP File Download Addon per vendere prodotti digitali con WooCommerce, come ebook, software o contenuti multimediali.

WP File Download Addon è disponibile a partire da $49 all'anno ed è stato utilizzato da oltre 60.000 membri. Quindi, cosa stai aspettando? Unisciti a noi per vendere meglio i tuoi prodotti digitali!