Come aggiungere nuovi tab nei prodotti WooCommerce

Contenuto mancante

1- Disabilità ADS Block e ricarica la pagina

2- Ricarica la pagina

Se stiamo sviluppando un sito ecommerce con WooCommerce potrebbe essere necessario personalizzarlo, per esempio se il sito in questione vende computer sarebbe utile avere una scheda informativa con le specifiche tecniche, quindi perchè non metterla in un nuovo tab WooCommerce ?

Vediamo il primo caso, come si può notare questo filtro di WooCommerce crea un nuovo tab che si chiama “Specifiche” e lo inserisce al primo posto (priority 1) tra gli altri tab già presenti nativamente.

woocommerce tab

Come creare un nuovo tab WooCommerce che interagisce con i campi personalizzati di ACF Advanced Custom Fields

Bene, ora vediamo una parte più complessa, andremo a creare un nuovo tab che al suo interno farà il render di alcuni campi personalizzati del plugin ACF; do per scontato che abbiate familiarità con il plugin.

Dopo avere creato la struttura dei campi aggiuntivi, sotto ogni prodotto troveremo una maschera simile a questa

tab woocommerce con acf fields

Ora aggiungiamo il nostro filtro di WooCommerce nel file functions.php, il codice è molto simile a quello sopra, solo ha un pezzo in più relativo ad ACF.

Contenuto mancante

1- Disabilità ADS Block e ricarica la pagina

2- Ricarica la pagina

Ed ecco il risultato a front end

personalizzare tab woocommerce

Contenuto mancante

1- Disabilità ADS Block e ricarica la pagina

2- Ricarica la pagina

Commenta l'articolo

Bisogno di postare codice ? Usa un servizio gratuito come Codeshare altrimenti WordPress formatta male il codice!

Pin It on Pinterest

Condividi l'articolo. Grazie.

Vuoi essere aggiornato ?