萨龙网络
登录
首页-WordPress文章-WooCommerce,WordPress-正文

在 WordPress 主题中编辑器 WooCommerce 产品选项卡-tabs

萨龙龙萨龙龙
WooCommerce, WordPress
4年前
0
0
3.06W
WooCommerce 产品页面默认有3个选项卡:描述,其它信息和评论,对于很多 WordPress 主题或许不太适合,需要修改或者添加选项卡。WooCommerce 官方文档已经给出了详细的文档: 需要将代码添加到主题functions.php文件。 1、删除选项卡
/**
 * 删除产品数据选项卡
 */
add_filter( 'woocommerce_product_tabs', 'woo_remove_product_tabs', 98 );

function woo_remove_product_tabs( $tabs ) {

    unset( $tabs['description'] );      	// 删除描述
    unset( $tabs['reviews'] ); 			// 删除评论
    unset( $tabs['additional_information'] );  	// 删除其它信息

    return $tabs;
}
2、重命名选项卡
/**
 * 重命名选项卡
 */
add_filter( 'woocommerce_product_tabs', 'woo_rename_tabs', 98 );
function woo_rename_tabs( $tabs ) {

	$tabs['description']['title'] = __( '产品详情' );		// 重命名描述
	$tabs['reviews']['title'] = __( '产品评论' );			// 签名评论
	$tabs['additional_information']['title'] = __( '产品参数' );	// 签名其它信息

	return $tabs;

}
3、更改选项卡顺序
/**
 * 更改选项卡顺序
 */
add_filter( 'woocommerce_product_tabs', 'woo_reorder_tabs', 98 );
function woo_reorder_tabs( $tabs ) {

	$tabs['reviews']['priority'] = 5;			// 评论第一
	$tabs['description']['priority'] = 10;			// 描述第二
	$tabs['additional_information']['priority'] = 15;	// 其它信息第三

	return $tabs;
}
4、自定义选项卡内容
/**
 * 自定义选项卡内容
 */
add_filter( 'woocommerce_product_tabs', 'woo_custom_description_tab', 98 );
function woo_custom_description_tab( $tabs ) {

	$tabs['description']['callback'] = 'woo_custom_description_tab_content';	// 自定义描述回调

	return $tabs;
}
/**
 * 选项卡内容
 */

function woo_custom_description_tab_content() {
    echo '<h2>Custom Description</h2>';
    echo '<p>Here\'s a custom description</p>';
}
5、添加自定义选项卡
/**
 * 添加一个自定义选项卡
 */
add_filter( 'woocommerce_product_tabs', 'woo_new_product_tab' );
function woo_new_product_tab( $tabs ) {
	
	// 添加一个新选项卡
	
	$tabs['test_tab'] = array(
		'title' 	=> __( '名称', 'woocommerce' ),
		'priority' 	=> 50,
		'callback' 	=> 'woo_new_product_tab_content'
	);

	return $tabs;

}
/**
 * 选项卡内容
 */
function woo_new_product_tab_content() {

// The new tab content

echo '<h2>New Product Tab</h2>';
echo '<p>Here\'s your new product tab.</p>';

}
6、附加信息选项卡 “附加信息”选项卡仅在产品设置了重量、尺寸或属性,并选中“在产品页面上可见”时才会显示。如果在产品没有重量、尺寸或属性时,尝试对该选项卡更改,将出现类似于以下的错误消息:
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 条件判断:
has_attributes()
has_dimensions()
has_weight()
比如此段代码:
/**
 * 检查产品是否有属性、尺寸或重量
 */
add_filter( 'woocommerce_product_tabs', 'woo_rename_tabs', 98 );

function woo_rename_tabs( $tabs ) {

	global $product;
	
	if( $product->has_attributes() || $product->has_dimensions() || $product->has_weight() ) {
		$tabs['additional_information']['title'] = __( '产品参数' );	// 重命名附加信息选项卡
	}
 
	return $tabs;
 
}
有了这些代码,稍作修改,定制选项卡易如反掌。
标签:
本文原创,作者:萨龙龙,其版权均为萨龙网络所有。
如需转载,请注明出处:https://salongweb.com/wordpress-woocommerce-change-product-tabs.html
萨龙龙

萨龙龙

