Return to previous page

Move Variant Prices Up to top of single item page

This topic has 3 replies, 2 voices, and was last updated 5 years, 5 months ago ago by Rose Tyler

seanseansean

Participant

June 8, 2019 at 00:10

Hello,

How can I display variant Item prices at the top of the single item page underneath the Product title?

Please, contact administrator
for this information.

#215229 Copied Theme version: Latest Version WooCommerce version: Latest Version

2 Answers

seanseansean

Participant

June 8, 2019 at 01:27

I found some code to utilize but it is causing the quantity to jump, do you have a bettery solution?

Code below
`//// 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( 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( wc_price( $prices[0] ) ) : wc_price( $prices[0] );

if ( $price !== $saleprice && $product->is_on_sale() ) {
$price = ‘~~‘ . $saleprice . $product->get_price_suffix() . ‘~~ <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;
}

#215230 Copied

Rose Tyler

Support staff

June 8, 2019 at 09:48

Hello,

Sorry, but additional customization in files is not included in basic support.
Feel free to ask if you have any other questions.

Regards

#215251 Copied
Viewing 3 results - 1 through 3 (of 3 total)