1. 陈健豪博客首页
  2. WordPress

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

首先我们来看下什么是Woocommerce?

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

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

通常我们利用Woocommerce做在线商城的时候,产生的产品介绍详情页只有两个选项卡。

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

如果产品介绍内容较多的话可能会造成页面会很长,那么我们该怎么实现多个选项卡来展现内容呢?在这里我们需要借助一款插件:woocommerce tab manager

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

本站下载链接:woocommerce-tab-manager.zip

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

插件使用方法:

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

Tab Manager

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

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

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

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

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

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

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

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

测试效果

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

多选项卡鲜果

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

版权声明:本文为博主原创文章,遵循 CC BY-NC-SA 4.0 版权协议,转载请附上原文出处链接和本声明。

本文链接:https://chenjianhao.com/13332.html

发表评论

登录后才能评论