上次我试着在我的WordPress博客上添加一个表格，最后我把整个事情都废了，改用一个要点列表。

听起来很熟悉吧？

许多令人惊叹的WordPress主题都具有创建漂亮的表格的能力。 当然，它们最初可能看起来不错，但你不能用它们做什么。

想要可过滤的数据吗？ 不。

想让表格具有移动响应性吗？ 不。

想从CSV中导入数据？ 不可能。

这里有一个好消息：

有了合适的插件，你可以创建功能很强的动态表格。 这种东西可以让你显示可过滤的数据。

还有图表和各种各样的东西。

听起来不错，让我们看看如何用wpDataTables来实现。

请注意： 虽然本教程专注于交互式表格，但你可能会发现我们关于用wpDataTables创建移动响应式表格的教程很有用。 点击这里查看。 这个新教程考虑到了wpDataTables最近发布的更新的用户界面和额外功能。

这个插件可以让你在没有任何HTML知识的情况下创建漂亮的表格

wpDataTables是一个优质的WordPress插件，它使创建和发布表格到你的网站的过程变得轻而易举。 它是轻量级的，直观的，并在几分钟内完成工作，让你有更少的代码需要涉猎，有更多的时间来写博客。

这个插件的一个关键点是，你 不需要任何事先的HTML知识 一切都在一个易于使用的设置页面中完成。 要发布它，只需复制和粘贴一个短码，你就可以了。

对于博客和企业来说，这是一个好消息，因为它允许你以简洁和容易消化的方式显示大量数据。

你甚至可以用它来做：

• 一份产品目录
• 产品的对比图
• 价格表
• 从用户那里收集数据
• 运动成绩
• 追踪你的进展，对于任何涉及数字的事情（如博客收入报告）。

这种可能性是无限的。

从头到尾创建一个表格：一个逐步的指南

使用wpDataTables插件在你的WordPress网站上创建漂亮、清晰和功能齐全的表格很简单。

下面是如何开始的：

第1步 - 准备好你的文件

下面，我为一些随机的费用创建了一个Excel文件的例子。 这包括几个栏目，如日期、支付方式和费用。

请确保你的数据以类似的方式显示，否则该插件将很难定义你的表格中的列。

第2步 - 创建一个新表

导航到WordPress仪表板左侧的wpDataTables。

点击这个链接将带你到上面的屏幕。 这就是你要创建和添加新表的地方：

点击 "添加新的 "按钮后，你会看到这个屏幕，在这里你将开始设置你的表的参数，以便它的功能和外观符合你的要求：

第3步 - 定义你的桌子特征

在表格设置页面的前三个部分，你可以做以下事情：

• 创建一个标题
• 选择你是否要在页面上显示你的表格标题
• 为你的表格选择一种输入源类型

这些是你最基本的餐桌布置。

点击 "上传文件 "并搜索你的文件。 你可以创建的表格可以根据你的需要而变得复杂。

正如你所看到的，我已经给我的表格一个相关的标题，从下拉框中选择了Excel文件类型，并将我的文件上传到WordPress。

再往下看，你会看到进一步的设置，以定制你的表格：

这些是：

• 响应性 - 允许你的表格在桌面、平板电脑和手机上以不同方式显示
• 可滚动 - 使你能够水平滚动你的表格
• 隐藏表格，直到页面完全加载完毕 - 对加载缓慢的页面很有用
• 高级过滤 - 用于在每一列下面显示一个过滤器
• 滤波器的形式 - 对于表格本身的过滤器
• 表格工具 - 对于诸如复制、保存到Excel和保存到CSV的选项嵌入到你的表格中
• 启用排序 - 这使你能够对你的表格进行分类
• 限制表的布局 - 将表的宽度限制在父容器的100%。
• 显示长度 - 定义一个页面上显示多少个条目

通过点击 "预览"，你可以查看你的表格，并改变任何你认为必要的设置，使其看起来像你所要求的那样。

一旦你选择了最适合你希望显示的表格类型的选项，就是点击 "保存 "按钮的时候了。

如果你想进一步定制你的栏目，一旦你点击了 "保存"，你将能够进一步向下滚动页面以获得更多的选项。 默认设置是自动生成的，然而通过这个你可以改变每个栏目的颜色、栏目和过滤器类型（如日期、时间和文本）。

下面，我添加了一些颜色，并将列类型编辑为文本、数字和字符串。

第4步 - 保存并复制短代码

一旦你保存了你的表格，点击 "关闭"，它将引导你回到插件的主页。 你现在应该看到你创建的表格，你的表格的标题和类型，用于输入到你的帖子或页面的短码，以及复制它的选项。

我想在一个页面中显示这个表格，因此我需要复制这个简码，然后导航到我想编辑的页面。

第5步 - 在帖子或页面中添加短码

要把你的表格添加到一个页面，其实就像把你的短码粘贴到页面编辑器中一样简单。 选择你想显示表格的页面位置，粘贴你的代码，然后继续制作你的内容：

第6步 - 发布

一旦你点击页面上的发布按钮，你的表格应该是这样的。 正如你所看到的，它是清晰的、一致的、完美对齐的，并且以一种易于浏览的方式容纳了我的所有数据：

表格上方的选项将允许用户以各种格式导出表格内容。 你也可以在你的网站前端轻松过滤结果。

你还能创建哪些表？

然而，你不仅仅局限于简单的基于CSV的表格。 WP数据表格可以以多种格式显示广泛的数据。

下面是一个功能齐全、反应灵敏、可编辑的表格的例子，有多列和选项。

这个表是基于MySQL的，有过滤器，可以根据用户的需要对内容进行排序：

这个基于PHP数组的表格是序列化的，包括图像 - 这增加了一个完全不同的动态和功能，许多电子商务商店会发现特别有用：

你也不仅仅局限于CSV文件，WP Data Tables也允许使用基于Excel的文件，使你能够利用它自带的许多特殊功能：

其他值得一提的wpDataTable功能

• wpDataChart向导 - 允许你在几个简单的步骤中把你的数据转换成图表。 它目前支持3个渲染引擎--Google Charts、Highcharts和Chart.js。在这里找到更多的文档。
• 条件性格式化 - 允许你根据其内容突出显示单元格、行和列。 特别是在表格完全是数字的情况下，它很有用。 在这里找到更多的文档。
• 公式列 - 使你能够添加一列，它可以用来根据其他单元格中的数字计算出一个数字。 在这里找到更多的文件。
• 日期时间列 - 用于同时包含日期和时间的单元格。 它们将自动以你在设置页面上设置的格式出现。 在这里找到更多的文档。
• 总和/总表行 - 用于数字列，它允许你计算所有数值的总和。 在这里找到更多的文档。
• 报告生成器 - 报告生成器是wpDataTables的一个插件。 报告生成器可以立即创建文件和电子表格，用WordPress网站的实际数据填充你的模板。 在这里可以找到更多的文档。
• 主表-细节表 - 是wpDataTables的一个插件，它允许你和你的网站访问者通过简单的点击查看每一行的详细信息。 在这里找到更多的文档。

最后的想法

表格是显示数据的一个很好的方式。 当你添加动态功能，如过滤，你会使你的网站的访问者的事情变得更好。

我已经教过你如何在WordPress中通过从Microsoft Excel（或使用任何其他电子表格工具）上传数据来创建一个动态表格。 但是，还有很多事情是可以做到的。

你甚至可以把你的任何表格变成图表或图形，以及更多。

现在，是时候开始制作你自己的餐桌了--享受吧!

相关阅读： 5个强大的和移动响应的WordPress的表插件。

披露： 这篇文章得到了赞助，但我们的意见是我们自己的。