Modificare il numero di colonne dei prodotti di default in WooCommerce

Di default, WooCommerce, mostra un numero di 4 prodotti per ogni riga nella versione Desktop, mentre dopo i 768px, ovvero Tablet verticale, si riduce a 2 per poi passare  a 1 singolo prodotto sui dispositivi mobili.

Oggi vedremo sia la semplice regola PHP per andare a modificare il numero di colonne per riga, sia tutta la regola CSS adattativa.

Schema a 3 colonne

Inserite nel vostro file functions.php la seguente funzione che andrà a modificare il numero di colonne di default.

Ora dobbiamo sistemare il CSS nel seguente modo:

Schema a 2 colonne

Inserite nel vostro file functions.php la seguente funzione che andrà a modificare il numero di colonne di default.

Ora dobbiamo sistemare il CSS nel seguente modo:

Tutto qua. Come vedete è stato molto semplice andare a modificare il template di default di WooCommerce e renderlo più adatto ai nostri scopi. Nulla vi vieta comunque di modificare il CSS a seconda del vostro caso specifico.

6 commenti su Modificare il numero di colonne dei prodotti di default in WooCommerce

    1. Ciao Giuseppe! No non credo funzioni. Ora poi WooCommerce ha adottato (finalmente!!), tramite il theme customizer la possibilità di stabilire tramite select quante colonne avere!

    2. Ciao Glenda, questo perché da ora WooCommerce ha introdotto di serie questa opzione. La trovi in Aspetto–Personalizza

  1. Ciao miniMAC,WooCommerce ora da la possibilità di modificarle ma non per device.In mobile resta sempre 1.C’è qualche opzione che non trovo? Hai qualche soluzione?

    1. Ciao WoodyP, per il momento l’unica soluzione possibile è quella di inserire un CSS personalizzato, appunto per la versione mobile. Dovrai lavorare con la proprietà columns ed applicarla a tutti gli elementi interessati!

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *