免费Tablepress插件教程：如何在WordPress中添加表格？修复中文乱码？

在使用WordPress制作网站的时候，

经常会需要在网站页面的某些部分添加表格形式的内容。

因为table表格形式的内容能够清晰明了地向网站访客呈现产品或者服务的一些相关参数信息，

所以越来越多电商网站都喜欢在woocommerce产品详情页中添加表格内容。

WordPress有一款强大且免费的表格插件叫做tablepress，

这款WordPress插件能够让你快速建立或者导入现成的表格到网站中，

并且支持你进行自定义设计表格样式。

在这篇文章中，

WP花园将会教你如何在WordPress中添加表格形式的内容，

让你的网站有更多丰富的内容参数展现形式，

吸引更多客户下单或者询盘！

什么是tablePress插件

Tablepress插件是WordPress网站中运用最多、功能最强大的一款免费的表格生成和制作插件。

通过使用tablepress，

你能够非常轻松地在WordPress网站上创建和管理精美的表格，

你可以将表格们嵌入到WordPress的页面page、文章post或者产品products的页面中。

不仅如此，

你甚至可以将tablepress生成的表格放入到WordPress的小工具widget中，

在侧边栏或者网页底部展示表格。

对于WordPress建站的新手来说，

你不需要懂得任何HTML或者CSS代码，

可以按照excel的方式轻松地在网站上创建表格。

简单说，tablepress有以下特色：

• 轻松在网站上创建表格
• 从电脑中导入CSV、JSON格式表格
• 表格数据可以筛选或者排序
• 可以将表格嵌入到网站的很多地方
• 手机版访问表格也效果不错~

在WordPress的后台中，找到plugin插件版块，搜索和安装tablepress插件，激活就能使用了！

官方文档：

https://tablepress.org/documentation/

下载地址：

https://wordpress.org/plugins/tablepress/

安装完表格之后，

你会在WordPress后台的侧边栏中多出了一个tablepress的栏目，

这里可以看到您网站中创建过的所有表格：

使用tablepress创建一个新表格

如果你的表格内容不是很多，

可以直接在WordPress后台使用tablepress直接创建一个新的表格：

点击【新建表格】之后，你会看到这个页面，

填写一些表格基本信息：

点击创建表格之后，你会看到这个页面：

表格ID为44，这个建议不要修改。

然后你会看到简码为【table id=44 /】（记得把【】换成[ ]），

通过复制这个简码，

然后粘贴到网页中你想呈现表格的位置，

就能在WordPress网页前台展示这个表格了！

我们简单填充一些内容到表格中，

点击保存：

通过复制表格的简码到任何一篇文章中，

保存文章：

就能在WordPress的网页前台看到表格的样式了：

可以看到这个表格就非常清晰地展现在网站访客的面前！

简单好用，

有没有？

WordPress就是那么强大！

在tablepress中导入表格

在很多真实的建站项目中，

往往客户已经准备好了某些产品资料的表格内容。

而且这些表格往往内容比较多，

不可能在WordPress的后台一个一个地输入这些数据，因为实在太繁琐啦！

Tablepress也很贴心地添加了表格导入功能！

在WordPress后台中，

选择【导入表格】

这时候，

你会看到系统提示你导入CSV格式的表格。

我们打开WPS或者excel，

将一个表格另存为CSV格式，

然后导入到WordPress中：

有些情况下，

你会发现导入的表格里中文内容为乱码：

这时候，

你要使用windows电脑自带的【记事本】来打开你导出的CSV文件：

然后在左上角的菜单栏，选择另存为：

格式选择UTF-8，

并且改一个名字，

以免你记错。

再用相同的方式导入到WordPress后台。

即便是txt格式的文件，

也能选择CSV格式，

然后点击导入。

这时候就解决了乱码问题了：

也是非常简单，有没有？

省下了你大量的时间来一个一个输入数据了！

真开心~

Tablepress表格分页设置

我们看一下刚才导入的表格，

这个表格数据非常多，

一共有138行的数据：

那么在前台是如何展示的呢？

我们惊奇地发现，

表格居然自动分页了！

什么鬼，

我希望网站上全部展示表格所有数据，

怎么办？

我们回到表格的编辑页面，

在datatables javascript库特性中，

取消勾选分页功能：

再看一眼网站前台，

就发现所有表格内容都呈现出来了：

我们再看看tablepress中，

还有哪些可以让网页设计师修改和测试的属性吧。

表格操作版块

在这个版块中，

网页设计师可以选择对表格的单元格进行增加或者删除的操作，

也可以在某些单元格内加入图片或者链接等等操作：

大家可以自己做一下测试，看看能怎么编辑和改动。

表格选项版块

在这个栏目中，

可以对表格进行一些全局的样式设计，

特别是背景颜色的交替显示以及表格名称的展示方式等等：

如果有特殊样式需求，可以在这里改动一下看看效果。

DataTables Javascript库特性版块

这里的内容就比较复杂了，涉及到很多网站访客在使用表格的时候一些互动操作：

• 网站访客自行排序表格
• 网站访客搜索表格内容
• 表格分页设置
• 表格水平滚动条

通过设置这个版块的内容，可以增加表格的交互效果！

WP花园的结语

表格数据越来越受到电商朋友的欢迎，

所以我们要认真学习如何添加表格到WordPress网站中，

增加网站的数据丰富程度。

WP花园在为客户使用WordPress开发B2C独立商城的时候，

经常会需要将表格添加到商品的详情页中，

所以非常熟悉tablepress这个插件。

好的表格数据有利于帮助WordPress网站提升SEO排名和用户体验感！

如果你在使用tablepress插件中遇到问题，

欢迎给我们留言！