De forma predeterminada en Woocommerce es mostra un senzill text d’ “Oferta” als productes amb descompte. Per generar més conversions, podem afegir uns “snippets” de codi per a millorar aquest aspecte i que es visualitze el percentatge de descompte i la quantitat de diners que s’estalvien els nostres clients.
Per fer-ho, senzillament afegim aquests codis al nostre “functions.php”, preferiblement en un tema fill, per a no perdre els canvis.
// Añadir dto y porcentaje de dto en Woocommerce add_filter( 'woocommerce_get_price_html', 'change_displayed_sale_price_html', 10, 2 ); function change_displayed_sale_price_html( $price, $product ) { if( $product->is_on_sale() && ! is_admin() && ! $product->is_type('variable')){ $regular_price = (float) $product->get_regular_price(); $sale_price = (float) $product->get_price(); $saving_price = wc_price( $regular_price - $sale_price ); $precision = 1; $saving_percentage = round( 100 - ( $sale_price / $regular_price * 100 ), 1 ) . '%'; $price .= sprintf( __('<br><small><span class="snippet-dto-ahorro">Ahorras:</span> <span class="snippet-dto-precio">%s</span> <span class="snippet-dto-porcentaje">(%s)</span></small>', 'woocommerce' ), $saving_price, $saving_percentage ); } return $price; }
Li donem estil:
/* snippet dto precio */ span.snippet-dto-porcentaje { color: #ff0d0d; } span.snippet-dto-ahorro { color: #3c3c3c; } span.snippet-dto-precio { color: #ff0d0d; }
I amb aquest altre modifiquem el bàner d'”Oferta” i el substituïm per la quantitat de descompte:
add_filter( 'woocommerce_sale_flash', 'anadir_etiqueta_de_porcentaje_producto', 20, 3 ); function anadir_etiqueta_de_porcentaje_producto( $html, $post, $product ) { if( $product->is_type('variable')){ $percentages = array(); // Coge los precios variables $prices = $product->get_variation_prices(); // Muestra el descuento en productos variables foreach( $prices['price'] as $key => $price ){ // Solo en ventas variables if( $prices['regular_price'][$key] !== $price ){ // Calculamos el porcentaje en función de la variación $percentages[] = round(100 - ($prices['sale_price'][$key] / $prices['regular_price'][$key] * 100)); } } $percentage = max($percentages) . '%'; } else { $regular_price = (float) $product->get_regular_price(); $sale_price = (float) $product->get_sale_price(); $percentage = round(100 - ($sale_price / $regular_price * 100)) . '%'; } return '<span class="onsale">' . esc_html__( 'Ahorras un', 'woocommerce' ) . ' ' . $percentage . '</span>'; }
Gràcies a Diego Nieto pel codi!