Chr*_*hvh 1 html css php wordpress woocommerce
Wordpress版本: 4.6.1
Woocommerce版本: 2.6.4
使用标准的woocommerce时,您可以添加具有不同价格值的可变产品.Woocommerce显示该产品低于产品标题的最低和最高价格.像这样:€50 - €100
我将以下代码添加到我的functions.php文件中以禁用变量产品的此行为:
/** 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' );
}
}
Run Code Online (Sandbox Code Playgroud)
这一切都运作良好.但现在可变价格显示在产品选项下方,如下图所示.我想在标题下方显示可变价格.
可变产品: 150欧元是选择颜色和尺寸的结果.选择这些值后,价格会显示在变化之下.我希望这个变化价格显示在标题下方,就像一个简单的产品.
我花了好几个小时才发现它是如何做到的,但我发现的唯一一件事就是改变了woocommerce-core文件.这不是一个选项,因为需要更新woocommerce.
UPDATE
解决@Amy Ling的困惑.我不希望显示最低或最高价格.我需要标题下方显示的当前变化的价格.例如:鞋子是红色的,尺码30 => 150欧元,鞋子是红色的,尺码40 => 170欧元等.额外的图像:
除了您拥有的代码,请将以下内容添加到主题functions.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' );
Run Code Online (Sandbox Code Playgroud)
说明
使这些元素变得稍微复杂的问题是变量产品是动态的,价格元素是用JavaScript操纵的\woocommerce\assets\js\frontend\add-to-cart-variation.js.这个价格元素是动态放置的<div class="woocommerce-variation single_variation">,必须保留在变体的<form>'variations_form'类元素中.
所以,我对这些操作所做的就是将价格移到表单的顶部,因为它必须保留在表单中.然后我从表单上方删除了标题和摘录,并将其添加回表单内部.
这些行为也可能出现在价格之上.
我上面改变的动作足以满足我解决这个问题的主题.但是,其他一些函数woocommerce_single_product_summary包括:
woocommerce_template_single_ratingwoocommerce_template_single_metawoocommerce_template_single_sharingwoocommerce_template_single_price (您已经使用自己的代码有效地处理了这个问题根据您的主题和您使用的WooCommerce设置,可能还需要删除这些设置并将其添加回woocommerce_before_variations_form操作.