wordpress建DTC独立站为产品添加价格区间选择
建站知识 2024年11月17日 11
要在WordPress中为DTC独立站的产品添加价格区间选择功能，可以通过以下步骤实现：
添加自定义字段：首先，需要在产品后台添加一个自定义字段，用于设置价格区间的最大值。这可以通过添加代码到子主题的 `function.php` 文件来实现。如果没有子主题，则添加到主主题的 `function.php` 文件中。以下是添加自定义字段的代码示例：
// Add a custom field for price range to product in backend
add_action( 'woocommerce_product_options_pricing', 'add_field_product_options_pricing' );
function add_field_product_options_pricing() {
global $post;
echo '<div class="options_group show_if_simple">';
woocommerce_wp_text_input( array(
'id' => '_max_price_for_range',
'label' => __('Max price for range', 'woocommerce').' ('.get_woocommerce_currency_symbol().')',
'placeholder' => __('Set the max price for range', 'woocommerce'),
'description' => __('Set the max price for range, to activate it…', 'woocommerce'),
'desc_tip' => 'true',
));
echo '</div>';
}
// Save product custom field to database when submitted in Backend
add_action( 'woocommerce_process_product_meta', 'save_product_options_custom_fields', 30, 1 );
function save_product_options_custom_fields( $post_id ){
// Saving custom field value
if( isset( $_POST['_max_price_for_range'] ) ){
update_post_meta( $post_id, '_max_price_for_range', sanitize_text_field( $_POST['_max_price_for_range'] ) );
}
}前端显示价格区间：接下来，需要在前端显示这个价格区间。这可以通过添加一个过滤器来修改产品价格的显示方式来实现。以下是相关的代码示例：
// Frontend: display a price range when the max price is set for the product
add_filter( 'woocommerce_get_price_html', 'custom_range_price_format', 10, 2 );
function custom_range_price_format( $price, $product ) {
// Only for simple product type
if( $product->is_type('simple') ){
// Get the max price for range
$max_price = get_post_meta( $product->get_id(), '_max_price_for_range', true );
if( empty($max_price) )
return $price; // exit
$active_price = wc_get_price_to_display( $product, array( 'price' => $product->get_price() ) );
$price = sprintf( '%s – %s', wc_price($active_price), wc_price($max_price) );
}
return $price;
}编辑和查看价格区间：在WordPress后台编辑产品时，你可以在“Product Data”部分找到“General”标签页，设置产品的“Regular Price”和“Max Range Price”。保存后，前端页面将显示产品的价格区间。
以上步骤可以帮助你在WordPress的DTC独立站中为产品添加价格区间选择功能。请确保在添加代码时，你已经备份了网站，以防万一需要恢复。如果你不熟悉代码操作，建议联系专业的开发人员进行操作。
