给Woocommerce产品详情页面增加多个选项卡内容介绍

阿里云优惠活动

什么是Woocommerce?

woocommerce

WooCommerce是一个面向全球企业家的开源,完全可定制的电子商务平台。超越传统电子商务解决方案的范围,仅限于您自己的想象力。

Woocommerce官网:https://woocommerce.com/

我们利用Woocommerce做在线商城的时候,产生的产品介绍详情页通常只有两个选项卡:Description(描述)和Reviews(评论)。

Woocommerce产品介绍页面只有两个选项卡

如果产品介绍内容较多的话可能会造成页面会很长,那么我们该怎么实现多个选项卡来展现内容呢?

在这里我们需要借助一款插件:Woocommerce tab manager

官方介绍页面:https://woocommerce.com/products/woocommerce-tab-manager/

相似插件:https://cn.wordpress.org/plugins/yith-woocommerce-tab-manager/

下载完成后,我们进行插件安装,并启用。

插件使用方法:

启用后您会发现在左侧菜单栏Woocommerce下会出现Tab Manager

Tab Manager

点进去我们会看到有三个选项:

Tab Manager设置三个选项
  • Tabs:选项卡(展示已添加的选项卡)
  • Add Global Tab:添加新的选项卡(可添加新的公共选项卡)
  • Default Tab Layout :默认选项卡布局(可对现有选项卡布局进行更改)

进入我们的产品列表,选择其中一个产品进行编辑

进入产品列表
对产品进行编辑

进入页面后会有产品介绍编辑,编辑的下方会有产品数据一项,里面包含:常规、库存、配送、属性等,当然还有最下面的一个:Tabs,这个就是我们要添加选项卡的地方。

这里可以进行选项卡板块的删除、添加、以及是否覆盖默认选项卡布局等等。

我们这里进行测试,添加了内容测试一、内容测试二两项,进行效果的测试。

测试效果

保存后最终页面的效果如下所示,多选项卡已实现。

多选项卡鲜果

关于利用插件实现Woocommerce产品详情页面增加多个选项卡内容介绍的教程就介绍到这里,如有问题请在下方进行评论,谢谢!