Woocommerce Question posted in
The official Woocommerce documentation can be found here.

Woocommerce variable Price under title but retain from price until variable price has been selected

I am currently playing with the code in this post

https://stackoverflow.com/a/40120814

Which I know is very old code for a very old WP and Woo. So maybe there is a better way now.

However it does seem to work still, but I want to retain the From price below the title until the variation price is shown after the variables have been shown.

I have an additional code for doing a From-price

add_filter('woocommerce_variable_sale_price_html', 'custom_variation_price_format', 10, 2);
add_filter('woocommerce_variable_price_html', 'custom_variation_price_format', 10, 2);

function custom_variation_price_format($price, $product) {
    // Get the available variations prices
    $variation_prices = $product->get_variation_prices(true);

    // Get the minimum price
    $min_price = current($variation_prices['price']);
    $min_price_html = wc_price($min_price);

    // Add "From" before the price
    $price = sprintf(__('From: %s', 'woocommerce'), $min_price_html);

    return $price;
}

and then the combined code from the post as linked above

/** Hide Variable prices */
add_filter( 'woocommerce_variable_sale_price_html', 'bbloomer_variation_price_format', 10, 2 );

add_filter( 'woocommerce_variable_price_html', 'bbloomer_variation_price_format', 10, 2 );

function bbloomer_variation_price_format( $price, $product ) {

 if (is_product()) {
    return $product->get_price();
 } else {
        // Main Price
        $prices = array( $product->get_variation_price( 'min', true ), $product->get_variation_price( 'max', true ) );
        $price = $prices[0] !== $prices[1] ? sprintf( __( '%1$s', 'woocommerce' ), wc_price( $prices[0] ) ) : wc_price( $prices[0] );

        // Sale Price
        $prices = array( $product->get_variation_regular_price( 'min', true ), $product->get_variation_regular_price( 'max', true ) );
        sort( $prices );
        $saleprice = $prices[0] !== $prices[1] ? sprintf( __( '%1$s', 'woocommerce' ), wc_price( $prices[0] ) ) : wc_price( $prices[0] );

        if ( $price !== $saleprice ) {
        $price = '<del>' . $saleprice . '</del> <ins>' . $price . '</ins>';
        }
        return $price;
         }

}

// show variation price
add_filter('woocommerce_show_variation_price', function() {return true;});

//override woocommerce function
function woocommerce_template_single_price() {
    global $product;
    if ( ! $product->is_type('variable') ) { 
        woocommerce_get_template( 'single-product/price.php' );
    }
}

function shuffle_variable_product_elements(){
    if ( is_product() ) {
        global $post;
        $product = wc_get_product( $post->ID );
        if ( $product->is_type( 'variable' ) ) {
            remove_action( 'woocommerce_single_variation', 'woocommerce_single_variation', 10 );
            add_action( 'woocommerce_before_variations_form', 'woocommerce_single_variation', 20 );

            remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_title', 5 );
            add_action( 'woocommerce_before_variations_form', 'woocommerce_template_single_title', 10 );

            remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_excerpt', 20 );
            add_action( 'woocommerce_before_variations_form', 'woocommerce_template_single_excerpt', 30 );
        }
    }
}
add_action( 'woocommerce_before_single_product', 'shuffle_variable_product_elements' );

However what I want to do is retain the From price where it is but to replace it with the variable price after all the variations have been selected, hopefully my image explains that better.

Variation Price Position

Thanks

Tags:

2

Answers


  1. 0

    The following code snippet can do it. It is working fine on my website. If it does not work for you, you should try to change the variable and variation price classes.

    add_action( 'woocommerce_variable_add_to_cart', 'gs_change_variable_price' );
function gs_change_variable_price() {
    global $product;
    $price = $product->get_price_html();
    wc_enqueue_js( "     
        $(document).on('found_variation', 'form.cart', function( event, variation ) {   
            if(variation.price_html) {
                $('.summary > p.price').html(variation.price_html);
                $('.woocommerce-variation-price').hide();
            }
        });
        $(document).on('hide_variation', 'form.cart', function( event, variation ) {   
            $('.summary > p.price').html('" . $price . "');
        });
    " );
}
    Login or Signup to reply.
  2. 0

    First, you need to keep the product variable price displayed, so don’t use your function code woocommerce_template_single_price().

    As you want to keep the displayed variation price (like in your screenshot) and replace the variable product price with that displayed variation price (when all attributes are selected), use the following:

    add_action( 'woocommerce_before_variations_form', 'display_selected_variation_price' );
function display_selected_variation_price() {
    wc_enqueue_js( "const priceHTML = $('p.price').html();    
        $('form.variations_form').on('show_variation', function(event, data){   
            $('p.price').html(data.price_html);
        }).on('hide_variation', function() {   
            $('p.price').html(priceHTML);
        });
    " );
}

    If you want to replace the variable price with the selected variation price (when all attributes are selected) and hide the original selected variation displayed price, use:

    add_action( 'woocommerce_before_variations_form', 'display_selected_variation_price' );
function display_selected_variation_price() {
    echo '<style>.woocommerce-variation-price{display:none;}</style>';

    wc_enqueue_js( "const priceHTML = $('p.price').html();   
        $('form.variations_form').on('show_variation', function(event, data){   
            $('p.price').html(data.price_html);
        }).on('hide_variation', function() {   
            $('p.price').html(priceHTML);
        });
    " );
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search