侠客
一个平平常常的人,热爱生活、旅行和摄影,骑行去过西藏,一直计划再去。14年从江西骑行来到大理,现栖居于洱海边,食人间烟火,过简单生活,做简约设计!
1342.11M346.31W3.40W
分享:
WordPress 主题禁用古滕堡编辑器和小工具
WordPress 主题禁用古滕堡编辑器和小工具上一篇
WordPress 主题获得评论深度的2种方法下一篇
WordPress 主题获得评论深度的2种方法
相关文章
总数:107

WordPress自定义文章类型支持古腾堡编辑器(Gutenberg)

Gutenberg,WordPress最新的编辑器,每个模块都是一个blocks的形式。默认的编辑文章页面是支持 Gutenberg编辑…
萨龙龙萨龙龙
WordPress
6年前
0
0
1.32W
0

移除 WooCommerce 商城插件编辑产品中的产品数据相关 tabs

WooCommerce插件默认为编辑产品页面提供了产品数据TABS,默认包括:常规、库存、配送、联锁产品、属性、高级等模块,功能强大而实用。…
萨龙龙萨龙龙
WooCommerce
7年前
0
0
1.25W
0

WordPress按角色获取可分页的用户列表并显示最新文章

最近开发了一款多功能的新闻视频类Wordpress主题Yewan,客户的网站用户也比较多,要求设计一个按权限(管理员、编辑、作者、投稿者、订阅者…
萨龙龙萨龙龙
WordPress
9年前
0
0
1.20W
0

WordPress 主题禁用古滕堡编辑器和小工具

WordPress4.9.8版本就发布了古滕堡编辑器,很好用,添加文章也比经典编辑器方便很多。在5.8版本后又在小工具中增加了古滕堡编辑…
萨龙龙萨龙龙
WordPress
4年前
0
0
1.46W
0

WordPress 功能函数—— addslashes_gpc(添加斜杠以转义字符串)

描述 添加斜杠以转义字符串。 如果设置了magic_quotes_gpc,将首先删除斜杠。 用法 …
萨龙龙萨龙龙
WordPress Functions
6年前
0
0
7.97K
0

WordPress添加标签相关文章简码

自从了解到WordpressMU多站点,就开始一步一步的向多站点发展,也将萨龙网络所有站点都安装在WordpressMU多站点中。在使用多站…
萨龙龙萨龙龙
WordPress
9年前
0
0
8.71K
0

WooCommerce商城首页获取自定义字段

WooCommerce商城首页默认被插件转换成归档页面archive-product.php,但是添加的依然是页面,所以通过get_post_m…
萨龙龙萨龙龙
WooCommerce
8年前
0
0
1.14W
0

WordPress 重置缩略图插件 Regenerate Thumbnails 获取媒体数量时错误的解决方法

WordPress一键重置缩略图使用相当简单方便,设置了媒体中要裁剪的缩略图参数(使用了WooCommerce商城插件,需要在外观——自定…
萨龙龙萨龙龙
WordPress
7年前
0
0
9.93K
0

WordPress MU多站点网络共享媒体插件Network Shared Media的使用包括特色图像

WordPressMU虽然是一个程序下可以创建多个站点,但每个站点下的文章、页面、媒体等还是独立的,MU也为不同的站点分配了不同的媒体目录。N…
萨龙龙萨龙龙
WordPress
10年前
0
0
1.74W
0

WordPress 判断是否在循环中的函数 in_the_loop

WordPress主题开发中,很多时间需要在文章与列表中进行判断从而输出不同的内容,比如文章分类,只想在列表中显示,文章中不显示。列表页面可直…
萨龙龙萨龙龙
WordPress
7年前
0
0
9.89K
0

让SI CAPTCHA Anti-Spam插件支持WooCommerce注册表单验证码

萨龙网络使用的主题Purity最新版本弃用了Buddypress社区插件,这样注册表单只能使用WooCommerce商城自带的,验证码还是使用S…
萨龙龙萨龙龙
WooCommerce, WordPress
9年前
0
0
1.55W
0

WordPress获取优酷视频缩略图

很多网站的视频都是来自在线视频网站,这样即节省网站空间也带来更高的访问速度,优酷视频是使用较多的。在添加视频文章时我们都想直接获取视频中的缩略图…
萨龙龙萨龙龙
WordPress
9年前
0
0
1.16W
0