如何为 WordPress 创建一个简单的常见问题解答插件

如何为 WordPress 创建一个简单的常见问题解答插件


我们以前见过很多博客技巧和工具。 那么,今天我们将学习如何为您的博客创建一个好的工具——一个常见问题页面插件。 但最重要的不仅仅是插件本身,而是你可以用这个原理做什么。 您将学习如何在您的 WP 站点中存储任何类型的数据,以及如何将其与外部库(如 jQuery UI)集成,为您的站点创建自定义组件。 让我们开始吧!

创意、演示和下载

演示

我们的目标是创建一个可以用于很多事情的插件,但非常适合常见问题页面。

但除此之外,我们的主要成就将是理解 WordPress 自定义帖子类型、简码、与外部 JS / jQuery 插件的交互。 有了这个想法,您可以根据您可能在那里找到的其他疯狂插件创建很多东西,这只是您的起点,亲爱的学徒。

因此,在这里您可以找到我们将使用的组件的 jQuery API 演示——但真正酷的东西是用于生成该组件的代码 (PHP)。

热身 – 插件文件和自定义帖子类型

首先,我们需要创建一个自定义帖子类型来存储我们的数据。

自定义帖子类型是 WP 魔法的重要组成部分,它允许您创建新的数据类型(有点像帖子、页面、附件……),因此可以使用 WP 的函数调用和操作它。 这对于初学者来说可能看起来很简单,但只有旧的 PHP 程序员(这仍然是一件事吗?)知道在您的数据库中连接和存储数据是多么困难。 更不用说动态创建新的数据类型了,这很微妙,但在我们的代码中允许很大的灵活性。

为了让我们拥有这个,我们需要一个插件,但您可能已经熟悉这个概念。 插件就像 WordPress 的乐高积木,它们使用一些代码添加或转换当前功能,这些代码可以很容易地插入(duh!)或者如果你愿意也可以拔掉。

要以 WP 识别的方式创建插件,您需要两件事:

  1. 在 wp-content/plugins/ 中创建一个文件
  2. 在该文件的开头添加元数据,以便 WP 可以理解这是关于什么的

请记住,文件名必须是唯一的,因此当有人安装您的插件(甚至是您自己)时,不会与当前插件发生冲突。 在我们的例子中,为了更好的组织,我们将添加一个名为 faq-whsr 的新文件夹,并在其中添加一个名为 faq-whsr.php 的文件。

现在对于元数据,只需在插件文件的开头添加类似这样的内容(在

元_01

意思是:

  • 插件名称:将在您的 wp-admin > 插件界面中显示的好名字
  • 插件 URI:如果您想添加指向插件页面(文档、示例、销售页面)的链接
  • 描述:这是你的 wp-admin > plugins 界面中显示的小段落。 保持简单,以便用户记住它的用途
  • 作者/作者 URI:创建插件的人/公司和学分链接
  • 许可证:所以用户会知道他们可以/不能用你的插件做什么

好的,现在我们已经创建了插件,添加了一些相关的元数据。 保存插件文件后,您应该能够在 wp-admin 界面中看到它

让我们激活它,看看会发生什么。

等等,什么都没有? 嗯,这是一件好事,如果现在有任何问题,你会看到一个错误。 现在让我们继续我们的自定义帖子类型创建。

在我们的案例中,CPT 是常见问题解答项目,但您可以创建书籍、视频、推荐书等。 这里要记住的重要一点是:函数名称应该是唯一的。 现在跟我重复一遍:函数名称应该是唯一的,函数名称应该是唯一的。 知道了? 很好,在我们可以使用 OOP(可能在下一个教程中)之前,这将为您节省很多麻烦。

使用以下代码完成魔法:

cpt

这就是相关部分的含义:

  • $labels – 是一个包含 wp-admin 区域不同部分的标签和文本的数组。 所以 WP 会知道调用我们的项目的正确方法
  • 支持——这个告诉你在 wp-admin > FAQ > new screen 中可以看到什么。 在我们的例子中,我们将拥有标题、编辑器(主要内容框)、作者、修订和自定义字段(如果您需要它们)。
  • 分类法——在这里你告诉 WP 哪些分类法是允许的(类别、标签或自定义分类法)
  • register_post_type(‘faq_whsr’, $args) – 这告诉 WP “嘿,使用 $args 中的参数创建一个新的自定义帖子类型,ID 为 faq_whsr”.

保存它并屏住呼吸。 您现在应该在 wp-admin 主菜单中看到一个新部分

等等,就这? 是的。 该片段创建了整个 CPT 功能。 如果您不觉得这很酷,请等待它在下一部分中变得更酷。

在我们离开 wp-admin 之前,添加一些虚拟数据(一些包含至少 2 个类别的常见问题解答)。

前端 – WP x jQuery 交互

现在终于到了看一些动作的时候了,我们将为此使用 jQuery UI Accordion 元素。

jQuery UI 与 jQuery 本身具有几乎相同的优点:

  • 很多开发者都在努力
  • 跨浏览器和移动端代码
  • 有据可查
  • 与 WP 配合得很好(WP 本身使用它们)

现在的问题是:我们如何称呼它?

有两种方法:

  1. wp_head 中糟糕的纯