WordPress 插件样板 101：如何入门

自从多年以前 WordPress 插件 诞生以来，我们编写插件的方式并没有太大变化。通常是一个带文件头的主插件文件，之后基本上就是“西部荒野”（意指毫无约束）。除了使用钩子（hooks）之外，制作插件并没有标准化的方法。

这不一定是个问题。有许多简单的插件不需要管理框架，也有一些人能编写非常连贯的过程式代码。话虽如此，插件中的代码质量通常不是最好的，采用框架或方法论将大大有助于提高代码质量。

在本文中，我将探讨 🔎 一种可能的解决方案——WordPress 插件样板。它是插件开发的 起点，是一种创建标准化插件的面向对象方式。由于它是基于 OOP 原则编码的，因此主要面向中级开发人员，但即使您是初学者，只要知道各个部分放在哪里，也可以轻松使用它。阅读完本文后，无论您的编程经验如何，您都应该了解其组成部分以及如何开始使用它。

常规文件结构

该样板旨在用作 Github 仓库，因此主目录包含 Github 仓库中常见的文件。README.md 文件是一个通用的 readme，会作为描述显示在您的主仓库页面上。CHANGELOG.md 文件用于记录版本之间的更改，而 .gitignore 文件用于设置 git 在处理文件时应忽略的文件。

这里的主文件夹 plugin-name 是存储插件的地方。其结构遵循 WordPress 仓库，您可以将此文件夹“检入”到 SVN 插件仓库。默认情况下，它包含 assets 文件夹（存储插件的图片和截图）和 trunk 文件夹（包含插件的代码）。

trunk 文件夹包含了插件本身，您可以将此文件夹粘贴到 WordPress 安装目录中并激活您的插件。稍后我们将详细查看该文件夹的内容。在此之前，让我们先设置好环境。

new plugin 1

全部设置

将所有这些文件夹和 SVN/Git 的强大功能集中在一个地方固然很好，但您实际上该如何使用它呢？您不能直接将整个文件夹检出到您的 plugins 文件夹中，这根本行不通。仅检出 trunk 目录很麻烦，而且您无法访问该目录之外的文件。

让我向您展示我最喜欢的设置方法。我的计算机上有一个具有以下结构的文件夹：

  • github
    • Top-Authors
    • Easy-Featured-Images
    • Twitter-User-Timelines
  • html
    • wp-admin
    • wp-content
    • wp-includes
    • other wordpress files
  • wordpress
    • top-authors
    • easy-featured-images
    • twitter-user-timelines

html 文件夹是 WordPress 安装的位置。github 文件夹包含我从 Github 获取的所有 WordPress 插件。wordpress 文件夹包含通过 SVN 从 WordPress 仓库获取的相同插件。

创建符号链接

我采取的第一步是在 Github 上创建一个原版的 WordPress 插件样板。然后将其检出到我的 github 文件夹中。接下来，我在其中的 trunk 文件夹与我的 WordPress 安装目录中的 wp-content/plugins 目录之间创建一个符号链接。

符号链接是指对文件或文件夹的引用，它能像预期那样解析到其目标。最终结果是，如果您将系统上任意位置的插件符号链接到您的 WordPress 目录，它将可以正常工作。这给您带来了以下好处：

  • 您可以将插件存储在其他位置。
  • 您可以从一个较大的仓库中符号链接一个文件夹。
  • 您可以将同一个插件符号链接到多个安装中。

在终端或 Windows 的命令提示符中创建符号链接非常容易。我建议打开其中一个，并导航到 WordPress 安装目录下的 plugins 文件夹。然后，输入以下命令：

# 对于 OSX 或 Linux
ln -s /absolute/path/to/github/My-Plugin-Name/my-plugin-name/trunk my-plugin-name

# 对于 Windows
mklink /j C:\absolute\path\to\github\My-Plugin-Name my-plugin-name

这将创建一个从第一个路径指向第二个路径的链接。第一个路径是你 Github 仓库中 trunk 目录的绝对路径。第二个仅是你想要链接到的文件夹名称，前提是你已经在 WordPress 安装目录的 plugins 文件夹中。

完成后，你应该会看到你的新插件显示出来，就像上图一样。我们需要自定义一些内容，但现在我们的插件已经从 Github 仓库运行了，这让开发工作变得容易得多。

重命名

trunk 目录中有很多文件夹和文件，让我们开始重命名它们吧！首先，我建议你使用连字符和首字母大写来命名你的仓库，例如：My-Awesome-Plugin。其中的主文件夹应命名为 ‘my-awesome-plugin’。我建议在整个插件中坚持使用这种命名约定。

在 OSX 中重命名文件很容易。打开所有文件夹，选中所有包含 plugin-name 字符串的文件。右键点击以重命名所有 14 个文件，然后批量重命名它们。

rename 1

在 Windows 上会稍微困难一些，请查看这篇 HowToGeek 文章以获取更多信息，或者干脆一个一个来。

像 “plugin-name” 这样的术语及其他变体也遍布在文件内容中。你可以使用 Sublime、Atom.io 或其他功能强大的文本编辑器在多个文件中进行批量替换。以下是你应该替换的内容列表（请确保执行区分大小写的搜索和替换）。

  • plugin_name 应变为 my_awesome_plugin
  • Plugin_Name 应变为 My_Awesome_Plugin
  • plugin-name 应变为 my-awesome-plugin

