Modificare il pulsante “Aggiungi al carrello” in WooCommerce

Non sei stanco di leggere su ogni e-commerce sempre le stesse diciture standard e di default? E allora perché non dare un tocco di originalità al tuo WooCommerce, modificando il testo del pulsante “Add to cart” a tuo piacimento? Ecco come dare libero sfogo alla tua creatività, con pochissime righe di codice!
- Leggi l'articolo, ti bastano solo 3 minuti, 15 secondi
Sei di fretta? Scarica il PDF e consultalo quando vuoi!
Sommario
1 Modificare il testo del pulsante: il loop |
2 Modificare il testo del pulsante: la pagina prodotto |
3 Modifica condizionale del testo |
4 Commenti |
Modificare il testo del pulsante: il loop
Se desideri agire solamente sul testo del pulsante presente su ciascuno dei prodotti visualizzati nelle pagine di categoria o nelle pagine archivio, o in qualsiasi pagina sia presente un elenco di prodotti, apri con un editor di testo il file functions.php del tuo tema, che trovi nello spazio FTP del tuo sito, in:
wp-content/themes/{nome_del_tema}/
ed aggiungi il seguente snippet:
// Modifica il testo del pulsante di acquisto nel loop add_filter( 'woocommerce_product_add_to_cart_text', function( $text, $product ) { return __( 'I want to buy it!', 'woocommerce' ); }, 10, 2 );
ed ecco il risultato:
Modificare il testo del pulsante: la pagina prodotto
Ti starai chiedendo: e se invece volessi cambiare il testo del pulsante solamente nella pagina del singolo prodotto, è possibile?
Certo, che lo è, vediamo come fare.
Apri con un editor di testo il file functions.php del tuo tema, che trovi nello spazio FTP del tuo sito, in:
wp-content/themes/{nome_del_tema}/
ed aggiungi il seguente snippet:
// Modifica il testo del pulsante di acquisto nella pagina del singolo prodotto add_filter( 'woocommerce_product_single_add_to_cart_text', function( $text, $product ) { return __( 'I want to buy it!', 'woocommerce' ); }, 10, 2 );
ed il gioco è fatto:
Da notare che lo snippet è lo stesso, ma cambia l’hook su cui andiamo ad applicare il filtro: woocommerce_product_add_to_cart_text nel caso di prodotti presenti nel loop, woocommerce_product_single_add_to_cart_text nel caso di singola pagina prodotto.
Modifica condizionale del testo
Ma cosa succede se volessi personalizzare il testo solamente per un determinato tipo di prodotto?
Ipotizziamo infatti di voler avere un testo diverso per ogni tipo diverso di prodotto (semplice, grouped, esterno, variabile) e voler diversificare le etichette dei pulsanti per ciascuno di loro, è possibile? Sì, anche in questo caso si può!
È sufficiente modificare leggermente gli snippets precedenti, aggiungendo una condizione che verifichi la tipologia di prodotto (nell’esempio, consideriamo il primo caso: il loop):
// Modifica il testo del pulsante di acquisto a seconda del tipo di prodotto add_filter( 'woocommerce_product_add_to_cart_text', function( $text, $product ) { switch ( $product->get_type() ) { case 'simple' : return __( 'I want to buy it!', 'woocommerce' ); break; case 'variable': return __( 'Let me choose!', 'woocommerce' ); break; case 'external': return __( 'Take me to product!', 'woocommerce' ); break; case 'grouped' : return __( 'I want to buy them!', 'woocommerce' ); break; default : return __( 'Add to cart!', 'woocommerce' ); break; } }, 10, 2 );
Avrai così etichette diverse per i pulsanti delle diverse tipologie di prodotto presenti nel tuo e-commerce:
Ciao come faccio con css a cambiare il colore di sfondo del pulsante aggiungi al carrello da violetto a grigio?