Move the variation price location in WooCommerce

Question

I'm have started building an e-shop in Wordepress with WooCommerce plugin.

I added some products with variations and I noticed that the price is displayed after attributes select fields.

Is it possible to move the price between Title and short description as for simple products?

The url of one product is: http://www.roubinisideas.com/test2/product/uncategorized/vintage/

Answer 1

Update (on January 2018): avoiding availability repetitions (bug solved)

This is possible and it's is based on this answer that I have maid:

Here I have updated the jQuery code to take into account when a variation is set by default for a variable product.

Here is the code:

// removing the price of variable products
remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_price', 10 );

// Change location of
add_action( 'woocommerce_single_product_summary', 'custom_wc_template_single_price', 10 );
function custom_wc_template_single_price(){
    global $product;

    // Variable product only
    if($product->is_type('variable')):

        // Main Price
        $prices = array( $product->get_variation_price( 'min', true ), $product->get_variation_price( 'max', true ) );
        $price = $prices[0] !== $prices[1] ? sprintf( __( 'From: %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( __( 'From: %1$s', 'woocommerce' ), wc_price( $prices[0] ) ) : wc_price( $prices[0] );

        if ( $price !== $saleprice && $product->is_on_sale() ) {
            $price = '<del>' . $saleprice . $product->get_price_suffix() . '</del> <ins>' . $price . $product->get_price_suffix() . '</ins>';
        }

        ?>
        <style>
            div.woocommerce-variation-price,
            div.woocommerce-variation-availability,
            div.hidden-variable-price {
                height: 0px !important;
                overflow:hidden;
                position:relative;
                line-height: 0px !important;
                font-size: 0% !important;
                visibility: hidden !important; 
            }
        </style>
        <script>
            jQuery(document).ready(function($) {
                // When variable price is selected by default
                setTimeout( function(){
                    if( 0 < $('input.variation_id').val() && null != $('input.variation_id').val() ){
                        if($('p.availability'))
                            $('p.availability').remove();

                        $('p.price').html($('div.woocommerce-variation-price > span.price').html()).append('<p class="availability">'+$('div.woocommerce-variation-availability').html()+'</p>');
                        console.log($('div.woocommerce-variation-availability').html());
                    }
                }, 300 );

                // On live variation selection
                $('select').blur( function(){
                    if( 0 < $('input.variation_id').val() && null != $('input.variation_id').val() ){
                        if($('.price p.availability') || $('.price p.stock') )
                            $('p.price p').each(function() {
                                $(this).remove();
                            });

                        $('p.price').html($('div.woocommerce-variation-price > span.price').html()).append('<p class="availability">'+$('div.woocommerce-variation-availability').html()+'</p>');
                        console.log($('input.variation_id').val());
                    } else {
                        $('p.price').html($('div.hidden-variable-price').html());
                        if($('p.availability'))
                            $('p.availability').remove();
                        console.log('NULL');
                    }
                });
            });
        </script>
        <?php

        echo '<p class="price">'.$price.'</p>
        <div class="hidden-variable-price" >'.$price.'</div>';

    endif;
}

Code goes in any php file of your active child theme (or theme) or also in any plugin php file.

This code is tested and works on WooCommerce 3+ (should work on WooCommerce 2.6.x too)

---

related: Replace the Variable Price range by the chosen variation price in WooCommerce 3