请选择 进入手机版 | 继续访问电脑版

黑贸论坛

微信扫一扫 分享朋友圈

已有 1275 人浏览分享

开启左侧

对WooCommerce产品页TAB选项卡进行增删改

[复制链接]
1275 9
本帖最后由 小米虾 于 2021-3-18 12:09 编辑

首先,需要将以下对应的代码添加到主题或子主题下的functions.php文件中,或者通过允许添加自定义功能的插件(例如代码片段等相关插件)添加。请不要将自定义代码直接添加到父主题的functions.php文件中,因为当您更新主题时,该代码将被完全删除。


1.要删除指定TAB选项卡中的标签,代码如下:
  1. /**
  2. * 删除产品TAB选项卡
  3. */
  4. add_filter( 'woocommerce_product_tabs', 'woo_remove_product_tabs', 98 );
  5. function woo_remove_product_tabs( $tabs ) {

  6.     unset( $tabs['description'] );                         //删除描述的项选卡
  7.     unset( $tabs['reviews'] );                               //删除评论的项选卡
  8.     unset( $tabs['additional_information'] );      //删除附加信息的选项卡【这个应该用的比较多】
  9.     return $tabs;
  10. }
复制代码
2.对TAB选项卡标签进行命名,代码如下:

  1. /**
  2. * 重命名产品TAB选项卡
  3. */
  4. add_filter( 'woocommerce_product_tabs', 'woo_rename_tabs', 98 );
  5. function woo_rename_tabs( $tabs ) {

  6.         $tabs['description']['title'] = __( 'More Information' );               //重命名描述的项选卡
  7.         $tabs['reviews']['title'] = __( 'Ratings' );                                      //重命名评论的项选卡
  8.         $tabs['additional_information']['title'] = __( 'Product Data' );    //重命名附加信息的选项卡
  9.         return $tabs;
  10. }
复制代码
3.重新排序产品TAB选项卡
,代码如下:
  1. /**
  2. * 重新排序产品TAB选项卡
  3. */
  4. add_filter( 'woocommerce_product_tabs', 'woo_reorder_tabs', 98 );
  5. function woo_reorder_tabs( $tabs ) {

  6.         $tabs['reviews']['priority'] = 5;                               // 将评论选项卡排在第一
  7.         $tabs['description']['priority'] = 10;                       // 描述标签排在第二
  8.         $tabs['additional_information']['priority'] = 15;    // 附加信息排在最后
  9.         return $tabs;
  10. }
复制代码
4.添加一个新的产品TAB选项卡
,代码如下:
  1. /**
  2. * 添加一个新的产品TAB选项卡
  3. */
  4. add_filter( 'woocommerce_product_tabs', 'woo_new_product_tab' );
  5. function woo_new_product_tab( $tabs ) {
  6.         
  7.         // Adds the new tab
  8.         
  9.         $tabs['test_tab'] = array(
  10.                 'title'         => __( '新的选项卡名称', 'woocommerce' ),
  11.                 'priority'         => 50,
  12.                 'callback'         => 'woo_new_product_tab_content'  // 这里是写对应的新选项卡对应内容的函数名称,不明白,可直接复制即可
  13.         );

  14.         return $tabs;

  15. }

  16. //这里是写对应的新选项卡对应内容的函数具体内容
  17. function woo_new_product_tab_content() {

  18.         // 这里可以输出具体的内容,以下是PHP代码格式,echo表示输出的意思,可按格式对应的添加多行HTML代码内容,需要一定的代码基础
  19.         echo '<h2>New Product Tab</h2>';
  20.         echo '<p>Here\'s your new product tab.</p>';
  21.         
  22. }
复制代码


已有 1 人打赏作者

黑贸君 赏了楼主50金钱

评论 9

旧街古巷  注册会员  发表于 2020-10-18 19:50:59 | 显示全部楼层
感谢虾总分享非常受用,刚刚最近为这个苦恼

举报 使用道具

回复
Kinglong VIP会员 永久VIP  版主  发表于 2020-10-18 19:54:06 来自手机  | 显示全部楼层
虾总这个牛。很实用

举报 使用道具

回复
麦子 VIP会员 年费VIP会员  实习版主  发表于 2020-10-18 20:37:02 | 显示全部楼层
刚好自己最近也在研究WOOCOMMERCE,感谢虾总的贴心分享
窃钩者诛,窃国者侯

举报 使用道具

回复
黑贸君 VIP会员 永久VIP  管理员  发表于 2020-10-18 23:04:04 | 显示全部楼层
虾总辛苦!

举报 使用道具

回复
STay VIP会员 永久VIP  版主  发表于 2020-10-19 11:16:42 | 显示全部楼层
666,虾总牛皮

举报 使用道具

回复
efuny VIP会员 年费VIP会员  黑贸VIP  发表于 2020-10-20 10:35:38 | 显示全部楼层
谢谢虾总

举报 使用道具

回复
大飞 VIP会员 年费VIP会员  黑贸VIP  发表于 2021-4-21 10:32:31 | 显示全部楼层
非常实用,收藏了,默认的tab都是左右叠加(折叠)的, 有什么代码可以改成上下连续(非折叠)的呢

默认(左右折叠):
描述|评论|附加信息

改成(上下非折叠):
描述
评论
附加信息

举报 使用道具

回复
小竹子 VIP会员 年费VIP会员  黑贸VIP  发表于 2021-5-21 11:18:51 | 显示全部楼层
学习了,虽然现在不会用到,但记下来,讲不定以后会用到。谢谢分享。

举报 使用道具

回复
cloudly VIP会员 年费VIP会员  黑贸VIP  发表于 2021-5-25 10:26:09 | 显示全部楼层
虾总yyds

举报 使用道具

回复
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

0

关注

0

粉丝

15

主题
精彩推荐
热门资讯
推荐阅读
  • 微信公众平台

  • 扫描访问手机版

QQ|Archiver|手机版|小黑屋|黑贸论坛 |网站地图

GMT+8, 2021-7-31 14:11 , Processed in 0.190749 second(s), 33 queries .

Powered by Blackhat520

Copyright © 2001-2021