wordpress网站woocommerce产品增加tabs切换菜单的方法

WooCommerce 产品页面默认有3个选项卡：描述，其它信息和评论，对于很多 WordPress 主题或许不太适合，需要修改或者添加选项卡。WooCommerce 官方文档已经给出了详细的文档：

需要将代码添加到主题functions.php文件。

1、删除选项卡

1. /**
2. * 删除产品数据选项卡
3. */
4. add_filter( ‘woocommerce_product_tabs’, ‘woo_remove_product_tabs’, 98 );
5.  
6. function woo_remove_product_tabs( $tabs ) {
7.  
8. unset( $tabs[‘description’] ); // 删除描述
9. unset( $tabs[‘reviews’] ); // 删除评论
10. unset( $tabs[‘additional_information’] ); // 删除其它信息
11.  
12. return $tabs;
13. }

2、重命名选项卡

1. /**
2. * 重命名选项卡
3. */
4. add_filter( ‘woocommerce_product_tabs’, ‘woo_rename_tabs’, 98 );
5. function woo_rename_tabs( $tabs ) {
6.  
7. $tabs[‘description’][‘title’] = __( ‘产品详情’ ); // 重命名描述
8. $tabs[‘reviews’][‘title’] = __( ‘产品评论’ ); // 签名评论
9. $tabs[‘additional_information’][‘title’] = __( ‘产品参数’ ); // 签名其它信息
10.  
11. return $tabs;
12.  
13. }

3、更改选项卡顺序

1. /**
2. * 更改选项卡顺序
3. */
4. add_filter( ‘woocommerce_product_tabs’, ‘woo_reorder_tabs’, 98 );
5. function woo_reorder_tabs( $tabs ) {
6.  
7. $tabs[‘reviews’][‘priority’] = 5; // 评论第一
8. $tabs[‘description’][‘priority’] = 10; // 描述第二
9. $tabs[‘additional_information’][‘priority’] = 15; // 其它信息第三
10.  
11. return $tabs;
12. }

4、自定义选项卡内容

1. /**
2. * 自定义选项卡内容
3. */
4. add_filter( ‘woocommerce_product_tabs’, ‘woo_custom_description_tab’, 98 );
5. function woo_custom_description_tab( $tabs ) {
6.  
7. $tabs[‘description’][‘callback’] = ‘woo_custom_description_tab_content’; // 自定义描述回调
8.  
9. return $tabs;
10. }
11. /**
12. * 选项卡内容
13. */
14.  
15. function woo_custom_description_tab_content() {
16. echo ‘<h2>Custom Description</h2>’;
17. echo ‘<p>Here\’s a custom description</p>’;
18. }

5、添加自定义选项卡

1. /**
2. * 添加一个自定义选项卡
3. */
4. add_filter( ‘woocommerce_product_tabs’, ‘woo_new_product_tab’ );
5. function woo_new_product_tab( $tabs ) {
7. // 添加一个新选项卡
9. $tabs[‘test_tab’] = array(
10. ‘title’ => __( ‘名称’, ‘woocommerce’ ),
11. ‘priority’ => 50,
12. ‘callback’ => ‘woo_new_product_tab_content’
13. );
14.  
15. return $tabs;
16.  
17. }
18. /**
19. * 选项卡内容
20. */
21. function woo_new_product_tab_content() {
22.  
23. // The new tab content
24.  
25. echo ‘<h2>New Product Tab</h2>’;
26. echo ‘<p>Here\’s your new product tab.</p>’;
27.  
28. }

6、附加信息选项卡

“附加信息”选项卡仅在产品设置了重量、尺寸或属性，并选中“在产品页面上可见”时才会显示。如果在产品没有重量、尺寸或属性时，尝试对该选项卡更改，将出现类似于以下的错误消息：

1. Warning: call_user_func() expects parameter 1 to be a valid callback, no array or string given in /mysite/wp–content/plugins/woocommerce/templates/single–product/tabs/tabs.php on line 35

在这种情况下，必须使用 WooCommerce 条件判断：

1. has_attributes()
2. has_dimensions()
3. has_weight()

比如此段代码：

1. /**
2. * 检查产品是否有属性、尺寸或重量
3. */
4. add_filter( ‘woocommerce_product_tabs’, ‘woo_rename_tabs’, 98 );
5.  
6. function woo_rename_tabs( $tabs ) {
7.  
8. global $product;
10. if( $product->has_attributes() || $product->has_dimensions() || $product->has_weight() ) {
11. $tabs[‘additional_information’][‘title’] = __( ‘产品参数’ ); // 重命名附加信息选项卡
12. }
14. return $tabs;
16. }

参考上面的代码修改成你想要的各种tabs内容。