如何在没有编码的情况下在 WordPress 中创建高级 HTML 表格

WordPress 仍然是世界上最受欢迎的 CMS 平台，占整个网络 43% 的份额。 尽管 WordPress 无疑是最吸引人的功能之一，但在无需编码的情况下创建 HTML 表格时，它不一定是最佳平台。

尽管许多人认为 HTML 表格已经过时，但它们仍然为观众提供了极好的价值。 结果，大多数用户不得不为特定的“仅限开发人员”任务聘请专家。 考虑到目的，这对当时的 WordPress 用户来说是一个很大的失望。

Gutenberg：带有表格块的 WordPress 默认编辑器

在 2017 年 7 月举办的欧洲 WordCamp 期间，WordPress 创始人 Matt Mullenweg 宣布 Gutenberg 块编辑器是 WordPress 的未来编辑器。 令许多 WordPress 用户高兴的是，全新的编辑器承诺包含一个内置的表格块。

然而，当 Gutenberg 推出 WordPress 5.0 时，该编辑器因在不同设备上造成响应和优化问题而受到批评。 尽管如此，编辑器确实按照承诺提供了一个内置的表格块，使用户能够在他们的网站上创建表格而无需编写代码。

尽管 Gutenberg 表格块是在 WordPress 上创建 HTML 表格的一个非常方便的选项，但它距离成为有效的表格构建器解决方案还有很长的路要走。 它不会提供最吸引人的外观，不可重复使用，并且不擅长处理海量数据库。

古腾堡只不过是一个简单的表格构建器。 您不能将 Gutenberg 用于高级 HTML 表格功能，例如表格排序、过滤或样式。 总而言之，Gutenberg 块编辑器远未成为高级表格构建器。

因此，像我们这样的自由漫游 WordPress 开发人员 WPManageNinja 需要创建一个插件，将高级表格功能添加到您的仪表板。

Ninja Tables：高级 HTML 表格 WordPress 插件

甚至在 Gutenberg 发布之前，我们 WPManageNinja 的开发人员就一直在不懈地努力开发一个可靠的 WordPress 表格插件，让用户可以轻松创建表格。

2018 年 2 月 27 日，我们在 WordPress 插件商店发布了 Ninja 表格，仅用了几个月的时间，Ninja Tabes 的活跃安装量就超过了 30000！ 我们用户的难以置信的支持和赞赏也促使我们在第一次发布后不到 2.5 年内发布了超过 45 个插件更新，使 Ninja Tables 成为该过程中排名第一的 WordPress 表格插件！

由于其动态功能和用户友好的界面，Ninja Tables 现在被 70k 多个网站和企业使用。

Ninja Tables 是一个数据可视化插件，可让您创建各种表格以在您的网站上展示。 将那些难以实现的高级 HTML 表格引入 WordPress 网站时，响应能力、功能、定制设施和第三方集成是您的最佳选择。

现在，让我们深入了解 Ninja Tables 最先进的 HTML 表格构建和自定义功能。

• 用户界面
• 表格编辑器
• 集成

用户界面

激活后，可以从 WordPress 仪表板的侧边栏中找到 Ninja Tables。 像大多数 WordPress 插件一样，Ninja Table 提供了一个具有多种功能的 UI。 让我们更多地了解它！

• 所有选项卡
• 工具和设置
• 帮助和文档

主页/所有表

Ninja Tables Home有一个吸引人的界面，提供新鲜的产品。 它为您提供了两个按钮，一个用于创建，一个用于导入。

创建您的第一个表按钮将您带到手动 WordPress 表构建器，而您也可以从 CSV 导入。

如果您决定从头开始创建表格，它会要求您在弹出窗口中提供标题和说明。 您可能还会注意到其他几个选项卡，它们提供了各种导入和集成功能。 但是，Ninja Tables 的免费版本只允许您通过 CSV 或 JSON 导入并与 WP Fluent Forms 集成。

提供Title和Description后，单击Add按钮访问表构建器。 如果不需要，可以跳过描述框。

导入功能也以同样的方式工作。 它允许您选择一个 Excel 文件或您在计算机上创建的任何其他 CSV 文件，以上传到您的网站。

无论哪种方式，您最终都会进入表格编辑器。 请注意，您创建的表是可重复使用的，并将显示在主窗口中。 Ninja Tables 使用简码识别表格。 为了在您网站的帖子或页面中使用表格，您只需将表格短代码复制粘贴到您的页面或帖子上。

工具和设置

除了主页选项卡之外，Ninja Table 还包括一个工具和设置选项卡，使用户能够导入、修改全局外观、设置用户权限和更改全局设置。

