最近在帮一个客户制作tob站点的时候,他提了一个要求,就是在他的产品页面,它需要添加很多的表格,在我们的独立站里面,不管是在我们的产品页面,还是在我们的文章编辑界面,怎么样去插入表格呢?

WordPress如何插入Table表格:

实际上在我们的独立站里面去插入表格是有很多种方法。

古腾堡方式插入表格:

我们现在进入的 wordpress的古腾堡界面。

WP-Table-manager-1-古腾堡插入表格

在古腾堡里面我们去搜索table,表格就是table,我们看到默认情况下,古腾堡就是支持表格的插入的,你直接可以把这个表格插入进来,然后去修改里面的内容,比如说我们这里设置一个5行,5列的表格,5列5行,然后点击创建,这个表格就已经创建成功了,非常的简单。

导入电脑表格数据:

第二种方法,比如说你用的是WPS或者是office,你在本地创建了一个Excel表格,你可以把Excel表格里面需要在我们的页面上面显示的内容,把那几个表复制完以后直接在这里粘贴就行了,它也可以直接生成表格的方式。

Html标签插入表格:

第三种方法,如果你稍微了解一些html,我们就可以在代码模式下面,然后直接在这里去手写对吧?

WP-Table-manager-2-html表格标签

我们可以写上一个 table的开始标签,table的结束标签,然后如果我们想创建行行里面,它其实就是tr,行里面的列就是td,我们就可以去创建这种行和列用代码去写,当然其实只是简单的标签,你可以用那种标签的方式去写几个文字,写完以后,然后我们把它切换到可视化模式,它也可以生成一个表格儿,但是这种方式实际上对于完全不懂前端的或者是我们的客户而言,这个是比较困难的。

WP Table manager插件方式:

我们这一节课要给大家讲的是另外一种方法,就是通过一个插件的方式快速去实现。在任何页面去插入表格,我们要给大家分享的是我对比过很多个表格插件以后,最终给大家选定的一个叫wp table manager这个插件非常强大,我们首先去看一下它所实现的效果。

WP-Table-manager-3-价格列表风格

第一个就是我们经常看到的价格列表,假如说你的站点里面有一些会员体系,你需要去别人去购买,你就可以去创建这种会员列表。然后另外一种也是一种简单的会员列表,另外一种方式的。

WP-Table-manager-4-作息表表格格式

我们再看一下其他的下面一个就是我们经常看到的这种作息表,它也是可以创建的,比如说周一到周日等等,实际上它就是一个表格,这是我们的横排以及我们的竖排显示出来就这种效果。

WP-Table-manager-5-普通表格

下面一个也是一样的,然后我们看到一些常规的表格,就是我们经常使用到的这种表格,这个表格里面它还有一些其他的额外的功能,比如说我们可以在这个表格里面直接进行排序。

还有一种就是在我们的手机端,它会有一个兼容的状态,就是响应式的正常的表格,你在手机端如果很宽的话,它是显示不全的,这个时候我们就可以去设置一下,比如说我们设置为收缩的一种模式,只显示我们的标题,然后后面的值就直接你点击才能够显示出来。

WP-Table-manager-6-滚动分页

另外一种方法就是在下面去添加一个滚动栏,用户先看到左边的部分,如果他想看全就往右去滚动就行了。现在我们看到这样的一个表,这个表就很长,所以他就加了一个滚动栏。另外如果你的表里面的内容特别的多,它还可以进行分页,所以这个表就非常的强大,我们就用这种表为大家去讲解怎么样在我们的独立站里面去插入表格。

WP Table manager插件功能介绍:

在使用之前我们还是简单的先去看一下这个插件它的一些功能,也就是它的特点。

支持office365在线同步:

WP-Table-manager-7-office365

第一个就是它可以和在线的office365,如果你使用的微软的一个会员,使用的是office365,这个Excel表格实际上它是在线可以访问到的,所以可以和我们的 word press同步,比如说你在office365里面去修改了数据,在word press里面也会随之改变,如果你是通过这种方式去插入的,第二种方式就是它可以把一些表格,比如说谷歌的一些表格,包括我们在本地使用的一些表格直接进行插入,这样的话就不需要你一行一列的进行创建了。

兼容页面构建器:

