WooCommerce: come eliminare, rinominare e riordinare i tab delle pagine prodotto.

ATTENZIONE: questo articolo è stato scritto oltre un anno fa, ed i contenuti potrebbero non essere più validi o compatibili. Sei pregato di tenerne conto, e se hai informazioni in merito di segnalarmele, grazie.

Come personalizzare i tab delle pagine prodotto di WooCommerce

Le pagine prodotto di WooCommerce mostrano le informazioni suddivise in 3 tab, o linguette che dir si voglia, che in versione italiana appaiono etichettate come: “Descrizione”, “Informazioni aggiuntive” e “Recensioni”. In questo preciso ordine.

La seconda a dire il vero non è sempre presente, è dinamica, e appare solo quando ci sono le condizioni giuste di prodotto.

Alle volte è necessario modificare questa struttura, vediamo quindi come sia possibile eliminare o rinominare uno o più tab prodotto, o cambiarne l’ordine.

Ci vuole uno snippet, facile facile.

I codici che seguono vanno aggiunti al file functions.php del tema in uso, come al solito è sempre consigliabile utilizzare un tema child in WordPress.

Gli snippet che seguono si rifanno dalla documentazione ufficiale di WooCommerce, e sono testati con WooCommerce 2.1.x.

1. Eliminare uno o più tab nelle pagine prodotto di WooCommerce.

È possibile eliminare uno o più tab nella pagina prodotto di WooCommerce, utilizzando lo snippet che segue.

add_filter( 'woocommerce_product_tabs', 'woo_remove_product_tabs', 98 );

function woo_remove_product_tabs( $tabs ) {

    unset( $tabs['description'] );      	// Rimuove il tab Descrizione
    unset( $tabs['reviews'] ); 			// Rimuove il tab Recensioni
    unset( $tabs['additional_information'] );  	// Rimuove il tab Informazioni Aggiuntive

    return $tabs;

}

Occorre fare riferimento alle righe dalla 5 alla 7, utilizzando solo la riga che ci interessa. Ad esempio, se ci interessa rimuovere il tab “Recensioni” occorre modificare lo snippet lasciando la riga 6, e rimuovendo le righe 5 e 7.

Se invece vogliamo eliminare i tab “Descrizioni” e “Informazioni Aggiuntive”, lasciando solo il tab “Recensioni” nella pagina prodotto, bisogna lasciare nello script le righe 5 e 7, e togliere la riga 6.

2. Cambiare nome ad uno o più tab nelle pagine prodotto di WooCommerce.

Come per lo snippet precedente, se si vuole rinominare uno o più tab della pagina prodotto di WooCommerce, basta modificare lo snippet che segue lasciando solo le righe che ci interessano, tra la 5 e la 7.

add_filter( 'woocommerce_product_tabs', 'woo_rename_tabs', 98 );

function woo_rename_tabs( $tabs ) {

	$tabs['description']['title'] = __( 'Nuovo nome tab Descrizione' );		// Rinomina il tab Descrizione
	$tabs['reviews']['title'] = __( 'Nuovo nome tab Recensioni' );				// Rinomina il tab Recensioni
	$tabs['additional_information']['title'] = __( 'Nuovo nome tab Informazioni Aggiuntive' );	// Rinomina il tab Informazioni Aggiuntive

	return $tabs;

}

Si intuisce facilmente a quale tab si riferisce ogni riga, il nuovo nome del tab va inserito al posto delle stringhe “Nuovo nome tab…”.

3. Cambiare ordine dei tab nelle pagine prodotto di WooCommerce.

L’ordine predefinito dei tab delle pagine prodotto di WooCommerce è il seguente:

  1. Descrizione
  2. Informazioni aggiuntive
  3. Recensioni

È possibile cambiare l’ordine predefinito utilizzando questo snippet:

add_filter( 'woocommerce_product_tabs', 'woo_reorder_tabs', 98 );
function woo_reorder_tabs( $tabs ) {

	$tabs['reviews']['priority'] = 5;			// Mette il tab Recensioni al primo posto
	$tabs['description']['priority'] = 10;			// Mette il tab Descrizione al secondo posto
	$tabs['additional_information']['priority'] = 15;	// Mette il tab Informazioni Aggiuntive al terzo posto

	return $tabs;
}

Un valore più piccolo di priority assegna il primo posto al tab, il valore più grande l’ultimo.
I commenti inseriti nello snippet possono aiutare a comprenderne meglio la logica, se viene utilizzato come proposto il nuovo ordine dei tab sarà:

  1. Recensioni
  2. Descrizione
  3. Informazioni aggiuntive