如果您已经在使用任何其他流行的表格插件并已切换到 Ninja Table，则导入工具非常适合。 Ninja Table 为 TablePress、Ultimate Tables 和 Supsystic 的 Data Tables Generator 提供一键式表格导入功能。 您还可以在此选项卡中导入 CSV 文件。

接下来，全局外观选项卡允许您更改表格样式。 Ninja 表格可以使用三种不同的表格 UI 样式即兴创作您的表格。 您还可以根据自己的喜好自定义每种样式，并选择是否允许访问者搜索和过滤您的表格。 但是，也可以为每个表单独修改外观规则。

不幸的是，除非您拥有 Ninja Tables 专业版，否则您无法为不同的后端用户设置权限。 剩下的选项卡允许您选择如何处理Javascript 错误并清除表缓存。

帮助和文档

Ninja Tables 的广泛功能需要可靠的文档，我们的团队已准备好您需要了解的有关 Ninja Tables 的所有信息。

我们的帮助和文档界面提供了一份文档完善的用户指南，以深入了解 Ninja Tables 可以做什么。 如果您仍然遇到任何问题，您可以随时通过提交支持票联系我们！

现在您已经了解了 UI，您肯定想要创建一个表格！ 所以回到主页开始创建一个吧！

表格编辑器

表格编辑器是 Ninja Tables 最令人兴奋的功能之一。 它通过一些最先进的 HTML 表格构建器功能以及自定义来增强。 单击“添加”或“导入”按钮后，您将进入功能全面的 Ninja Tables 表格编辑器。

Ninja Tables 表构建器 UI 由上面显示的部分组成。 每个表格构建器部分都有多个自定义功能来创建和设计漂亮的 WordPress HTML 表格。

您可以通过单击顶部的“编辑”按钮更改表格标题和描述并设置表格标题。 此外，Ninja Tables 表格构建器 UI 还允许您随时预览表格。

• 表格行
• 配置
• 设计
• 前端编辑
• 自定义 CSS
• 进出口

让我们一一讨论表构建器功能。

表行

表格行是 WordPress 上任何 HTML 表格构建器的基本方面之一。 正如它所说，您可以通过单击“添加列”按钮开始！

该按钮将打开一个列创建窗口，该窗口授予 WordPress 上一些最高级的 HTML 表格功能。 Ninja Tables 不仅仅是一个具有平均列创建功能的基本表构建器； 远不止于此。

因此，虽然您可以编写列标题，但您还可以设置数据类型和响应断点（响应断点让您选择是否在特定设备上显示列） 。

但是，免费版本限制了选择字段、图像和文件上传，并且不允许您创建按钮。 尽管如此，该插件仍具有一些令人难以置信的数据添加功能，例如HTML Field 、 Numeric Value和Date Field 。

如果您仍在寻找对表格列的更多控制，您可以解锁其他列自定义选项卡上可用的高级设置、条件设置和转换值。 查看 Ninja Tables 文档以获取有关它们如何工作的更多信息。

添加表格列后，编辑器中将出现“添加数据”按钮。 它使您可以毫不费力地将数据添加到您的网站。 您可以通过单击列标题旁边的齿轮图标来单独自定义列，并随时编辑、复制或删除数据！

最后，如果您的表格包含许多数据，表格行部分还可以让您进行批量操作或设置紧凑视图。

表配置

表配置选项卡提供拖放式列组织。 通常，HTML 表格一旦创建就无法在 WordPress 上进行组织。

在这方面，忍者桌不限制桌的组织。 可以通过拖放来组织表格行，同时您还可以创建新列或编辑现有列。

表格配置选项卡上的下一个选项卡允许您选择渲染设置，即您希望浏览器如何渲染表格。 默认情况下，您的表格将使用Ajax 表格设置呈现。 此功能允许您在不损害网站速度的情况下合并海量数据库。

虽然有两个渲染选项，但除非您拥有专业版，否则您无法选择高级表格设置。 高级表格可以合并一些最高级的表格字段，包括单元格边距和简码，适用于 SEO 优化。

如果您想在表格中包含单选按钮、复选框、日期选择器或各种其他专用 UI​​，自定义过滤器是一个方便的功能。 如果您在表格单元格中显示产品或添加更多数据，这些可以提供出色的转换优化功能。 但是，自定义过滤器也是一项专业功能。

按钮配置允许您包含打印或 CSV 导入按钮（专业版功能）。 如果您有兴趣为表格搜索栏、搜索占位符或搜索下拉标题使用不同的语言，则语言设置非常有用。

表设计

Ninja Tables Table Design是一个令人难以置信的视觉定制器。 它具有三个样式库和多达九种样式自定义功能，使您可以最大程度地可视化控制 WordPress 上的 HTML 表格。