完成后，请务必填写主文件的头部注释（my-awesome-plugin.php）以满足你的需求。

目录

WordPress Plugin Boilerplate 中包含很多内容。其理念是对你可以放置东西的位置制定严格的指导原则。例如，有一个特定的位置来添加你的钩子，一个标准的位置来添加前端函数等等。让我们来看看这个框架的主要部分。

⚠ 请注意，我将引用重命名后的文件名，例如：includes/class-my-awesome-plugin.php。如果你将插件重命名为其他名称，你需要记住文件名中的 my-awesome-plugin 部分对你来说会有所不同。

激活、停用和卸载

你想要在插件激活时运行的任何代码都应放入 includes/my-awesome-plugin-name-activator.php 中。在这个文件中，有一个名为 My_Awesome_Plugin_Activator 的类，其中包含你应该使用的 activate() 方法。

如果你还不太了解对象的相关概念，也不必担心，知道把代码放在哪里就足以开始上手了。

你需要在停用时运行的代码应放置在 includes/my-awesome-plugin-name-deactivator.php 中。你需要使用 My_Awesome_Plugin_Deactivator 中的 activate() 方法。

你是不是觉得这有点太复杂了？我不怪你！当你开始使用面向对象的概念时，你会发现这比过程式代码要好得多。即使不说别的，它也为你放置代码提供了一个非常明确的位置，这本身就是一个巨大的帮助。

对于卸载，推荐的方法是使用 uninstall.php，这也是 WordPress Plugin Boilerplate 所做的。你的代码应该放在该文件的最底部。

添加钩子

钩子由 WordPress 处理 Plugin Boilerplate 处理钩子的方式令人惊叹，但起初看起来可能有些笨拙。你所有的钩子都应该放在 includes/class-my-awesome-plugin.php 文件中。更具体地说，是在 My_Awesome_Plugin 类内部，两个方法之中：

  • define_public_hooks() 当添加一个用于前端的钩子时
  • define_admin_hooks() 当添加一个用于后端的钩子时

与平时使用 add_action() 或 add_filter() 不同，你需要稍微改变一下做法。例如，下面是如何修改文章内容。

$this->loader->add_action( 'the_content', $plugin_public, 'modify_post_content' );

第一个参数是钩子的名称，第二个参数是对公共或管理对象的引用。对于公共钩子，这应该是 $plugin_public；对于管理钩子，这应该是 $plugin_admin。第三个参数是挂钩的函数。

虽然这看起来更复杂一些，但它完全标准化了钩子的添加过程，并在此过程中将它们分成了两个不同的组。

公共和管理内容

WordPress Plugin Boilerplate 将钩子分成管理/公共组，但这不仅仅是这些。它以同样的方式分割所有代码，要求你在 public 文件夹中编写面向公共的代码，在 admin 文件夹中编写面向管理的代码。

两个文件夹都包含 css、js 和 partials 文件夹。你应该将使用的 CSS/JS 资源放入这些文件夹，并将模板和其他可重用的 HTML 片段写入 partials 文件夹。在 partials 文件夹中创建新文件是可以的，事实上，这正是它的用途！

你也应该在这些文件夹中编写你的挂钩函数，位于相应目录的类中。当我们上面将 modify_post_content 函数挂钩到 the_content 时，我们也告诉了 WordPress Plugin Boilerplate 在哪里寻找它。由于我们将其添加到了面向公共的一侧，WordPress Plugin Boilerplate 期望它在 public 文件夹中的 My_Awesome_Plugin_Public 类中定义。只需在类中创建这个函数，然后像往常一样编写其他所有内容即可。

资源和依赖项

如果你想使用外部资源，例如 TGM plugin activation，你应该将其添加到 includes 文件夹中。TGM 是一个名为 class-tgm-plugin-activation.php 的单文件，应该包含在 class-my-awesome-plugin.php 文件中的 load_dependencies() 方法里：

require_once plugin_dir_path( dirname( __FILE__ ) ) . 'includes/class-tgm-plugin-activation.php';

回到顶部

概览 🧐

你是不是被所有的文件名和函数搞糊涂了？别担心，你会很快掌握窍门的。事实上，你通常只需要修改三个文件：

  • includes/class-my-awesome-plugin.php 是你添加所有钩子和依赖项的地方。
  • public/class-my-awesome-plugin-public.php 是你添加所有面向公共的函数的地方。
  • admin/class-my-awesome-plugin-admin.php 是所有面向管理的函数所在的地方。

起初，使用 WordPress Plugin Boilerplate 可能看起来很麻烦，但最终会得到回报。一年后当你回来时，你会知道所有东西在哪里，你的插件开发将在产品之间标准化，其他开发者也能明白发生了什么。

最后，不要忘记，提供简单小部件的插件可能不需要这样的框架。虽然使用 WordPress Plugin Boilerplate 不会减慢您的插件速度，但如果您只需要几行简单的代码，它确实会使视图变得臃肿！

🏗️ 既然您已准备好构建一些插件，那么可能是时候构建功能请求系统来帮助管理您的产品了。

…

原文链接：https://wpshout.com/the-wordpress-plugin-boilerplate-101/
分享你的喜爱

相关文章

留下评论

您的邮箱地址不会被公开。 必填项已用 * 标注