Nuovo stile del pulsante del carrello quando l'articolo è nel carrello in WooCommerce
Utilizzo un codice che modifica il testo del pulsante "Aggiungi al carrello" per un prodotto se l'articolo è già nel carrello.
/* for single product */
add_filter( 'woocommerce_product_single_add_to_cart_text', 'single_product_button_text' );
function single_product_button_text( $text ) { if( WC()->cart->find_product_in_cart( WC()->cart->generate_cart_id( get_the_ID() ) ) ) { $text = 'Product in cart';
}
return $text; } /* for archive/category pages */ add_filter( 'woocommerce_product_add_to_cart_text', 'products_button_text', 20, 2 ); function products_button_text( $text, $product ) { if( $product->is_type( 'simple' )
&& $product->is_purchasable() && $product->is_in_stock()
&& WC()->cart->find_product_in_cart( WC()->cart->generate_cart_id( $product->get_id() ) ) ) { $text = 'Product in cart';
}
return $text;
}
Dimmi come puoi cambiare lo stile del pulsante "Aggiungi al carrello" per un prodotto se il prodotto è già stato aggiunto al carrello?
Ho provato ad aggiungere il codice al file /loop/add-to-cart.php come mostrato qui Cambia lo stile del pulsante Aggiungi al carrello quando il prodotto è nel carrello in Woocommerce ma non funziona per me.
Esistono altre opzioni di codice che potrebbero aiutare a risolvere la mia domanda?
Sarò felice per il tuo aiuto!
Risposte
Un modo è controllare jQuery
se un certo elemento (il tuo pulsante aggiungi al carrello) contiene un certo testo, se questo è il caso, aggiungeremo una classe extra che puoi modellare tramite CSS
.
Selettore: contiene () - Seleziona tutti gli elementi che contengono il testo specificato.
Quindi ottieni:
function action_wp_footer() {
?>
<script>
jQuery(document).ready(function($) { var selector = '.add_to_cart_text:contains("Product in cart")'; // Selector contains specific text if ( $( selector ).length > 0 ) {
$( selector ).addClass( 'product-is-added' ); } else { $( selector ).removeClass( 'product-is-added' );
}
});
</script>
<?php
}
add_action( 'wp_footer', 'action_wp_footer' );
Nota: il selettore (classe) può essere denominato in modo diverso a seconda del tema che stai utilizzando