Lo stesso snippet può essere utilizzato anche con i tab aggiuntivi eventualmente presenti.

Tags: , , , ,

46 Risposte a “WooCommerce: come eliminare, rinominare e riordinare i tab delle pagine prodotto.”

  1. PepPeCoL 28 Giu 2015 at 00:58 #

    Salve, cercavo qualcosa di simile però non è questo.
    Mi spiego quando apro il prodotto in defaul mi va su Recensioni invece in default vorrei che andasse su descrizione

    • Roberto Rota 28 Giu 2015 at 17:09 #

      Ciao, è la prima volta che sento un problema del genere, non vorrei che fosse il tema utilizzato a condizionare questa situazione perché non l’ho mai vista da nessuna parte.
      Di solito il primo tab è quello che si apre di default, e di solito è la descrizione prodotto.
      rob

      • peppecol 28 Giu 2015 at 17:27 #

        il tema da me usato è Nielsen

        • Roberto Rota 28 Giu 2015 at 17:39 #

          Vedo dalla demo che in effetti il tema di default mostra il tab recensioni, bizzarra scelta…
          Non conosco il tema, nella pagina di configurazione del singolo prodotto c’è nulla a riguardo?

          rob

          • peppecol 28 Giu 2015 at 17:51 #

            pare di no! se ti vuoi fare un giro ti dò accesso

            • Roberto Rota 28 Giu 2015 at 17:53 #

              Ad ogni modo, ciò che determina la visualizzazione di questo o quel tab per primo è la priorità, evidentemente il tema la cambia a suo piacere.
              Se non ci fossero settaggi dedicati nella configurazione del tema, puoi intervenire tramite snippet, tipo questo:

              add_filter( 'woocommerce_product_tabs', 'woo_reorder_tabs', 98 );
              function woo_reorder_tabs( $tabs ) {

              $tabs['reviews']['priority'] = 5; // Reviews first
              $tabs['description']['priority'] = 10; // Description second
              $tabs['additional_information']['priority'] = 15; // Additional information third

              return $tabs;
              }

              Ovviamente nell’esempio viene assegnata la maggior priorità alle recensioni, mentre tu dovresti modificarla per le descrizioni.
              Dovrebbe funzionare
              rob

              • peppecol 28 Giu 2015 at 18:09 #

                ho inserito lo snippet ma non è cambiato nulla!

                • Roberto Rota 28 Giu 2015 at 18:12 #

                  Ma l’hai modificato invertendo la priorità dei primi due?

                  Se sì, allora il tema una una sua funzione che riesce a dare una priorità maggiore, bisognerebbe guardare il codice del tema.

                  Ultima spiaggia, chiedere agli sviluppatori che conoscono bene le funzioni inserite nel tema.

                  rob

  2. peppecol 28 Giu 2015 at 18:58 #

    ho cambiato ma quando apro la scheda per un’attimo esce descrizione e poi passa a commenti

    • Roberto Rota 28 Giu 2015 at 19:13 #

      Rimuovi lo snippet, il settaggio che cerchi è nelle preferenze del tema.

      rob

      • PepPeCoL 28 Giu 2015 at 21:23 #

        [RISOLTO] Show reviews tab opened (Say if you want to show reviews tab opened instead of description tab (Default: On) Impostato su OFF

  3. davide 20 Ago 2015 at 17:17 #

    Grazie mille per lo snippet! Ha funzionato perfettamente, però mi sono scomparsi i link social.
    possibile?
    Grazie
    Davide

    • Roberto Rota 20 Ago 2015 at 17:40 #

      Ciao Davide, non capisco cosa c’entrino i tab con social link, indipendentemente da chi li generi non ci dovrebbe essere alcun legame.

      rob

      • davide 26 Ago 2015 at 17:22 #

        Ciao Roberto ,
        non c’entrano nulla effettivamente, sto facendo un po’ di esperimenti.
        erano spariti per altre cause
        grazie mille
        davide

  4. Christopher.Palmieri 2 Ott 2015 at 11:43 #

    Ciao, grazie per l’ottimo lavoro svolto! Un domanda… Come poter aggiungere del testo “fisso” nella sezione INFORMAZIONI AGGIUNTIVE? Avrei bisogno di una porzione di testo sempre visibile in ogni prodotto e sarebbe scomodo creare un falso attributo NOTE. Grazie!

    • Roberto Rota 2 Ott 2015 at 12:41 #

      Ciao Christopher, mi cogli impreparato perché è una cosa che finora non mi ha mai chiesto nessuno.

      Provo a documentarmi appena ho tempo, se scopro qualcosa ti aggiorno.

      Roberto

  5. Fabio 12 Nov 2015 at 17:56 #

    Buonasera Roberto, ho provato ad inserire alla fine del file functions.php lo script e già da dreamweaver mi da errore poi quando sostituisco il file originario mi scompare la pagina. woocommerce 2.4.10 cosa ho bagliato?

    • Fabio 12 Nov 2015 at 18:21 #

      Così funziona, sono andato a naso, non sono un programmatore, il sito sembra funzionare tutto:

      add_filter( ‘woocommerce_product_tabs’, ‘sb_woo_remove_reviews_tab’, 98);
      function sb_woo_remove_reviews_tab($tabs) {
      unset($tabs[‘reviews’]);
      unset($tabs[‘description’]);
      unset($tabs[‘additional_information’]);
      return $tabs;
      }

      Ora bisogna vedere se non ha intaccato qualcosa che non noto

      • Roberto Rota 13 Nov 2015 at 10:31 #

        Farò qualche verifica, anche se lo stesso script lo sto usando in diverse installazioni, Grazie a te per il feedback 😉

        rob

  6. chiara 27 Gen 2016 at 11:46 #

    Io vorrei duplicare il tab principale del sito che ho comprato , poichè l’impostazione grafica mi piace molto. Non è possibile suddividere gli attributi nei diversi tab?

    • Roberto Rota 27 Gen 2016 at 20:19 #

      La gestione dei Tab nelle pagine dei prodotti WooCommerce è un tantinello complessa, come anche quella degli attributi.

      Magari è fattibile, ma la vedo dura…

      rob

  7. ale 24 Feb 2016 at 13:04 #

    Ciao, io ho bisogno di poter visualizzare i contenuti dei tab in sezioni nella pagina del prodotto. Quindi come posso modificare la modalità tab di woocommerce rendendo i contenuti visibili subito senza cliccare le tab? Grazie mille.

    • Roberto Rota 24 Feb 2016 at 14:36 #

      Ciao Ale,

      con alcuni temi è una funzione offerta nei settaggi.

      In teoria c’è la possibilità di rimuovere l’action che genera i tab tramite snippet, ma poi bisogna integrare i contenuti dei tab nella pagina del singolo prodotto. Se fai una ricerca veloce in rete la trovi subito.

      C’è però da dire che alcuni temi, che intervengono direttamente nei template e nei loop di woocommerce, non reagiscono bene a queste operazioni.

      rob

  8. Francesca 20 Set 2016 at 18:58 #

    Ciao,
    ma se io volessi semplicemente non mostrare il peso del prodotto che viene inserita nella tab informazioni aggiuntive? Ovviamente se la elimino, tolgo anche quello che vorrei invece che l’utente vedesse.

    Grazie

    • Roberto Rota 20 Set 2016 at 22:35 #

      Ciao Francesca, bella domanda.
      Ho fatto una ricerca veloce in rete ed ho visto che ci sono filtri per togliere le informazioni su peso e dimensioni, ma non ho trovato niente solo per il peso.

      rob

      • Francesca 21 Set 2016 at 08:37 #

        Ciao Roberto, grazie per la risposta!
        Potresti indicarmelo? Eventualmente posso eliminare anche le dimensioni. Diciamo che non reputo necessario che il cliente li veda.

        Grazie

        • Roberto Rota 21 Set 2016 at 08:51 #

          Certo, però non ho potuto verificarlo:

          add_filter( 'wc_product_enable_dimensions_display', '__return_false' );

          rob

      • Francesca 21 Set 2016 at 09:29 #

        È quello che trovato anch’io questa mattina spulciando in rete.
        Sembrerebbe funzionare.

        Grazie Rob!

  9. Alessandro Rosadini 7 Nov 2016 at 16:08 #

    vorrei modificare in griglia l’immagine prodotto… cioè vorrei mettere un cambio foto sul hover… sai mica qual’è il php che devo andarmi a modificare?… lo cerco da giorni…

    • Roberto Rota 7 Nov 2016 at 16:48 #

      Ciao Alessandro, dipende molto dal tema che stai utilizzando, molti personalizzano template e loop di woocommerce per le loro esigenze.

      rob

      • Claudio 7 Gen 2017 at 15:24 #

        ciao io invece ho un “problema” diverso vorrei che i campi addizionali fossero visibili direttamwnte dopo la descrizione del prodotto.. è possibile fare una modifica del genere?
        sto creando un negozio di libri e quindi vorei che campi come autore, numero pagine lingia ecc mi fossero subito disponibili ….e se posse possibile anche ricercabili!!!

        • Roberto Rota 9 Gen 2017 at 11:34 #

          Ciao Claudio, i campi addizionali (o custom fields) sono una cosa diversa, è facile realizzarli ma la loro visualizzazione in punti precisi è un pochino più complicata, bisogna intervenire nel loop di generazione della pagina prodotto e qualche tema ci mette del suo a complicare la vita.

          rob

  10. ELENA 14 Gen 2017 at 18:40 #

    Ciao, scusami ho un problema che non riesco a risolvere. Nei messaggi automatici di woocommerce, ad esempio ” rimosso. Annullare?” quando si rimuove un prodotto dal carrello, il link “annullare” non manda a niente, anzi non è proprio cliccabile. Da dove si possono modificare questi messaggi? Ho provato a cerca ma non ho trovato niente… grazie mille

    • Roberto Rota 14 Gen 2017 at 19:00 #

      Ciao Elena, da quello che mi dici sembra più un problema legato al tema, o a qualche conflitto con qualche altro plugin, bisognerebbe verificare.

      rob

      • ELENA 14 Gen 2017 at 19:32 #

        Provo a disattivare qualche plugin?

        • Roberto Rota 16 Gen 2017 at 10:23 #

          È una strada, vai per esclusione magari riesci a beccare quello che ti da noia.

          rob

  11. ELENA 16 Gen 2017 at 16:03 #

    Grazie per la risposta, comunque ho provato a disattivare praticamente tutti i plugin ma non sono riuscita a risolvere il problema, quindi ho provveduto a non far vedere più quel messaggio. Grazie mille per l’attenzione. Buon lavoro.

  12. maurizio 14 Mar 2017 at 08:55 #

    Pur modificando correttamente l’etichetta con il nome personalizzato, rimane la scritta “Descrizione prodotto” inserita nella scheda. Hai per caso qualche idea di come eliminarla? Grazie

    • Roberto Rota 14 Mar 2017 at 14:01 #

      Sono due cose ben distinte, il titolo lo puoi eliminare via css o con questo filtro per il file functions.php:

      add_filter( 'woocommerce_product_description_heading', 'remove_product_description_heading' );
      function remove_product_description_heading() {
      return '';
      }

  13. graffafette 26 Giu 2017 at 13:59 #

    Questo filtro elimina solo la scritta nella scheda “descrizione”. Per eliminare anche le altre ho improvvisato…

    add_filter( ‘woocommerce_product_description_heading’, ‘remove_product_description_heading’ );
    function remove_product_description_heading() {
    return ”;
    }

    add_filter( ‘woocommerce_product_reviews_heading’, ‘remove_product_reviews_heading’ );
    function remove_product_reviews_heading() {
    return ”;
    }

    add_filter( ‘woocommerce_product_additional_information_heading’, ‘remove_product_additional_information_heading’ );
    function remove_product_additional_information_heading() {
    return ”;
    }

    È corretto? Funziona solo per due schede e non per l’ultima… 🙁

    • Roberto Rota 26 Giu 2017 at 15:01 #

      Le virgolette e gli apici sono tipografichi, lo sono anche nello script? Potrebbe essere quello il problema.

      O forse puoi provare a sostituire return'' con echo''

      rob

  14. graffafette 27 Giu 2017 at 11:12 #

    grazie! controllo… alla fine, poi, ho deciso di mantenere solo il tab descrizione… ho paura che si incasini tutto… 😛

  15. riccardo 29 Giu 2017 at 12:29 #

    salve, dentro il mio woocommerce vorrei mettere di fianco al numerino dei prodotti disponibili un testo come faccio?

    • Roberto Rota 30 Giu 2017 at 09:26 #

      Ciao Riccardo, non mi hanno m ai chiesto niente di simile, dovrei documentarmi.

      Se scopro qualcosa ti faccio sapere.

      rob

  16. Roberto 12 Ott 2017 at 23:31 #

    Ciao Roberto,
    ho bisogno di un info, com’è possibile che nella pagina prodotto ci sia un H2 fisso con la parola “Descrizione”??? come posso fare per rimuoverlo ???
    Ti ringrazio per il supporto.
    grazie Roberto

    • Roberto Rota 13 Ott 2017 at 12:08 #

      Ciao, hai due strade:

      1. tramite css, con un bel display:none per “.woocommerce-tabs .panel h2”

      2. tramite snippet php, ora non ce l’ho sottomano
      ma dovrei averlo postato in qualche articolo qui nel blog, comunque se fai una ricerca in rete lo trovi facilmente.

      rob

Dubbi o suggerimenti? Lascia un commento!

I love Instagram