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!