Mostrar percentatge de descompte en Woocommerce

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() &amp;&amp; ! is_admin() &amp;&amp; ! $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!