下面一个功能就是它去兼容各种的页面构建器,比如说我们所熟知的elementorDIVI,这种都是在element这样的页面构建器里面,你直接可以使用这样的一个功能。当然它和我们的古腾堡,包括我们的经典编辑器也都是兼容的。

表格插件管理权限:

然后另外这个表格你也可以给它设置一些权限,比如说只有管理员才能够去创建,另外它也可以兼容我们主题的风格,你创建的表格它会跟着你主题的主要的风格然后随之改变。

表格插件筛选功能:

我们可以去加一些筛选,我们刚才看到的这种效果你可以进行筛选,可以排序。

另外就是针对我们的一些数据文件,它也可以一键把它转换成表格。然后下面一个就是它可以你创建的每一个表格它都有一个简码,你可以把这个简码放在任何位置,包括我们的页面当中,包括我们更新的文章产品等等,任何位置都可以去添加好。这就是它所介绍的功能,当然每一个表格里面你也可以去插入图片等等的一些内容,包括移动兼容等等它的一些核心的功能,这个插件我们已经给大家准备好了。

WP Table manager插件安装:

下面我们就给大家去演示一下这个插件的使用。

首先我们进入我们的插件列表安装插件,当插件安装成功以后,我们激活插件,好现在我们就完成了这个插件的安装,安装成功以后在我们的功能按钮里面,我们就可以看到这样的一个插件的功能。

WP-Table-manager-8-内容插入表格功能

当然我们在文章里面,比如说我们现在去发布一个产品,产品的按钮里面我们也可以看到创建表格的按钮,比如说在这里我们可以看到有一个 wp table manager,当然在我们的古腾堡里面,甚至在我们的elementor页面构建器里面都会出现这样的模块,所以非常的方便。

首先去看一下这个插件它的一些功能,首先第一个就是All tables,我们后期创建的所有的表它都会存放在这个位置,当然在这里你也可以给它创建分类目录,把每一个表都放在不同的目录里面,比如说我们不同类目的产品,我们就放在不同的分类里面,这样就可以方便我们后期进行管理。

WP Table manager插件设置:

下面首先我们去看一下它的设置,它的设置实际上是非常简单的,首先我们看一下主要设置,第一个就是允许导入导出我们的表格,刚才我们已经给大家讲过了,它可以允许我们本地的Excel表格,包括谷歌的Excel表格直接导入到我们的wordpress里面,当然你也可以把这些表格导出去。

WP-Table-manager-9-插件设置

然后另外就是导入的文件,它支持什么样的版本,这个就是office的版本,然后还有一些其他的设置,比如说表格的自动保存,自动创建新的表格编辑表格等等,这些我们都可以默认就行了,包括它默认的一些颜色格式,你可以选一个你喜欢的表格,然后创建出来它就是这种效果,当然这表格的颜色你可以完全自定义,完全符合你自己的主题风格。当然还有一些其他的我们可以不用管它,就是你删除了以后把这些数据也删除等等,这些我们不用管它。

WP-Table-manager-10-货币时间格式

下面如果你的表格里面加入的是有一些货币,有一些价格,它用的货币单位你也可以把它修改一下,比如说这里用的是美元,然后它显示的位置前后我们都可以去添加,包括小数点等等,包括我们的日期格式,还有就是我们的字体,目前它使用的是谷歌字体,但是如果你有本地字体,你可以把你的本地字体在这里上传,你表格里面所添加的文字都会调用这个字体。

下面一项就是针对我们的用户权限,比如说针对管理员的,可以去创建分类目录,也可以去编辑分类目录,当然也可以去创建表格等等。

另外其他的像我们的编辑等等不同的权限,你都可以给它设置不同的一些功能。然后下面一个就是它的翻译这个表格它也是支持翻译的。

最后一个我们可以看到我们目前激活的一个PHP版本,目前这个插件已经是激活的状态,所以你直接可以进行使用好。

这就是关于wp table manager这个插件的安装和设置,下一节课我们会给大家去讲解一下,怎么样去创建表格。

声明:本站分享的WordPress主题/插件均遵循 GPLv2 许可协议(免费开源),相关介绍资料仅供学习参考,实际版本可能会因版本迭代或开发者调整而产生变化,如程序中涉及有第三方原创图像、设计模板、远程服务等内容,应获得作者授权后方可使用。本站不提供该程序/软件的产品授权与技术服务,亦不收取相关费用。