阿里国际站VIP群:挖掘高端运营技巧和黑科技
亚马逊市场调研工具:挖掘你的亚马逊利基产品

WooCommerce设置B2B网站的产品区间价展示

分类: wordpress建站教程 作者: 为主的祥助 223次浏览 6评论

Woocommerce是Wordpress CMS建站程序的一个开源的电子商务插件。它是为使用WordPress的小型或大型在线商城而设计的。该插件于2011年9月27日发布,因其易于安装和定制以及免费的基础产品而迅速流行。
有些朋友是使用portfolio作品集方式来发布B2B产品,也有些是朋友使用Woocommerce这个商城系统+WC Catalog Enquiry或其他询盘插件来发布B2B产品。那么如何给Woocommerce发布的产品设置B2B的区间价展示样式呢

添加代码

使用宝塔面板或FTP连接工具,打开子主题的目录,如/wp-content/themes/babystreet-child,编辑目录下的function.php文件。

如果主题没有自带子主题,那就打开主题目录,编辑function.php文件,添加如下代码后保存

<pre class="wp-block-code"><code>// 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 '&lt;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 '&lt;/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&#91;'_max_price_for_range'] ) ){
        update_post_meta( $post_id, '_max_price_for_range', sanitize_text_field( $_POST&#91;'_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 &amp;ndash; %s', wc_price($active_price), wc_price($max_price) );
    }
    return $price;
}</code></pre>

编辑区间价

进入Woocommerce-products,选择产品进行编辑,拖动页面到product date-general,这里就可以设置regular price和max range price了。

woocommerce产品区间价

查看区间价

如果使用了缓存插件以及CDN建议刷新一下插件和CDN的缓存,让CDN重新从源站获取实时数据,再去访问产品的前台页面,就能看到显示的区间价了

更多运营干货,扫码加入
跨境E站知识星球
为主的祥助的知识星球
版权申明:跨境E站,版权所有丨如未注明,均为原创丨本网站采用BY-NC-SA协议进行授权
          转载请注明本文作者和原文链接: https://www.yunglobe.com/woocommerce-product-price-range.html

转载请注明:跨境E站 » WooCommerce设置B2B网站的产品区间价展示

微信 OR 支付宝 扫描二维码
请站长 喝杯星巴克
pay_weixinpay_weixin微信公众号
知识付费,金额随意 小主的支持是本站运营的动力!~
喜欢 (3)or分享 (0)
发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
(6)个小伙伴在吐槽
  1. 给力!谢谢分享!
    跨境电商之家2019-12-17 10:54 回复
  2. 我复制下来并且添加到了对应的文件,但是提示错误: syntax error, unexpected '<', expecting end of file
    路人甲2020-06-29 10:23 回复
    • 你的代码里多出了这个符号,检查一下是哪里不对,看看代码编辑器的提示
      为主的祥助2020-06-29 19:48 回复
      • 感谢您的回复,我按照代码一一对照,但是仍然提示相同的错误。
        路人甲2020-07-01 21:50 回复
QQ群
  • 阿里巴巴国际站数据化运营 阿里巴巴国际站数据化运营
  • Wordpress外贸建站交流群 Wordpress外贸建站交流群
微信号
  • 备注外贸建站或阿里国际站,拉你进对应的微信群
QQ咨询
  • 为主的祥助 点击这里给我发消息