除了样式，您还可以选择是否显示表格标题、描述、搜索栏、列过滤器、标题行、边框等。此外，您可以通过启用Stackable Table Configuration来设置目标设备，使其不会中断在任何设备上。

样式确实在桌子的视觉吸引力中起着重要作用。 然而，颜色最重要。 Ninja 桌子在桌子颜色选项卡中提供完整的颜色定制。 您可以自定义从表格标题颜色到表格边框的所有内容，并且对允许的颜色没有限制。

如果您无法决定颜色定制，Ninja Table 为您的桌子提供了 13 种预定义的配色方案！ 但是，这个令人难以置信的功能需要高级版本。

剩下的表格设计选项卡具有各种自定义功能，例如分页、搜索栏位置、排序方法，您可以为表格设计提供额外的 CSS 类。

前端编辑

前端编辑是 Ninja Tables 不仅仅是一个表格插件的另一个典型原因。 它允许您为前端用户启用编辑。 例如，如果您需要您的用户填写表格数据，您可以方便前端编辑。 但是，前端编辑功能仅在高级版本上可用。

自定义 CSS/JS

自定义 CSS 让您可以控制 HTML 在 WordPress 上的外观，并且在插件的情况下，它可以让您控制您的表格。 虽然本文是为非编码人员准备的，但了解 CSS 和 Javascript 可以让您全面控制 Ninja Tables 的外观。

进出口

同样，导入功能允许您导入 CSV 文件或通过 CSV 替换现有表。 另一方面，导出功能将使您能够将表格保存在 CSV 文件中。

集成

Ninja Tables 包含了在 WordPress 上轻松构建 HTML 表格的所有基本工具和功能。 但权力不仅限于建桌。 它不仅仅是一个表格插件，还带有几个令人难以置信的集成。 所有这些都提供一流的设施！

• Fluent 表单集成
• WP帖子
• WooCommerce
• 谷歌表格
• 忍者图

流利形式集成

作为网站所有者，您可能会在您的网站上使用表单插件。 如果您想将表单条目放入表中怎么办？ Ninja Tables 使用您的表单条目来创建和显示表格，除了设置表格之外，您无需执行任何操作。

WP Fluent Forms 是目前世界上最好的联系表单插件，如果您一直在使用该插件从您的受众那里收集数据，您可以将其放入您的 WordPress 表格中，而无需做太多事情。

WP 帖子集成

Ninja Tables 不仅将您的联系表格条目带到表格中。 只需单击几下，它还可以将您的所有帖子、产品、页面等组织到一个表格中。 如果您希望对帖子或产品进行分类，Ninja tables WP Posts 集成可以显着减少您的工作。

WooCommerce 集成

WooCommerce 是最受欢迎的 WordPress 商店插件。 然而，大量使用 WooCommerce 的人也意味着他们中的很多人都提供相同的用户体验。 具有 WooCommerce 集成的 Ninja Tables 是一个传奇插件，可以在您的网站上提供多样性并在您的后端提供有效性。 它提高了转化率，同时允许最直接的 WooCommerce 商店管理！ Ninja Tables 正是您管理 WooCommerce 商店所需要的。

谷歌表格集成

Ninja Tables 藏在袖子下的东西真是不可思议！ 你就是这么想的，对吧？

也许，谷歌表格是任何 WordPress 插件可以提供的最佳集成选项之一。 Google Sheet 是最受欢迎的在线电子表格，具有最简单的功能。 该网络应用程序具有绝对世界级的功能，更重要的是，它可以从任何设备访问！

Ninja Tables 可以连接任何谷歌表格，并在表格更新时在您的网站上显示其数据。 因此，如果您需要在旅途中更新您的表格，Ninja Tables 谷歌表格集成绝对是一个大师班！

忍者图表集成

表格处理数据。 我们依赖 WordPress 表格，因为它们向我们展示了统计数据。 然而，有时我们需要有一点创意，并发现以图形方式来展示它们。 Ninja Charts 集成是生成表格数据可视化呈现的完美解决方案。 想看看你能用它做什么？ 看看视频！

包起来

有了 Ninja Tables，在 WordPress 上创建高级 HTML 表格的艰辛终于结束了！ 它是所有需要在放弃 HTML 代码的同时显示漂亮数据表的 WordPress 用户的一站式解决方案。

因此，使用 Ninja Tables 制作桌子、增加参与度、提高转化率并做更多的事情。

这就是今天的全部内容。 祝你一切顺利。

合著者：努斯拉特·法里哈

Nusrat 是 WPManageNinja 的一位创意内容作家，他喜欢研究不同的主题。 当她不写作时，她可能正在阅读她最喜欢的书！