Come modificare la posizione del prezzo nel template di prodotto Woocommerce

wordpress e woocommerce

Woocommerce è un plugin molto potente per trasformare WordPress in un vero e proprio ecommerce: si possono creare cataloghi di prodotti, inserendo una miriade di dati come prezzi, modalità di spedizione, sconti, etc. Considerate le enormi possibilità che offre il plugin, non è una sorpresa il fatto che il suo codice, ad esempio guardando ai file contenuti nella cartella “templates” abbia una struttura decisamente più ermetica del semplice html. Questo è il motivo per cui molti siti, alle spalle dei quali non ci sono veri e propri sviluppatori, mantengono la struttura di default.

Se per modificare l’aspetto di ogni singolo elemento (ad esempio il titolo, la descrizione e il prezzo del prodotto) è sufficiente agire sul css, modificare la posizione di ognuno di essi non ha nulla a che vedere con <div> da tagliare e incollare più in alto o più in basso nel file di template. Al contrario, trattandosi di Woocommerce, modifiche di questo tipo richiedono di intervenire con delle “action”, azioni che richiamano l’inserimento di questi elementi all’interno del template.

Il codice per modificare la posizione del prezzo nella pagina di prodotto

Guardando il codice del file content-single-product.php possiamo ricavare un importante indizio sugli elementi del prodotto, che vengono inseriti nel template (e quindi mostrati ai visitatori del sito) secondo una precisa scaletta, ognuno con una sua priorità.

* @hooked woocommerce_template_single_title - 5
* @hooked woocommerce_template_single_rating - 10
* @hooked woocommerce_template_single_price - 10
* @hooked woocommerce_template_single_excerpt - 20
* @hooked woocommerce_template_single_add_to_cart - 30
* @hooked woocommerce_template_single_meta - 40
* @hooked woocommerce_template_single_sharing - 50
do_action( 'woocommerce_single_product_summary' ); ?

Gli elementi, se presenti, verranno mostrati dal primo all’ultimo secondo quest’ordine. Nell’impostazione di default il prezzo si trova sotto al titolo, ma immaginiamo di volerlo spostare sotto la descrizione, prima del pulsante per aggiungere il prodotto al carrello.

Abbiamo allora bisogno di inserire, all’interno del file functions.php del nostro tema, due diverse azioni: la prima indirizzata a rimuovere l’elemento prezzo e la seconda a reinserirlo con una nuova priorità. Per la posizione desiderata il numero adatto è 25, che si trova esattamente tra la priorità 20 dell’excerpt e 30 del pulsante “aggiungi al carrello”.

Codice per rimuovere il prezzo:

remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_price', 10 );

Codice per ripristinare il prezzo con la nuova priorità:

add_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_price', 25 );

Ovviamente i due codici devono essere compresi entro i tag <?php e ?>

Articoli collegati

Lascia un commento

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