WordPress5-大全第七版-全-

WordPress5 大全第七版（全）

原文：zh.annas-archive.org/md5/35724d6a5a0cbfe2813127c868c7ad16

译者：飞龙

协议：CC BY-NC-SA 4.0

前言

《WordPress 5 完整版，第七版》 将带你从头开始构建一个功能齐全的 WordPress 网站的全过程。这个过程从教你如何安装 WordPress 开始，一直延伸到最先进的话题，例如创建自己的主题、编写插件，甚至构建非博客网站。最好的部分是，你可以在不损失任何东西的情况下完成所有这些。此外，一旦你积累了一些经验，你将能够在几分钟内启动新的 WordPress 网站（顺便说一句，这不是比喻；这是最真实的情况）。

这本书以逐步的方式引导你，解释了关于 WordPress 的所有知识。我们将从下载和安装 WordPress 的核心开始，你将学习如何选择正确的设置，以确保你和你访问者的体验顺畅。之后，这本书将教你关于网站内容管理功能的所有内容，从帖子、页面到分类和标签，一直到媒体、菜单、图片、画廊、安全、管理、用户资料等等。接下来，你将了解插件和主题是什么，以及如何有效地使用它们。最后，你将学习如何创建自己的主题和插件，以增强你网站的整体功能。一旦你完成了《WordPress 5.0 完整版，第七版》，你将拥有从头开始构建专业 WordPress 网站所需的所有知识。

这本书面向的对象

这本书是针对 WordPress 初学者以及那些对 WordPress 有一定了解的人的指南。如果你是博客新手，想要以简单直接的方式创建自己的博客或网站，那么这本书就是为你准备的。它也适合那些想学习如何定制和扩展 WordPress 网站功能的人。你不需要具备任何详细的编程或网络开发知识，任何对 IT 有信心的人都能使用这本书制作出令人印象深刻的网站。

为了充分利用这本书

为了跟随本书中的示例，你需要以下内容：

• 一台电脑

• 一个网络浏览器

• 一个纯文本编辑器

• FTP 软件

你可以考虑使用一个突出显示代码的文本编辑器（例如 Coda、TextMate、HTMLKit 等），但一个简单的纯文本编辑器就足够了。你可能想在电脑上运行 WordPress 的本地副本，在这种情况下，你可能需要安装 Apache 和 MySQL 服务器（尽管 WAMP、XAMPP 或 MAMP 可以为你处理所有这些）。但即使这样也不是必需的，因为你可以远程完成整个操作。

下载示例代码文件

你可以从www.packt.com的账户下载这本书的示例代码文件。如果你在其他地方购买了这本书，你可以访问www.packt.com/support并注册，以便将文件直接通过电子邮件发送给你。

您可以通过以下步骤下载代码文件：

1. 在www.packt.com登录或注册。

2. 选择 SUPPORT 标签。

3. 点击代码下载与勘误。

4. 在搜索框中输入书籍名称，并遵循屏幕上的说明。

文件下载后，请确保使用最新版本解压缩或提取文件夹：

• WinRAR/7-Zip for Windows

• Zipeg/iZip/UnRarX for Mac

• 7-Zip/PeaZip for Linux

本书代码包也托管在 GitHub 上，网址为github.com/PacktPublishing/WordPress-5-Complete-7th-Edition。如果代码有更新，它将在现有的 GitHub 仓库中更新。

我们还有其他来自我们丰富图书和视频目录的代码包可供在github.com/PacktPublishing/上获取。查看它们吧！

下载彩色图像

我们还提供了一份包含本书中使用的截图/图表彩色图像的 PDF 文件。您可以从这里下载：www.packtpub.com/sites/default/files/downloads/9781789532012_ColorImages.pdf。

使用的约定

本书使用了多种文本约定。

CodeInText：表示文本中的代码单词、数据库表名、文件夹名、文件名、文件扩展名、路径名、虚拟 URL、用户输入和 Twitter 昵称。以下是一个示例：“如果您在本地服务器上安装 WordPress，请确保将 WordPress 文件放置在计算机上正确的webroot目录中。”

代码块设置如下：

.site-footer {
  float: right;
  padding: 20px;
}

粗体：表示新术语、重要单词或屏幕上看到的单词。例如，菜单或对话框中的单词在文本中显示如下。以下是一个示例：“现在，点击安装 WordPress。”

警告或重要注意事项如下所示。

小贴士和技巧如下所示。

联系我们

我们始终欢迎读者的反馈。

一般反馈：如果您对本书的任何方面有疑问，请在邮件主题中提及书籍标题，并通过customercare@packtpub.com给我们发邮件。

勘误：尽管我们已经尽一切努力确保内容的准确性，但错误仍然可能发生。如果您在这本书中发现了错误，我们将不胜感激，如果您能向我们报告，请访问www.packt.com/submit-errata，选择您的书籍，点击勘误提交表单链接，并输入详细信息。

盗版：如果您在互联网上以任何形式遇到我们作品的非法副本，如果您能提供位置地址或网站名称，我们将不胜感激。请通过copyright@packt.com与我们联系，并提供材料的链接。

如果您有兴趣成为作者：如果您在某个领域有专业知识，并且您有兴趣撰写或为书籍做出贡献，请访问authors.packtpub.com。

评论

请留下评论。一旦您阅读并使用过这本书，为何不在购买它的网站上留下评论呢？潜在读者可以查看并使用您的客观意见来做出购买决定，我们 Packt 可以了解您对我们产品的看法，而我们的作者也可以看到他们对书籍的反馈。谢谢！

想了解更多关于 Packt 的信息，请访问 packt.com.

第一部分：WordPress

本节涵盖了作为平台新用户你必须了解的关于 WordPress 的所有内容。这是你的 WordPress 101。

本节将涵盖以下章节：

• 第一章，介绍 WordPress

• 第二章，WordPress 入门

• 第三章，创建博客内容

• 第四章，页面、媒体以及导入/导出内容

第一章：介绍 WordPress

“我该如何制作一个网站？”是现在很多人都会问的问题。实际上，如果你是 21 世纪的商业主，这可能是你问的主要问题之一。但制作网站不仅仅是关于商业。

这些天，我敢说，每个人至少都应该考虑拥有自己的网站。在过去，这是一个令人畏惧的概念。你唯一能拥有网站的方法是雇佣一个专业人士为你搭建，或者自学网络技术和开发，然后自己搭建。如今，有更多的选择，尤其是如果你想在确保网站高质量的同时，快速搭建一个网站的话。

其中最好的选择是 WordPress——这正是本书的主题。在底层，WordPress 是一个开源的网页软件应用，你可以用它来创建和维护一个现代网站。在撰写本文时，超过 30%的所有网站都在使用 WordPress，而且这个数字预计在未来几年只会增加。简单来说，使用 WordPress，任何人都可以以最小的努力创建一个美丽的网站，并且很快就能将其展示给全世界。让我们来看看使用 WordPress 的一些好处：

• 你不需要雇佣一个开发团队和/或设计师

• 你不需要学习高级 PHP

• 你不需要成为计算机专家

• 然而，你仍然可以拥有一个高质量的网站，几乎具有无限的扩展可能性

现在，每个人都有拥有网站的好理由。这不仅仅是大型公司。个人、家庭、自由职业者或小型/独立企业都可以从网站中受益。然而，与此同时，大多数人没有足够的资金雇佣一个网络开发公司或自由职业的网络开发者来为他们创建网站。这就是 WordPress 发挥作用的地方。WordPress 是免费的，易于使用，并集成了许多优秀功能。由于 WordPress 是一个网络应用，它不需要安装在你的家用 PC 或 Mac 上，或任何其他你控制的机器上。它可以存在于一个属于网站托管公司的服务器（类似于计算机）上。最初，WordPress 是一个旨在运行博客网站的应用。然而，它已经发展成为一个功能齐全的内容管理系统（CMS）。如果你不知道什么是博客，不用担心，我们将在本章后面解释一切。

在这本书中，我们将逐步介绍你理解 WordPress 如何工作以及可以用它做什么的重要步骤。我们将学习 WordPress 的基本使用、配置、通过主题和插件扩展你的网站，以及更多。但在我们能够达到所有这些之前，我们需要从零开始！在本章中，我们将探讨：

• 会使你选择 WordPress 来运行你的网站的原因

• WordPress 的最大优势

• WordPress 的在线资源

• WordPress 最新版本中最有用的功能之一

进入 WordPress

WordPress 是一个开源内容管理系统。开源意味着系统的源代码以许可证的形式公开，版权所有者提供权利，允许任何人出于任何目的研究、更改和分发软件（如维基百科所定义）。CMS 意味着一个可以运行网站（例如，博客）的软件应用程序，并允许你发布、编辑和修改内容。它是一段位于网络服务器上的软件（稍后会更详细地介绍什么是网络服务器），并使你轻松添加和编辑帖子、主题、评论以及所有其他内容。以下是 WordPress 的标志：

尽管 WordPress 最初是一个博客引擎——主要用于运行博客——但现在它已成为网络中一些最大品牌的热门解决方案，并运行它们的整个网站。例如，《纽约时报》、《华尔街日报》、福布斯、路透社、WIRED.com、索尼、丰田，以及一些最杰出的艺术家（如碧昂丝或滚石乐队）都使用 WordPress 作为其网络平台和发布渠道的基础。

毫无疑问，WordPress 在多年中发展了很多，尽管引入了大量新功能，但 WordPress 仍然是使用最简便的网页发布平台之一。最初，它是一个名为b2/cafelog的旧软件分支。

WordPress 是由马特·穆伦韦格和迈克·利特尔开发的，但现在由包括穆伦韦格在内的一支开发者团队维护和开发。

WordPress 的优势是什么

WordPress 通常适用于以下三种流行的网站类型：

• 一个具有相对静态内容、页面、子页面等的典型网站

• 一个按时间顺序组织、经常更新、分类、标记和归档的博客网站

• 电子商务网站：一个功能齐全的在线商店，允许人们购买商品或服务，并允许网站所有者管理订单并完成它们

然而，正如经验所证明的那样，WordPress 也成功地用于运行各种其他网站，例如：

• 企业商务网站

• 单页个人资料网站

• 作品集网站

• 会员网站

• 视频博客

• 照片博客

• 产品网站

• 教育网站（在线课程）等

对于那些对博客网站和博客术语不熟悉的人，让我们来看看基础知识。

开始旅程——什么是博客？

最初，“博客”是“weblog”的简称。根据维基百科，这个术语“weblog”首次在 1997 年使用，人们从 1999 年开始在全球范围内使用博客。术语“weblog”、“web blogging”和“weblogger”于 2003 年被添加到《牛津高阶英汉双解大词典》中，尽管现在大多数人省略了“we”部分。

为了给您一个更简单的英文解释，博客是一个通常包含作者定期发布的条目的网站。这些条目可以是各种类型，如评论、事件描述、照片、视频、个人评论、教程、案例研究、长篇评论、政治观点，或您能想到的任何其他内容。它们通常按倒序时间顺序显示，最新添加的内容位于顶部。这些条目可以按日期、主题、主题等方式进行组织。

博客的一个主要特征是它旨在定期更新。与内容静态的网站不同，博客更像是一个在线日记，博主会定期发布更新。因此，博客是动态的，内容不断变化。博客可以随时更新新内容，旧内容也可以随时更改或删除（尽管删除内容并不是常见的做法）。

大多数博客都将内容集中在特定的主题上，例如，时事、爱好、细分话题和技术专长。这并不意味着博客只能由分享特定问题个人观点的人来发布。相反，如今，博客已成为许多企业和甚至大公司在线存在的重要组成部分。现代的内容营销实践现在已成为最广泛接受的网络营销方法之一，其核心是基于发布高质量的内容，通常以博客的形式。

理解常用术语

如果您是博客世界的新手（有时被称为博客圈，这是当今相当流行的表达），您可能想熟悉以下常用术语。

文章

博客中的每一篇条目都称为文章。每篇文章通常包含多个不同的部分。当然，最明显的两个部分是标题和内容。内容是文本、图片、链接等。文章甚至可以包含多媒体内容（例如，视频和音频文件）。每篇文章还有一个发布时间戳，大多数文章都有一个或多个分类和标签。这些文章，或条目，通常按倒序时间顺序显示在博客的主页上。默认情况下，最新的文章首先显示，以便给观众提供最新的主题新闻。

分类和标签

分类和标签是组织和在博客内以及跨博客中查找文章的方式。分类就像主题，而标签更像是关键词。例如，对于一个关于食物和烹饪的博客，可能会有一个名为食谱的分类，但该分类中的每篇文章可能都有不同的标签（例如，汤、烘焙、素食和无乳制品）。

标签和分类的目的和正确使用是博客作者之间广泛讨论的话题之一。尽管有基本指南，如这里所展示的，但每个博客作者在一段时间后会发展出自己的方法，而且没有不可更改的规则。

评论

大多数博客允许访客在帖子下发表评论。这为读者提供了与博客作者的互动机会，从而使整个体验变得互动。通常，博客作者会通过点击回复按钮一键发表额外的评论来回应评论，这形成了一种持续的公开在线对话或对话。

人们常说，评论是博客最重要的资产之一。大量评论的存在显示了博客的受欢迎程度和权威性。

主题

主题是你可以为你的博客选择的设计和布局包。在大多数博客上，内容（例如，帖子）与视觉外观是分开的。这意味着你可以在任何时候更改博客的视觉外观，而不用担心内容受到影响。主题的最好之处之一是安装并开始使用新主题只需几分钟。此外，网上有许多非常好的免费或低成本主题可供选择。

话虽如此，你在使用不确定的开发者的免费主题时需要小心。通常，它们包含可能损害你的网站及其在 Google 上的存在性的加密部分和代码。在选择主题之前，总是寻找用户评价。最重要的是，最安全的做法是从官方 WordPress 目录wordpress.org/themes/获取你的免费主题。那里的主题已经过测试和检查，以确保没有可疑的代码。

你可以在newinternetorder.com/free-wordpress-themes-are-evil/了解更多关于这个问题的信息。

插件

WordPress 插件是相对较小的网络软件组件，可以安装在任何 WordPress 网站上。它们扩展了原生功能，几乎可以做今天技术允许的任何事情。就像 WordPress 本身一样，插件内的代码是开源的，这意味着任何拥有所需技能集的人都可以构建一个新的插件。每个 WordPress 网站或博客都可以与无限数量的插件一起工作（尽管这不是推荐的方法）。通过插件引入的最受欢迎的功能包括垃圾邮件防护、搜索引擎优化（SEO）、缓存、社交媒体集成、交互式联系表单和备份。

小工具

小工具 是插件的一个简化版本。小工具最常见的用法是在你网站的侧边栏中展示。通常，你的当前主题会为你提供多个小工具区域，你可以在这些区域显示小工具（如前所述，其中许多位于侧边栏）。小工具的一些常见用途是显示内容，如分类和标签、最新文章、热门文章、最新评论、指向存档文章、页面、链接、搜索字段或标准非格式化文本。

菜单

我们需要回顾一些历史来解释 WordPress 中菜单的含义。在早期，WordPress 并不允许对导航菜单进行太多定制，也无法挑选我们想要显示的链接。这种状况在 3.0 版本中发生了改变，那时引入了新的 自定义菜单 功能。简单来说，它允许你创建完全定制的菜单（包括你选择的任何链接），然后在你网站的特定区域显示它们。说实话，尽管这个功能听起来很基础，但它却是将 WordPress 转变为一个完整网络出版平台的主要功能之一。我保证在接下来的章节中，这会变得更加清晰。

页面

重要的是要理解页面和文章之间的区别。与文章不同，页面不依赖于时间戳，也不会按时间顺序反向显示。此外，它们没有分类或标签。页面是一篇只有标题和内容（例如 关于我 或 联系我们——这两者几乎是任何博客上最受欢迎的页面）的内容。在你的博客上，页面的数量可能相对稳定，而新的文章几乎每天都会增加。

首页

首页 简单来说就是访客通过输入你的域名或 URL 地址访问你的网站时看到的首页。在 WordPress 存在的早期，首页并不是我们单独讨论的一种页面。最初，首页是自动从最新文章中生成的——它是以反向时间顺序列出这些文章的列表。然而，现在，WordPress 允许我们构建一个完全定制的首页，并在其上显示我们希望展示的任何内容。

用户

如前所述，WordPress 现在是一个完整的网络出版平台。其特点之一是能够与多个用户账户一起工作，而不仅仅是属于网站所有者（管理员/主要作者）的单个账户。有不同类型的用户账户可供选择，它们有不同的凭证和访问权限。

WordPress 显然试图模仿一个传统的出版社，其中存在 作者、编辑 和其他 贡献者，他们共同协作。尽管为个人管理网站的人提供无限数量的用户账户选项可能不会给人留下深刻印象，但它对于大型、类似杂志的网站来说，无疑是一个至关重要的功能。

为什么选择 WordPress？

WordPress 不是唯一的发布平台，但它提供了很多功能。在接下来的章节中，我特别强调了 WordPress 最突出的特性。

WordPress 的主要好处总结如下：

• WordPress 让你完全控制自己的网站。你可以改变/调整/修改/定制网站上的每一件事，我的意思是每一件事。

• 有 成千上万的主题和插件 可以选择，让你能够按照自己的意愿打造网站的外观和功能。WordPress 非常易于扩展。基本上，任何你能想到的额外功能都可以通过插件来实现，这些插件可以由你或你的程序员朋友编写。

• 在 该平台上日常操作非常容易上手。诸如编辑内容、发布新文章/帖子或通过评论与观众互动等任务都没有学习曲线。

• WordPress 是开源的。这个平台没有价格标签；你可以免费获取。这也意味着，了解平台的工作原理以及如何进一步扩展它，不需要任何人的许可。

谁应该使用 WordPress？

基本上，如果你需要建立一个网站，并且想要自己动手搭建，那么 WordPress 就是实现这一目标的平台。

WordPress 是一个完美的工具，无论是刚开始接触网站建设的初学者，还是专业从事客户网站开发的开发者。

WordPress 已经存在很长时间了，并且一直在开发中。开发者们一直在努力工作，以确保 WordPress 能够领先于垃圾邮件发送者和黑客，并根据用户 不断变化的需求 来 进化 应用程序。

WordPress 的第一个版本，0.70 版，于 2003 年 5 月发布。从那时起，它已经发布了二十多个主要版本，中间还穿插着一些小版本。每个版本都带来了更多功能和更好的安全性。每个主要版本都有一个以杰出爵士乐手命名的代号，这已经成为 WordPress 世界的传统。

顺便说一下，WordPress 不是由一个孤独的程序员在黑暗的地下室里开发的。相反，有一个庞大的社区正在通过开发、故障排除、提供建议和测试应用程序来共同合作。由于有这么多人参与，应用程序很可能会继续不断进化和改进。

了解 WordPress 生态系统

作为平台和用户社区，WordPress 在两个主要领域取得了增长：

• 第一个围绕 WordPress.org (wordpress.org/) 展开，这是 WordPress 项目的原生、主要网站。

• 另一个是 WordPress.com (wordpress.com/)，一个商业平台，为用户提供免费和付费的博客服务。

实际上，WordPress.org是关于开发平台本身，分享新插件，讨论 WordPress 的技术方面，并且在一般意义上都是所有技术爱好者。WordPress.com是一个商业网站，博客作者可以在那里见面并发布他们的博客内容在wordpress.com子域下（例如，像paleorecipeslog.wordpress.com这样的子域）。

在第二章“WordPress 入门”，我们将讨论在WordPress.com托管博客与从WordPress.org获取软件之间的区别。

深入了解 WordPress – 功能

以下是 WordPress 提供的一些功能列表（不分先后）：

• 通过 WordPress 主题交换设计，这些主题也可以通过WordPress 自定义工具进一步自定义

• 通过 WordPress 插件扩展

• 无限的文章和页面

• 无限的分类和子分类

• 无限标签

• 适用于所有设备和屏幕尺寸的移动友好性和优化

• 灵活——创建您想要的任何类型的网站

• 可扩展的——可以处理任何规模的网站

• 能够通过电子邮件和移动设备发布（所有主要移动平台都有应用程序，包括 iOS 和 Android）

• 符合万维网联盟（W3C）标准，尽管这取决于您使用的主题

• 从其他博客导入数据（Moveable Type、b2evolution、Blogger 等）

• 即使没有先前的经验也容易管理和博客

• 方便，功能齐全，内置搜索

• 多语言，良好的国际化，并且也支持表情符号（包括所有最新的 Unicode 9.0 表情符号字符）

• 安全的代码

• 能够设置密码保护内容

• 评论管理器和垃圾邮件保护

• 内置的工作流程（撰写、草稿、审查和发布）

• 通过名为 Gutenberg 的可视编辑器进行智能文本和内容编辑

• 多用户和多作者对用户账户的支持

• 功能丰富的媒体库，通过直观且易于使用的界面管理照片和其他非文本内容

• 社交媒体集成功能

• 具有帖子（编辑）锁定功能的动态和可扩展的修订功能

• 通过短代码内置嵌入功能（兼容 YouTube、Vimeo、Flickr、SoundCloud 等服务）

• 可通过所有现代设备、操作系统和网页浏览器访问的行政面板

• 网站前端元素的完全可访问性

• 用户友好的图像编辑，以及拖放式图像导入功能

• 通过插件和主题的高级 SEO 功能

• 集成的 REST API 基础设施

学习更多

如果你想查看 WordPress 新增的所有功能的详细列表，只需查看 Codex。你可以轻松找到每个版本的子页面。只需将以下网址中的X和Y替换为你想要查找的版本号。

https://codex.wordpress.org/Version_X.Y

例如，如果你想了解 WordPress 5.0，请访问：

codex.wordpress.org/Version_5.0

此外，你还可以在wordpress.org/about/features/上阅读完整的特性列表。

通过在线 WordPress 资源学习更多

WordPress 的一个非常实用的特性是它拥有一个庞大、活跃的在线社区。你为 WordPress 网站所需的一切很可能都能在网上找到，而且很可能是免费的。除此之外，如今我们还可以找到许多付费资源和培训项目，它们提供专家建议和培训，围绕 WordPress 网站的各种可能用途：

• codex.wordpress.org/: 这里你可以找到 WordPress 的官方文档——我们将在本章后面更多地讨论 Codex。

• themeisle.com/blog/：提供关于使用 WordPress 执行常见任务的免费指导

• www.wpbeginner.com/：提供关于 WordPress 的教程和资源

关注 WordPress 新闻更新

由于 WordPress 一直在不断发展，因此了解软件社区的最新活动非常重要。

如果你经常访问自己的 WordPress 网站的仪表板，你将能够了解 WordPress 新闻和软件发布情况。仪表板上有显示最新新闻和公告的小工具，当有新的 WordPress 版本可供下载和安装时，总会出现警报。

如果你更喜欢访问网站，那么最重要的访问或订阅位置是 WordPress 发布。无论是有重大发布，还是临时错误修复，或者升级，都会在wordpress.org/news/category/releases/上。

此外，务必关注wordpress.org/news/上的主要 WordPress 博客。

一些值得提及的额外资源如下：

• wordpress.org/: WordPress 的绝对主要枢纽。

• wordpress.com/: 用于创建博客和网站的商业服务。

• jobs.wordpress.net/：为寻找与 WordPress 相关领域就业机会的人提供职位列表（或为寻找 WordPress 帮助的人）。

• wordpress.tv/: 一个优秀的 WordPress 教程、如何操作建议、案例研究、产品演示以及与 WordPress 相关的会议演讲记录的来源。

• central.wordcamp.org/: WordCamp 是一个专注于 WordPress 的会议；它一年中在世界各地的不同地点举办多次，这个网站是会议的中央点。

理解 Codex

WordPress Codex 是官方 WordPress 团队发布所有信息的中央存储库，旨在帮助人们使用 WordPress。

Codex 提供了一些基本的 WordPress 入门教程，例如详细的安装步骤讨论，以及每个模板标签和钩子的列表。在这本书中，我将提供指向 Codex 中特定页面的链接，这些链接将提供关于本书主题的更多或更高级的信息。

Codex 可以在codex.wordpress.org/Main_Page找到。请参考以下截图：

除了 Codex 之外，还有一个对新手和经验丰富的开发者都很有用的资源。它被称为 WordPress 代码参考，可以在developer.wordpress.org/reference/找到。它提供了大量关于 WordPress 的功能、类、方法和钩子的文档。

从其他用户那里获得支持

在线 WordPress 社区在wordpress.org/support/的 WordPress 论坛上提问并回答解决方案。如果你在 Codex 中找不到问题的答案，这是一个很好的去处。如果你有问题，那么可能其他人也有过同样的疑问，WordPress 专家会在论坛上回答这些问题并提供解决方案。

使用主题和插件目录

在WordPress.org上有官方的主题和插件目录。尽管不是每个主题和插件都可用，但那些可用的主题和插件都经过了社区和审查团队的审核。从这些目录中下载的任何内容可能相对较少错误。从其他来源获得的插件和主题可能包含恶意代码，所以请小心。你还可以通过查看评分、评论和流行度指标来了解社区对这些下载的看法：

• 你可以在wordpress.org/themes/找到主题目录

• 插件目录位于wordpress.org/plugins/

下面是 WordPress 主题目录的截图：

摘要

在当今时代，拥有自己的网站至关重要，无论您是个人还是小型企业，无论您是定期博客还是只想在网上发布一些准确静态内容。在本章中，我们回顾了有关 WordPress、博客和常见博客术语的基本信息，供那些对这一概念新的人参考。

WordPress 是一个出色的平台，可以运行您的网站（无论是博客还是其他类型）。它集成了最先进的功能，非常灵活，几乎可以做您想要做的任何事情，并且拥有丰富的在线资源。此外，它易于使用，您无需特殊技能或先前的经验即可与之合作。最后但同样重要的是，它是 100%免费的！

在下一章中，我们将探讨安装 WordPress 以及开始使用时涉及的选择和步骤。我们将介绍如何以多种方式安装 WordPress，如何熟悉 WordPress 管理面板，以及如何配置您网站的基本细节。

第二章：WordPress 入门

本章将指导你完成设置 WordPress 和自定义其基本功能的过程。你可以选择几个关于你的 WordPress 网站将驻留的选项。WordPress 是一个相对较小的软件包（小于 10 MB），同时易于安装和管理。

这里有一些重要的信息：

• WordPress 可以在wordpress.org/download/以易于下载的格式获得

• WordPress 是一个免费的开源应用程序，并且根据 GNU 通用公共许可证（GPL）发布，en.wikipedia.org/wiki/GNU_General_Public_License

这意味着任何生产软件修改版本的人都必须维护 GPL 提供的相同自由，然后购买或使用该软件的人也可以修改和重新分发它。因此，WordPress 和其他在 GPL 下发布的软件被维护为开源。

在本章中，你将学习以下内容：

• 在外部网络主机上设置 WordPress

• 手动安装 WordPress——在外部主机上以及本地开发和测试

• 在 WordPress 管理面板（wp-admin）中执行基本设置任务

这些是你的绝对 WordPress 基础。学习这一章的内容将为你进入 WordPress 世界提供一个良好的开端。

构建你的 WordPress 网站——从这里开始

你必须做出的第一个决定是你的博客将放在哪里。创建网站时，你有两个基本选项：

• 要么去WordPress.com并注册一个免费（或付费）网站（这样，网站会为你安装）

• 或者，前往 WordPress.org 并使用 WordPress 的开源版本——通过在你的服务器或第三方托管公司的服务器上安装它

让我们来看看这两种选项各自的优缺点。

WordPress 的两个世界——WordPress.com 和 WordPress.org 之间的区别

WordPress 生态系统的这个方面有点令人困惑，但基本上有 WordPress 的两个版本可供选择。为了使这更简单，让我直接使用你可以找到它们的网站地址：

• WordPress.com (wordpress.com/)

• WordPress.org (wordpress.org/)

惊讶的是，这两个网站并不指向同一个地方。实际上，它们指向两个完全不同的地方：

• WordPress.com 是一个商业网站建设解决方案。你可以去那里，注册一个账户，然后根据可用的设置和设计配置你的网站。

• WordPress.org 是一个开源网站软件。要使用它，你首先需要获取对网络服务器的访问权限——要么从托管公司租用它，要么在本地机器上设置一个服务器——然后你可以在其上安装 WordPress。

本书纯粹关于可以从 WordPress.org 获得的 WordPress 软件。我们不详细讨论 WordPress.com，因为它是一个功能不那么全面的商业服务。

优缺点

尽管 WordPress.org 是本书的主题，但仍有一些合理的理由让一些用户可能对 WordPress.com 感兴趣。使用 WordPress.com(wordpress.com/)的主要优势是，它负责为你处理所有技术细节。你只需负责管理你的内容。一个主要的缺点是你无法完全控制你的网站。其他优势和劣势如下：

• WordPress.com 不允许你上传或编辑自己的主题，尽管它允许你（付费）编辑已存在的主题的层叠样式表（CSS）。

• WordPress.com 不允许你上传或管理插件。一些插件默认安装（最著名的是用于垃圾邮件拦截的 Akismet，以及支持 Google Sitemaps、缓存、轮播幻灯片、图片库、投票、网站统计和一些社交媒体按钮的插件），但你既不能卸载它们，也不能安装其他插件。额外功能需要付费。

• 与 WordPress.org 的软件合作的一个主要优势是，你可以控制一切。你可以添加和编辑主题，添加和删除插件，如果你愿意，甚至可以自己编辑 WordPress 应用程序文件（然而，除非你对自己的 WordPress 技能有信心，否则不要这样做）。

• WordPress.org 的缺点是你必须自己保持 WordPress 软件的更新，在某些情况下还需要自己安装它，但这相对简单，我们将在本章中介绍。

哪个更适合使用

以下表格简要概述了使用 WordPress.com 与从 WordPress.org 下载包然后在自己的服务器上安装之间的基本差异：

	WordPress.com（在线平台/服务）	WordPress.org（开源软件）
安装	无需安装任何东西；只需注册即可。	你可以自己安装 WordPress，无论是手动还是通过你的主机控制面板。
主题	使用 WordPress.com 提供的主题(wordpress.com/)。	使用任何地方可用的主题，由任何人（甚至你自己）编写。
插件	无法添加第三方插件。	使用任何地方可用的插件，由任何人（甚至你自己）编写。
升级	WordPress.com 提供自动升级。	当有升级可用时，你必须自己升级。
小工具	小工具的可用性取决于可用的主题。	你可以自己将任何主题小工具化。
维护	你不需要进行任何维护。	你负责你网站的维护。
广告	不允许你自己的广告。然而，WordPress.com 有时会在你的网站上运行广告。	你可以自由地做任何广告，数量也由你决定。
所有权	即使内容属于你，WordPress.com 也可以随时认为内容不适当而关闭你的博客。	你对你的网站有完全的控制权，没有人可以强迫你关闭它。
域名	默认情况下，你的网站可以作为.wordpress.com下的子域名使用，但你也可以升级到付费套餐并使用你自己手动注册的域名。	你可以使用任何手动注册的域名。

总体而言，WordPress.org 对于那些想要了解 WordPress 平台的工作原理以及如何用它来构建优化和多功能网站的人来说是一个更好的选择。WordPress.com 可能更适合那些只需要快速建立网站的人。

获取并安装 WordPress

我们将介绍三种不同的安装 WordPress 的方法。

通过网络主机安装 WordPress

在大多数情况下，用户都会想在实时网站上安装并使用 WordPress——即公开可见的网站。最简单的方法是去一家流行的主机公司，从他们那里租用一些服务器空间，然后在该服务器上安装 WordPress。尽管一开始这可能听起来有些吓人，但实际上这个过程非常简单，在大多数情况下，主机公司会负责所有技术步骤。

这种方法的主要优势是，你实际上可以摆脱担心服务器配置的烦恼，而可以迅速开始使用你的 WordPress 网站。缺点——如果我们能称之为缺点的话——是，你无法从手动安装 WordPress 中获得教育价值。

如何选择 WordPress 的网站主机

有许多主机公司将自己标榜为某种形式的“WordPress 专用”。根据你手头的预算，你可以以每月 3-4 美元的价格获得优化的主机配置。在另一端，也有每月 100 美元或更多的先进配置。在选择适合你需求的公司时，考虑以下因素：

• 你的预算——如前一段所述

• 你想要同时托管多少个网站——可能只有一个

• 你预计网站会有多少流量——如果你刚开始，可能每月少于 5,000 位访客

• 你想要与之合作的公司的声誉——这可以通过像 ReviewSignal（reviewsignal.com/webhosting）这样的网站来检查

完成安装过程

为了展示安装过程是如何进行的，我们需要选择一个我们将用作示例的主机。查看 ReviewSignal 的评分，SiteGround 似乎位居榜首，在共享主机平台中拥有最好的用户评分。我们将选择这个作为我们的示例。请记住，这与其他大多数主机的工作方式相似，所以如果你选择不同的主机，你应该不会看到显著的差异。

要开始，请访问www.siteground.com/wordpress-hosting.htm：

1. 一旦进入，你可以点击下一个截图中最便宜的计划下面的注册按钮：

1. 在下一步中，你将能够为你的网站注册一个新的域名，或者如果你已经有了，可以连接现有的域名：

1. 下一步是输入你的个人信息并完成购买。有几件事情你可能需要特别注意——所有这些都在下一个截图中可见——是你的服务器位置和 SiteGround 提供的某些额外选项。

• 关于服务器位置，最好选择离你最近的位置。

• 对于额外选项，是否需要取决于你——它们不是强制性的。

一旦你完成这个设置，你将拥有一个准备就绪的新托管账户。现在唯一剩下的事情就是在这个账户上安装 WordPress。SiteGround 的好处是他们将为你处理整个安装过程。当你第一次登录到 SiteGround 的用户面板时，你会看到一个提示，询问你是否需要安装任何流行的网站平台——WordPress 是其中的一个选项。

在这里你需要做的只是向 SiteGround 提供你想要的 WordPress 登录详细信息，然后点击“确认”按钮。就这么多。完成这一步后，你将在 SiteGround 用户面板中看到一个新的 WordPress 实例。如果你点击“转到管理面板”，你将被重定向到主要的 WordPress 仪表板：

手动安装 WordPress

WordPress 可以通过多种不同的方式安装，如果你不想使用之前描述的“通过主机”方法，你可能对手动安装 WordPress 感兴趣。

手动安装可能有多个原因。首先，你可能想在本地服务器上使用 WordPress。其次，即使你在远程服务器上，那个服务器可能没有任何自动安装功能可用。这就是手动安装发挥作用的地方。

准备环境

一个好的第一步是确保您有一个为 WordPress 准备好的环境。这意味着您需要确保服务器满足最低要求，并且您的数据库已经就绪。为了 WordPress 能够运行，您的网络主机必须提供满足以下要求的服务器：

• 支持 PHP 版本 5.2.4 或更高版本（建议使用 PHP 7.2+）

• 提供版本 5.6 或更高版本的 MySQL 数据库（完全访问权限）（或者，MariaDB 版本 10.0 或更高版本）

这些最低要求有时会发生变化。最新的要求始终可以在 wordpress.org/about/requirements/ 找到。

您可以通过联系您的网络主机提供商的支持团队来确定您的托管服务是否满足这两个要求。如果满足，您就可以继续进行下一步了。

本地安装 WordPress

为了测试 WordPress，您实际上并不需要访问一个实时网络服务器。您也可以在本地服务器上进行测试，并在需要时仅将您的网站部署到公共领域。与本地 WordPress 一起工作的最常见方式是在 XAMPP 服务器上安装它。XAMPP 可用于 Windows、Mac 和 Linux，并且是免费的。您可以从 www.apachefriends.org/index.html 获取它。

XAMPP 的官方网站提供了一些关于如何设置服务器的指南，但如果您需要更详细的教程，请参阅 themeisle.com/blog/install-xampp-and-wordpress-locally/。

下载 WordPress

一旦您检查了您的环境，您需要从 wordpress.org/download/ 下载 WordPress。那里有一个显眼的蓝色下载按钮，很难错过。点击它后，您将获得最新版本的 WordPress 软件的 .zip 归档。将此归档提取到您的桌面上将为您提供一个名为 wordpress 的目录。这个目录本身作为一个独立的东西并不是很有用。为了使其工作，您需要以某种方式将其上传到您的网络服务器。这将在本章的下一部分中介绍。

如果您正在本地服务器上设置，您只需将那个 WordPress 目录复制到本地服务器运行的地方即可。如果您正在远程服务器上工作，您将需要使用第三方工具上传 WordPress。我将在下一部分向您展示如何操作。

上传文件

我们需要使用任何 文件传输协议（FTP）客户端将所有 WordPress 文件上传到我们的网络服务器。互联网上有几个 FTP 客户端可供选择，它们要么是免费软件（无成本）要么需要少量费用。如果您还没有 FTP 客户端，可以尝试以下之一：

• Filezilla：filezilla-project.org/download.php?type=client（适用于 Mac、Windows 或 Linux）

• Fetch：fetchsoftworks.com/（仅适用于 Mac）

• SmartFTP：www.smartftp.com/（仅适用于 Windows）

关于安全性的说明

在可能的情况下，你应该使用安全 FTP（sFTP）而不是普通 FTP。如果你使用 sFTP，所有发送和接收的数据都是加密的。使用 FTP 时，数据以纯文本形式发送，很容易被黑客截获。检查你的 FTP 软件和托管选项，如果可用，请选择 sFTP。

下面是使用 FTP 安装 WordPress 的过程：

1. 使用你的 FTP 客户端，通过服务器地址、用户名和密码连接到 FTP 服务器，这些信息由你的托管商提供。（如果你不确定这些是什么，你总是可以联系你的网络托管商支持，并要求支持代理提供这些详细信息。）

2. 接下来，打开你希望 WordPress 存在的文件夹。你可能想在根目录中安装 WordPress，这意味着访问你的主 URL 时，访客将看到你的 WordPress 网站主页——例如，http://yoursite.com。或者，你可能想在子文件夹中安装 WordPress，例如，http://yoursite.com/blog/。请参考以下截图：

1. 在左侧，你会看到你本地文件夹中的文件，在右侧，你会看到你的远程文件夹。（请注意，你使用的 FTP 客户端可能会有略微不同的布局，但这是一个大致的概念。）

2. 现在从左侧选择你本地机器上的所有 WordPress 文件，并将它们拖到右侧面板。你可以看到你的 FTP 客户端逐个上传文件，它们出现在右侧面板上。这可能需要几分钟，所以请耐心等待。

3. 如果你是在本地服务器上安装 WordPress，只需确保将 WordPress 文件放置在电脑上正确的webroot目录中。

一旦所有文件都已上传，你就可以开始安装了。

完成 WordPress 的屏幕设置

到这一步，就到了进行著名的 5 分钟 WordPress 安装的时候了。（WordPress 可以在 5 分钟或更短的时间内安装的事实在官方 WordPress 网站上广泛宣传。）

1. 如果你通过网页浏览器访问你新 WordPress 网站的主网站 URL，你会看到一个简短的介绍信息，指导你选择你想要进行安装的语言：

1. 之后，你将看到一个屏幕，告诉你完成安装所需的所有详细信息。目前，这些详细信息如下：

   • 数据库名称：例如，这可以是wptestblog。

   • 数据库用户名：例如，这可以是localdbuser。

   • 数据库密码：例如，62dcx%^_0hnm——密码越复杂越好。

   • 数据库主机：这是您网络服务器数据库的主机地址。如果您在本地运行服务器，这将将是localhost。如果您尝试在第三方网络主机上运行 WordPress，这将是指向该主机数据库服务器的地址。

因此，最大的问题是哪里可以获取所有这些信息。答案是您的网络主机。大多数大型网络主机都提供了一种通过在线控制面板创建您自己的数据库的方式，您可以选择用户名和密码。如果您不确定如何操作，只需发送电子邮件或打电话给您的托管提供商寻求帮助。专业的支持团队将乐意帮助您。

1. 一旦您有了这四个参数，您可以按下“让我们开始！”按钮，进入安装的下一步。以下是一个主要设置表单的截图：

如您所见，这些细节与之前截图中的相同。当然，您的细节可能会有所不同。另外，还有一个需要注意的重要点是，有一个额外的字段标记为“表前缀”。这是您数据库中每个表名称之前默认的前缀。该字段的默认值是wp_。建议您将其更改为您选择的两个或三个字母的单词，并以下划线（_）结尾，作为防止对已知 WordPress 表的标准数据库攻击的安全预防措施。

1. 点击“提交”按钮后，您将被重定向到最后确认页面。在这里，您只需点击“运行安装”按钮。在线安装进行顺利的最佳迹象是以下屏幕的出现：

1. 这是最后的设置页面。在这里，您设置您新站点的核心细节。现在，填写安装表单（您稍后可以更改所有这些，所以不必过于担心被锁定在您的选择中）：

   • 网站标题：填写您博客的名称（可以是简单的名称，例如每日烹饪）。

   • 用户名：选择一个不明显用户名对您最有利。例如，如果您选择admin，那么对于可能想要黑入您博客的人来说，这将非常容易猜测。还有一点值得指出的是，这个账户是管理员账户，它拥有对网站所有区域的最高权限和访问权限。选择一个难以猜测的，例如Site-Master-45，并且不用担心，愚蠢是好的。

   • 密码：选择一个安全的密码，它应该包含大小写字母、数字以及一些标点符号。WordPress 在这里为你提供了一些选项。

   • 您的电子邮件：请确保这是正确的。这是 WordPress 将用来联系您关于博客、评论等的电子邮件地址。如果您在安装 WordPress 后不久没有收到电子邮件，请检查您的垃圾邮件文件夹。

   • 搜索引擎可见性：这是列表中的最后一个复选框，但可能是最重要的设置之一。如果您不勾选它（推荐），您的网站将通过 Google 和其他搜索引擎访问。勾选它意味着禁止搜索引擎访问您的网站。

2. 现在，点击“安装 WordPress”。

安装完成！WordPress 将现在通过主登录页面欢迎您 - 这就是您访问网站主管理面板的地方（也称为 wp-admin）。或者，您也可以通过将浏览器指向 http://yoursite.com/wp-admin 来进入管理面板。如果您尚未登录，此 URL 将将您重定向到登录页面。

学习更多

如果您想查看更详细的分步指南以进行手动安装，请查看 WordPress 代码库中的此页面：codex.wordpress.org/Installing_WordPress。

此外，如果您访问 codex.wordpress.org/Getting_Started_with_WordPress#Installation，您将找到额外的安装说明以及更改文件权限、使用 FTP、从其他博客引擎导入等方面的具体信息。

通过自动安装脚本安装 WordPress

一些网络托管商为他们的客户提供访问各种自动安装脚本的权限，包括 WordPress。这些自动安装器中的大多数功能相当相似，安装新 WordPress 网站的实际过程也相似。在这里，我们将关注这些脚本中的一个，Softaculous (www.softaculous.com/)。

这又是安装 WordPress 网站的一种方式，我们在这里介绍它是为了使这本书尽可能完整。然而，如果您已经使用前面描述的方法成功安装了您的网站，那么这个部分在这一点上对您来说将没有任何用处。

Softaculous 是许多专业开发人员和博客作者的 WordPress 安装首选方法。在某些情况下，当处理由新网络托管商维护的全新托管账户时，它可能是最快的方法。Softaculous 可用于运行在许多管理平台上的托管账户，例如 cPanel、Plesk、DirectAdmin、InterWorx 和 H-Sphere。很可能，您的托管账户正在使用这些平台之一。以下截图显示了 cPanel，这是最受欢迎的平台之一：

尽管不同平台有不同的用户界面，但从用户的角度来看，核心功能基本上保持不变。要访问 Softaculous，只需向下滚动，直到您看到标有 Softaculous 的主要部分（或图标）。一旦到达那里，您可以在其他图标中看到 WordPress 图标：

使用此脚本的整个想法是使事情更快、更无烦恼，这样您就不必手动创建数据库或设置配置文件。Softaculous 将为您处理所有这些。以下是为创建网站表单：

请记住，这些界面可能会不时更改，所以根据您阅读这本书的时间，您的 Softaculous 面板可能看起来不同。不过别担心，它肯定同样容易理解。以下是对您可能看到的所有字段及其应包含的详细信息的说明：

• 选择协议：您可以保留默认值 http:// 或如果可用，更改为 https://。

• 选择域名：如果您有多个域名分配给您的托管账户，那么您可以选择在这里使用哪一个。对于单域名账户（很可能是这种情况），此下拉字段只有一个选项。

• 在目录中：如果您想在子目录下安装 WordPress 网站，那么在这里输入其名称（只需名称）。如果您想将网站安装到主目录（http://yoursite.com/），那么请确保该字段为空。

• 数据库名称：您可以放心地使用默认值。

• 表前缀：如本章前面所讨论的，您可以将其更改为唯一的名称（在我的例子中，是 wp_）。

• 网站名称：这是您网站的名称（在本例中，为“我的博客”）。

• 网站描述：这是标语（在本例中，为“我的 WordPress 博客”）。

• 启用多站点（WPMU）：除非您是计划启动多站点安装的高级用户，否则请保持此选项未选中。

• 管理员用户名、管理员密码和管理员邮箱：这些是管理员账户的详细信息，类似于我们在手动 WordPress 安装期间必须提供的那些。

• 选择语言：WordPress 有多个本地化版本的平台，不仅仅是英语，您可以选择其中一个。

点击“安装”按钮开始安装过程。该过程本身不需要监督，大约 1 到 2 分钟后安装完成，您就可以访问您的网站。您可以通过标准 URL http://yoursite.com/ 和 http://yoursite.com/wp-admin/ 来检查安装是否成功。换句话说，这是通过 Softaculous 完成的安装过程的结束。如您所见，它比手动安装简单得多，也快得多。此外，Softaculous 总是安装 WordPress 的最新版本，因此您不必担心得到过时的东西。

您也可能遇到其他自动安装脚本，它们与 Softaculous 类似，例如 Fantastico、Installatron、MOJO 和 SimpleScripts。

wp-admin 面板

WordPress 安装了一个强大且灵活的管理区域，你可以管理你网站的所有内容以及更多。在整个书中，这将被简称为wp-admin、WP Admin，在某些情况下称为WordPress 仪表板。

现在你已经成功安装了 WordPress，是时候看看wp-admin了。有一些立即的基本更改建议，以确保你的安装设置正确。

你可以通过访问http://yoursite.com/wp-admin/（这个 URL 也是我们称之为wp-admin的原因）始终进入wp-admin。如果你是第一次去那里，你将被重定向到登录页面。将来，WordPress 将检查你是否已经登录，如果是的话，你将跳过登录页面。

要登录，只需输入你在安装过程中选择的用户名和密码。然后，点击“登录”。

每次你登录时，你都会直接进入wp-admin的仪表板部分。以下是你登录后立即看到的wp-admin的截图：

你会看到很多信息和选项，我们将在整本书中探讨这些内容。现在，我们将专注于成功安装后需要考虑的项目。首先，让我们简要了解一下wp-admin和主要仪表板部分。最上面的栏，被称为顶部栏或管理栏，主要是深灰色，包含以下内容：

• 一个悬停时出现的下拉菜单，通过悬停在左上角的 WordPress 标志上触发，包含一组链接到关于 WordPress（关于当前 WordPress 安装的一些细节）、WordPress.org、文档、支持论坛和反馈

• 一个链接到你的 WordPress 网站首页（在这个例子中，整个站点的标题是每日烹饪），可点击的房子图标

• 包含指向最新评论或挂起更新的更新和活动部分

• 一个悬停时出现的带有便捷链接的新帖子、新媒体、新页面和新用户的滚动下拉菜单，由悬停在加号图标上触发

• 最后，在最右边，是你的用户链接到你的个人资料，这是一个包含一个标记为“编辑我的个人资料”的链接的另一个下拉菜单，最后是登出链接

你还会注意到“屏幕选项”标签，它在wp-admin中的许多屏幕上都会出现。如果你点击它，它将滑动展开页面上的项目清单，以显示或隐藏。这将在每个页面上有所不同。我鼓励你通过检查和取消选中项目来尝试这个元素，以确定你是否需要它们：

在“屏幕选项”标签旁边，您将找到“帮助”标签。就像“屏幕选项”标签一样，这个标签出现在wp-admin中的许多屏幕上。无论何时您对某个特定屏幕有疑问，您都可以始终检查“帮助”标签以获取说明。访问“帮助”标签总是比在网上搜索解决方案更快，在大多数情况下也更有效。

屏幕左侧是主菜单：

您可以点击主菜单中的任何单词，即可跳转到该部分的专用页面，或者将鼠标悬停在某个链接上，查看您可以访问的所有可能的子部分。例如，如果您将鼠标悬停在“设置”上，您将看到“设置”部分的子页面，此时，您可以点击任何一个子页面或主“设置”链接本身：

顶部菜单和主菜单存在于wp-admin中的每一页。右侧的主要部分包含您当前所在页面的信息。在这种情况下，我们处于“仪表板”部分。它包含有关您的博客以及 WordPress 一般信息的框。

在 WordPress 的新版本中，当您第一次登录时，您将看到一个欢迎信息，类似于以下内容：

简而言之，欢迎面板允许您只需单击一下即可访问wp-admin的一些关键部分。一旦您点击“忽略”链接，登录后该面板将不再显示。在其当前版本中，该面板允许您执行以下操作（从左上角到底右角）：

• 定制当前主题，但前提是主题提供一些定制功能（并非所有主题都提供）

• 将当前主题更改为新的主题

• 编辑首页

• 创建新页面

• 写您的第一篇博客文章

• 查看您的网站

• 管理菜单和小工具

• 开启或关闭评论（默认情况下是开启的）

• 了解如何开始使用 WordPress 的更多信息，这是一个指向codex.wordpress.org/First_Steps_With_WordPress的外部链接

在本章和接下来的章节中，我们将了解管理 WordPress 网站的所有关键方法，一旦我们积累了一些经验，随着时间的推移，这个欢迎面板可以使我们的日常工作变得更加快捷。因此，让我们直接进入一般网站设置部分。

在这本书中，所有关于在wp-admin中导航到哪个页面的说明都由短语如“导航到设置 | 一般”或“导航到文章 | 添加新文章”来表示。这总是描述了您应该通过主菜单采取的路径。

更改一般博客信息

在成功安装后，你可能需要更改或添加一些一般博客信息（例如博客标题或一句话描述），以便正确设置和运行你的网站。要开始这一过程，请导航到主菜单中的“设置”：

在这里你可以设置许多选项，其中大多数都是不言自明的。我们将查看最重要的几个。显然，你可以更改博客的标题。例如，我的博客叫做“每日烹饪”。你也可以更改博客描述，这在大多数主题中用作博客的副标题，就像一本书的副标题一样。默认描述是“又一个 WordPress 网站”。你可能想更改它。让我们将其更改为“探索每周每一天的烹饪”：

在这个页面上，你可能想查看的一个选项是时区设置。无论你是否有一个带有每篇帖子时间戳的博客，WordPress 知道你所在的时区都是很重要的。尤其是当你想要为未来安排页面或帖子、显示用户准确的时间戳，或者只是确保电子邮件通知正确的时间戳时。此外，如果你计划在国际上发布内容，意味着你的目标受众位于完全不同的地理位置，将时区设置为代表你的目标受众而不是你自己是很好的。

下拉菜单将显示不同的 UTC 设置，以及世界上最大的城市。只需选择你喜欢的时区中的一个城市。保存更改后，页面下方（在“时间格式”旁边）显示的时间将更改为你选择的时间，这样你可以检查并确保它是正确的。

页面上另一个值得考虑的功能是是否允许用户在你的网站上注册。对于大多数网站来说，这并不是特别有用，但如果你计划使网站成为社区驱动的或利用某种形式的众包，那么这可能值得考虑。在这种情况下，不建议给新用户分配高于“订阅者”（默认值）的用户角色。

当你完成对这个页面的更改后，务必点击页面底部的“保存更改”按钮。

最后，在发布任何内容之前，您应该在您的新网站设置中调整最后一个组件：永久链接。正如 WordPress 所定义的，永久链接是您各个页面、博客文章、分类和标签的永久 URL。默认情况下，WordPress 使用一个高度未优化的 URL 结构来链接您的新帖子。例如，如果您创建了一个标题为如何烹饪史上最美味的餐点的文章，WordPress 将链接为http://yoursite.com/?p=123（或类似的内容）。这种结构的主要问题是它没有表明页面内容。您的访客和谷歌都无法猜测。在谷歌的情况下，这种结构也可能对您的未来搜索引擎排名产生重大影响。因此，为了设置一个更优化的结构，您可以前往设置 | 永久链接。以下是可用的设置：

从访客和谷歌的角度来看，最佳设置是标记为“Post name”的选项。回到如何烹饪史上最美味的餐点文章的例子，如果您将永久链接设置为“Post name”，则该文章的 URL 将是http://yoursite.com/how-to-cook-the-best-meal-ever/，这要清晰得多，也更可预测。您可以在任何时候随时在codex.wordpress.org/Using_Permalinks上查看有关永久链接的官方信息。

页面下方还有可选的设置，用于“Category base”和“Tag base”。默认情况下，“Category base”设置为category。例如，如果您有一个名为recipes的分类，那么您可以在http://yoursite.com/category/recipes下查看该分类下的所有文章。

一些网站所有者更喜欢将其更改为更用户友好的名称，例如，topics。尽管这传达了相同的信息，但对于不太熟悉网络内容发布标准的访客来说，这可能更容易理解。最终，您的分类基础完全取决于您的决定。另一方面，标签基础很少需要任何调整。

恢复丢失的密码

如果您丢失了密码并且无法进入您的wp-admin面板，您可以通过点击登录页面上的“Lost your password?”链接轻松找回它。新生成的密码将通过您在安装过程中提供的电子邮件地址发送给您。这就是为什么您需要确保输入一个有效的电子邮件地址。否则，您将无法找回您的密码。

获取 Gravatar

本章最后一点值得讨论的是 WordPress 头像的问题。尽管 WordPress 在这个领域提供了一些可能性，但最受欢迎的一个是围绕一个外部服务，即全球认可的头像（Gravatar）。Gravatar 最初是一个旨在让人们在整个网络中使用相同的个人资料图片（头像）的工具。

用通俗易懂的话来说，这意味着每次你注册一个网络服务，如果这个服务是 Gravatar 兼容的，那么它将自动从 Gravatar 获取你的个人资料图片，而不是强迫你从电脑上手动上传。除了个人资料图片外，Gravatar 还为你提供了一个个人在线资料，任何人都可以在点击你的（Gravatar）个人资料图片或称为悬停卡的东西时看到。现在，这一切与 WordPress 有什么关系呢？好吧，WordPress 是那些广泛支持 Gravatar 在平台所有可能领域的服务和工具之一。例如，如果你创建了一个新的博客并使用了一个与 Gravatar 连接的管理员电子邮件地址，你的 WordPress 个人资料图片将立即被 Gravatar 提供的图片所替换。此外，如果你用 Gravatar 电子邮件地址在任何 WordPress 博客上评论，你的个人资料图片将被设置为评论本身的头像。

要设置自己的 Gravatar，只需访问en.gravatar.com/并点击“创建您的 Gravatar”按钮。你将看到一个 Gravatar 的注册表单。由于 Gravatar 是 WordPress.com 的一部分，如果你已经有了 WordPress.com 账户，你可以登录。如果没有，你可以创建一个新的账户。字段相当标准，系统会提示你输入你的电子邮件地址、你首选的用户名和密码。

一旦你完成了注册过程，你就可以最终设置你的 Gravatar。在主“管理 Gravatar”页面（可通过顶部菜单访问），有一个标记为“添加新图片”的链接——这就是你可以上传 Gravatar 的地方。Gravatar 的好处是你可以选择从哪里获取图片。你可以从电脑上传，从网络上的其他地方获取（例如，从指向你的 Facebook 个人资料图片的直接链接），或者使用你之前作为 Gravatar 上传的图片。

在下一步中，Gravatar 允许您裁剪和调整您的图像。当您对最终结果满意时，您可以点击大按钮并进入您图像的评分设置。每个 Gravatar 都可以分类为G 级、PG 级、R 级或X 级。事实上，如果您选择除G 级之外的内容，您的 Gravatar 不会在所有网站上显示。因此，只上传合适的图像是一个好习惯。完成这一步后，从现在开始，您的 Gravatar 已经设置好并准备好使用。Gravatar 还允许您将多个电子邮件地址关联到单个账户，以及使用多个图像。这实际上是一个很棒的功能，因为您只需一个 Gravatar 账户就可以管理您每个电子邮件地址和在线身份的每一种形式。

现在，您可以回到您的 WordPress 博客并检查您的新 Gravatar 是否已出现在 wp-admin 中的个人资料部分（前提是您已使用相同的电子邮件地址为账户设置）。

摘要

您在本章中学到了很多。您现在知道如何在远程服务器以及本地服务器上安装 WordPress，然后更改您网站的常规设置。您还对如何通过 Gravatar 处理您的在线形象或品牌有了基本了解。

在下一章中，您将学习如何创建您的第一篇博客文章和其他类型的内容，如何处理评论和调节讨论，以及博客/网站管理的其他关键方面。

第三章：创建博客内容

现在您的 WordPress 安装已经启动并运行，您准备好开始创建内容了。学习如何有效地做这件事将帮助您更好地与您的受众产生共鸣，并为他们提供优化且易于消费的内容。在本章中，您将学习以下主题：

• WordPress 管理仪表板（也常称为wp-admin）的工作原理以及如何在其中找到你的路径

• 如何撰写新的博客文章

• 如何控制与博客文章相关的所有信息，不仅仅是标题和内容，还包括图片和媒体

• 如何处理评论——它们的作用以及如何管理它们

• 如何使用标签和分类来保持内容组织良好且易于搜索

WordPress 管理约定

在wp-admin中，您有权管理多种不同类型的内容和排序内容的方式，包括文章、分类、页面、链接、媒体上传等。WordPress 为各种屏幕使用类似的格式。让我们在这里探索它们。

项目列表

在 WordPress 中可以管理的每种内容类型都有一个独立的专用屏幕，列出了所有单个内容项。由于本章是关于创建文章的，让我们看看文章列表的例子：

如您所见，内容类型的名称位于顶部（在这种情况下，它是文章）。项目列表也有包含各种其他信息的列：

• 列表中的每个项目都显示了其标题。您始终可以点击项目标题来编辑它。

• 如果你将鼠标悬停在特定的行上，就像我在前面的屏幕截图中将鼠标悬停在“Hello world!”上一样，你会看到四个额外的链接。前三个始终相同（编辑、快速编辑和回收站），而第四个则根据我们处理的是已发布的文章还是待发布文章而变化。编辑、回收站和查看/预览链接相当直观，但快速编辑链接需要额外说明。当你点击它时，你会看到一个面板，允许你执行一些简化的编辑（只是基本细节和参数，没有实际内容编辑）：

• 您可以做出更改，然后点击更新，或者如果您改变了主意，可以点击取消。

• 在文章列表上方区域，您可以选择查看所有（文章）、已发布（文章），以及草稿、待审和回收站。目前，我的列表上只有所有、草稿和已发布的文章。然而，随着时间的推移，列表肯定会变得更加丰富，因为我们将继续撰写新的文章（这同样适用于您的网站）。

• 在这些链接下方是批量操作菜单及其相应的应用按钮。通过点击它们的复选框（或勾选顶部的复选框以选择所有项目）选择一个或多个帖子。然后，从批量操作菜单中选择编辑或移动到回收站，并在点击应用后，您将能够批量删除或批量编辑这些帖子。此外，从某种意义上说，在您安装一些第三方插件后，您会注意到这个批量操作菜单可能包含标准两个选项（编辑和删除）之上的更多选项。

• 过滤器菜单允许您从日期和分类下拉列表中选择选项，然后点击过滤器按钮，仅显示符合这些标准的条目。

• 搜索字段以及搜索帖子按钮提供了另一种过滤您帖子的方式，以找到您正在寻找的具体帖子。一开始这可能看起来不是一个特别有用的功能，但一旦您在网站上发布了超过，比如说，200 篇帖子，找到单个条目就变得相当具有挑战性。

• 在顶部是屏幕选项下拉菜单。这个标签页，它出现在 WordPress 仪表板的每个屏幕上，将允许您隐藏或显示特定的列，并选择每页显示的项目数量。

现在，让我们继续本章的主要话题——发布内容。

在博客上发布帖子

您将在博客中执行的主要活动是添加帖子。一篇帖子就像杂志中的一篇文章；它需要一个标题、正文内容和作者（在这种情况下，WordPress 允许多个作者为博客做出贡献）。博客帖子还附有许多其他信息，例如日期、摘要、标签和分类。在本节中，您将学习如何创建新帖子以及将其附加的信息类型。

添加简单帖子

无论何时您想要添加内容或对您的 WordPress 网站进行维护，您都必须先登录到您网站的WordPress 管理面板（wp-admin）。要进入管理面板，请在您的网络浏览器中打开https://yoursite.com/wp-admin。

请记住，如果您在子目录（例如，blog）中安装了 WordPress，那么您的 URL 必须包含该子目录（例如，https://yoursite.com/blog/wp-admin）。

从这里，有两种方法可以进入允许您添加新帖子的屏幕：

• 从 WordPress 仪表板的主侧边栏菜单转到帖子 | 添加新帖子

• 点击 WordPress 仪表板顶部栏的+ 新建按钮，然后点击帖子（参见图示）：

一旦您到达帖子创建面板，您将看到主要内容编辑器。下一节将解释如何使用它。

在基于块的编辑器中工作

基于块的编辑器是 WordPress 的最新、最强大的功能。该项目最初以Gutenberg的名字开始，在经过大约两年的开发后，最终作为 WordPress 5 的主要内容编辑工具被包含在内：

在前面的屏幕截图中，您可以看到基于块的编辑器的主视图。同时请注意，提供帮助的入门提示，在您首次接触新编辑器时提供协助。

那为什么它被称为“基于块的”编辑器呢？因为编辑器处理内容和管理其结构的方式。您在帖子或页面中的内容被划分为一个个单独的块，一个接一个，整齐地排列在一个（数字）画布上。

在基于块的编辑之前，WordPress 使用了一个传统的所见即所得编辑器。它使用经典的段落结构——这种方法与构建 Google 或 Word 文档的方式非常相似。然而，这种传统的结构并不总是适合处理现代网络的内容需求。换句话说，它使得构建复杂、视觉上令人愉悦的博客文章或页面，并在不同设备上有效地展示它们变得困难。

基于块的编辑更有意义，因为每个内容块都可以单独处理，并根据查看内容的设备以不同的方式处理。此外，比段落更容易重新排列块。

那么，一个“块”实际上可以是什么？想想看可以放在网页上的所有东西。这包括以下内容：

• 文本块

• 图片

• 视频

• 引用

• 标题

• 表格

• 按钮

• 来自第三方网站（如 YouTube 或 Facebook）的嵌入

• 以及更多

本章的下一段描述了如何使用基于块的编辑器来创建您的第一篇博客文章。

理解编辑器界面

编辑器（帖子 | 添加新帖子）由三个主要部分组成，如下面的屏幕截图所示：

1. 主要画布：这是主要的内容编辑区域，您将在其中完成大部分工作

2. 设置侧边栏：这允许您更深入和细致地调整整个文档以及单个内容块

3. 顶部菜单栏：这是您处理各种管理任务的地方

这里是顶部栏中可用的更近视图：

我们将审查从左边开始的符号：

• +图标允许您向文档中添加一个新的块。

• 下两个是撤销和重做按钮。

• i 图标为您提供有关文档内容结构的一些信息（包括单词数、标题、段落和块的数量）。

• 带有三个水平条的图标允许您在编辑内容时在页面上已存在的块之间导航；它提供了快捷链接。

• 然后，在右侧，您有预览和发布按钮。

• 旁边是 齿轮 图标——这个图标可以切换设置侧边栏的开启和关闭。

• 最后，有一个带有三个垂直点的图标。这个图标可以让您启用额外的屏幕元素，使您在文档中的工作更加直接（例如，您可以进入无干扰模式，一次关注一个块，查看键盘快捷键等）。

我鼓励您自己尝试这里可用的功能。

创建您的第一篇博客文章

现在我们已经了解了基于块的编辑器界面的情况，是时候开始着手我们的第一篇博客文章了！

1. 首先，在“添加标题”处输入您的博客文章标题：

1. 完成后，将鼠标光标移到下一行并开始键入您的文章：

当您开始键入时，您会立即看到现在有各种编辑工具可供使用。您可以调整文本到左对齐、右对齐和居中对齐。您可以使用粗体或斜体，甚至为您的内容添加链接。要添加项目符号列表，只需按下键盘上的Enter键，然后从下一行开始使用连字符(-)。它将自动转换为列表项。

1. 要删除一个块或对其执行其他操作，您可以点击格式选项旁边的三个点：

1. 除了这些，当您编辑任何块时，您可以在右侧的设置侧边栏中看到该块的具体选项。例如，对于段落块，您可以调整字体，添加首字下沉，更改文本颜色，并进行一些高级修改，所有这些都可以在以下屏幕截图中看到：

在页面上添加我们的第一段文本后，现在让我们添加一张图片。

1. 要做到这一点，请点击屏幕左上角的 + 图标。从下拉菜单中选择图片：

1. 您将看到一个新的图片块被添加到页面上：

1. 该图片块允许您上传新的图片，从媒体库中选择它，或从 URL 插入。最常见的方法是从您的电脑上传新的图片。完成此操作后，您将看到一些针对图片的非常有用的选项。在其他事情中，您可以更改图片的对齐方式，更改其大小，添加标题，在图片上添加链接等。请参考以下屏幕截图：

1. 继续使用相同的方法，我们可以在画布上添加各种其他块，从而最终得到一篇相当吸引人的博客文章。例如，作为一个实验，我创建了以下博客文章：

它包括以下内容：

• 一个标准的文本段落

• 一张设置为宽的图片

• 另一段文本

• 一个项目符号列表

• 一个引用

现在我们已经建立了一些“构建块”，我们将看看如何使用它们来完善我们的帖子。

对齐块和构建帖子布局

基于块的编辑器最出色的特点之一是其多功能性和功能性。移动东西和微调你的博客帖子直到它看起来完美无缺是非常容易的。

将内容块一个接一个地添加——就像我们在上一步中所做的那样——只是硬币的一面。同样令人印象深刻的是，你可以拖放块来重新排列它们，或者使用箭头按钮将给定块向上或向下移动：

在前面的屏幕截图中，你可以看到三个图标。当你将光标悬停在块上时，它们会出现：

• 上箭头和下箭头可以将当前块向上或向下移动一个位置——这为切换文本和图片或对帖子布局进行任何其他简单调整提供了一个很好的方法。

• 中间的那个按钮——六个点的网格——允许你使用拖放；只需用鼠标抓住那个图标，并将其拖到帖子当前块序列中的任何位置。

你还可以直接在画布上已经存在的块下方或上方添加新的块。要做到这一点，将光标悬停在给定块的顶部或底部边界附近。会出现一个新的+图标，如以下屏幕截图所示。点击该+图标，就可以在所需位置添加一个新的块：

当你准备好并且喜欢你的帖子外观时，是时候发布它了。要做到这一点，点击右上角的蓝色“发布”按钮。当你这样做时，你会看到一个最终的确认屏幕（我们将在下一节中回顾该屏幕上的其他选项）。再次点击发布按钮，你的帖子就会上线：

当过程完成后，你仍然会看到自己还在同一个屏幕上，但现在，以下消息将会出现，告诉你你的帖子已经发布，并且你可以通过点击“查看帖子”链接来查看：

如果你查看网站的首页，你会看到你的新帖子已经被添加到顶部。

常见帖子选项

现在我们已经回顾了创建帖子的基础知识，让我们看看在添加新帖子或编辑现有帖子时可用的一些其他选项。在本节中，我们将查看最常用的选项，在下一节中，我们将查看更高级的选项。

分类和标签

分类和标签是你可以添加到博客帖子中的两种信息类型。我们使用它们通过主题和内容（而不仅仅是日期）来组织你的博客中的信息，并帮助访客在你的博客中找到他们想要的内容：

• 分类主要用于结构化组织。它们可以是分层的，这意味着一个分类可以是另一个分类的父分类。一个相对繁忙的博客可能至少有 10 个分类，但可能不会超过 15 或 20 个。在这样的博客中，每篇文章可能被分配一到四个分类。当然，提到的数字只是建议；你可以创建和分配你喜欢的任意数量的分类。例如，一个关于美食和烹饪的博客可能有以下这些分类：食谱、美食讨论、媒体报道、食材和餐厅。你如何组织分类完全取决于你。在 WordPress 世界中，这方面没有真正的规则，只有像这样的指南。

• 标签主要用于简短描述特定博客文章中涵盖的主题。一个相对繁忙的博客可能会有 15 个甚至 100 个标签在使用中。在该博客中，每篇文章可能被分配三到 10 个标签。例如，一篇关于南瓜汤食谱的美食博客文章可能有以下这些标签：汤、素食、秋季、热和简单。同样，你可以创建和分配你喜欢的任意数量的标签。

为了演示这一切是如何工作的，让我们向博客添加一篇新文章。在给它一个标题和一些内容后，让我们继续分配一些新标签。要添加标签，查看基于块的编辑器中的设置侧边栏，切换到“文档”选项卡。从那里，点击“标签”切换以启用它，就像以下截图所示：

添加标签非常简单；只需将你的标签列表输入到空白框中。用逗号分隔它们以定义一个标签的结束和另一个标签的开始。当你输入时，标签将自动分配。如果你想删除一个标签，点击它旁边的 x 图标，就像以下截图所示：

使用这种方法分配的每个标签都将添加到你的博客标签目录中。下次你开始输入相同的标签时，WordPress 会自动建议。

分类与标签的工作方式略有不同。一旦你的博客开始运营，你通常只需在设置侧边栏的分类部分勾选现有分类的复选框。然而，当你刚开始创建第一个分类时，你需要手动创建它们。要添加新分类，查看基于块的编辑器中的相同设置侧边栏，切换到“文档”选项卡，然后点击“分类”切换以启用它：

点击“添加新分类”链接。将你的分类输入到文本框中，然后点击“添加新分类”按钮。你的新分类将显示在列表中，已经勾选，就像以下截图所示：

分类和标签不仅有助于组织你博客上的帖子。它们还承担着另一个重要的功能：搜索引擎优化。为了增加你的帖子在相关在线搜索中显示的可能性，从而增加网站访问量和观看次数，选择正确的分类和标签将大有裨益。

帖子中的图片

WordPress 使添加图片到你的帖子变得容易，控制默认图片大小，对图片进行一些编辑，并为你的帖子指定一个特色图片。

在帖子中添加图片

在本章的早期部分，我们学习了如何将简单的图片添加到博客帖子中。现在让我们在此基础上再深入一些。

添加图片到博客帖子的主要有两种方法（其中我们已经知道了第一种）：

• 要么点击基于块的编辑器顶部的+按钮，

• 或者点击画布上最后一个空内容块右侧的图片图标，如下面的截图所示：

到目前为止，你为了将图片添加到帖子中需要做的只是从媒体库中选择它、从你的电脑上传，或从 URL 插入。每种方法都有相应的按钮。此外，你还可以直接从你的桌面拖放图片。

一旦你的图片上传完成，你会在帖子的画布上看到它被添加。在这个阶段，你可以通过利用图片弹出菜单中的选项来进一步自定义它，如下面的截图所示：

从左侧开始，我们有以下几种：

• 更改块类型。此按钮允许你将图片块转换为画廊块、封面块、文件块或媒体和文本块。本质上，这个功能是为了展示其他可能更适合你想要添加的内容类型的类似块类型。我鼓励你尝试这些选项，看看可能实现什么。

• 下一个部分包含五个图标，用于调整图片的对齐方式。可用的选项有左对齐、居中、右对齐、全宽和全屏宽度。虽然左对齐、右对齐和居中对齐相对直观，但“全宽”和“全屏宽度”的显示效果取决于你当前使用的主题。不妨尝试这些选项，看看效果如何。

• 笔记图标允许对图片进行更深入的编辑。点击它后，你会看到以下屏幕：

这里更重要的字段是标题、替代文本和说明。替代文本是在文件丢失或出现其他问题时将显示在图片位置的短语。说明是你想要显示在图片本身的下方的一段简短描述。

• 最后一个图标——三个垂直点——是一个出现在所有其他内容块中的图标，它并不特属于图片块。它为你提供了额外的选项，关于你可以对这个块做什么：

此外，如果你愿意，你还可以通过标准输入框在你的图片下方为图片本身添加标题：

记住，为了保存所有更改，你必须保存帖子本身，要么通过点击主“发布...”按钮（但这意味着更改将被保存并发布），要么点击旁边的“保存草稿”链接。

指定特色图片

WordPress 的另一个酷特性——如果我们已经有很多这样的特性了——是你可以为特定的博客帖子选择任何单张图片作为特色图片。为此，你想要选择一张能很好地代表帖子的图片。

一些主题会使用特色图片并将其突出显示，而有些则不会。默认主题，我们一直在使用的 Twenty Nineteen，使用特色图片在帖子主要内容上方创建一个看起来很棒的满屏条。根据你使用的主题，它与特色图片的行为可能会有所不同；但总的来说，每个现代主题都以某种方式支持它们。

为了设置特色图片，再次查看基于块的编辑器的设置侧边栏中可用的选项。切换到文档选项卡后，滚动到特色图片部分。那里有一个标有“设置特色图片”的单个按钮：

当你点击它时，你会看到一个弹出窗口，非常类似于我们在添加博客帖子图片时使用的窗口。在这里，你可以通过点击上传一张全新的图片，或者选择一张现有的图片。你现在需要做的就是点击右下角的“选择”按钮。完成这个步骤后，你会在设置侧边栏的特色图片部分看到这张图片。然而，看到它在那里只是为了确认图片确实被适当地分配了。

为了看到它的完整效果，你需要导航到你的网站前端，并以读者的视角查看相关的帖子。看看下面的截图：

这是一个在实时帖子中使用特色图片的绝佳例子。记住，特色图片的影响将由你博客的主题决定。

控制默认图片大小

每次上传图片时，WordPress 都提供了三种图片缩放选项（除了保留原始大小）：缩略图大小、中等大小和大型大小。你可以通过进入 WordPress 仪表板主侧边栏菜单的设置 | 媒体来设置这些选项的像素尺寸。这将带你到媒体设置页面：

在这里，你可以指定我们刚才讨论过的三种缩放选项中上传图片的大小。

如果你更改了这个页面的尺寸并点击“保存更改”按钮，只有你未来上传的图片会受到影響。你已上传到网站的图片将保持其原始/之前的缩略图、中图和大图版本。

在你的网站生命周期早期就决定你想要的三种媒体大小是个好主意，这样你就可以设置它们，并从一开始就将它们应用到所有图片上。

编辑上传的图片

已上传到 WordPress 的每一张图片都可以进行编辑。为了做到这一点，点击主侧边栏中的“媒体”按钮进入媒体库。你会看到一个新类型的列表，这是在 WordPress 的最新版本中引入的。

与传统的列表不同，你现在可以操作的是一个基于网格的存档，它为每件媒体提供了更好的可见性。目前，我们的图书馆中只有一张图片（见截图）；但随着你继续使用你的网站，这个列表将变得更加引人注目。

当你点击任何图片，然后点击弹出窗口底部的“编辑图片”按钮时，你将进入附件详情屏幕。在这里，你可以执行多项操作，让你的图片变得完美无瑕。

事实上，WordPress 在简单的图片调整方面做得足够好，以至于你实际上并不需要像 Adobe Photoshop 这样的昂贵软件。在所有可能性中，你会发现裁剪、旋转、缩放以及垂直和水平翻转（如图所示）的选项：

例如，你可以使用鼠标画一个框，就像我在前面的截图中所做的那样。在右侧，在标记为“图片裁剪”的框中，你会看到你选择像素的尺寸。点击裁剪图标（左上角），然后点击右侧的“缩略图”单选按钮，然后保存（就在你的照片之后）。你现在有一个新的缩略图了！

当然，你可以在点击“保存”按钮之前进行不同的选择来调整你图像的任何其他版本。稍微尝试一下，直到你熟悉了细节。

文章中的视频和其他媒体

现在，WordPress 的最新版本不仅能够将图片包含在我们的博客文章中，还能包含其他类型的媒体，例如音频文件和视频。

将视频添加到博客文章

幸运的是，将视频添加到标准博客文章或页面上的过程已经变得比以往任何时候都要简单。让我们一步步来讨论这个问题。

我们将为此创建一篇全新的文章。让我们使用标题“伟大的婴儿排骨食谱”。创建文章本身相当基础。

1. 导航到“文章”|“新建文章”。你会看到一个我们在本章前面已经讨论过的屏幕。

2. 让我们在内容中放置一些示例内容，并立即尝试添加一个视频。我们只需要复制并粘贴我们想要包含在内容中的视频 URL；只是一个标准的复制粘贴操作，没有其他。

在复制视频 URL 时，确保链接以纯文本形式复制（不要在任何地方超链接：也就是说，不可点击）。

我将要使用的示例是www.youtube.com/watch?v=hDyHbTxTL-A上的视频。正如你所猜到的，这是一段关于一些婴儿排骨的精彩视频食谱！因此，为了在博客帖子中包含这个视频，我只需要获取它的 URL 并将其粘贴进去。以下是我在现在正在工作的新帖子的原始文本内容：

Here's a great video recipe for some killer baby back ribs: http://www.youtube.com/watch?v=hDyHbTxTL-A

然而，当你添加视频 URL 时，你会立即注意到它会自动转换为实时视频块。这将在网站的前页以及编辑帖子屏幕本身发生。请参考以下截图：

3. 为了让帖子有更多的独特存在感，让我们添加一个新的类别，食谱，并分配一个新的标签，视频。之后，我们只需要正常发布帖子即可。

这里描述的过程解释了如何嵌入 YouTube 视频并将它们作为博客帖子的一部分，但这也适用于其他流行的平台，例如 Vimeo、TED、Hulu 和 WordPress.tv。要获取支持平台的全名单，请访问codex.wordpress.org/Embeds。

添加视频到博客帖子的另一种方法是手动上传原始视频文件（而不是使用像 YouTube 这样的第三方平台）。尽管在 WordPress 中这是可能的，但这不是一个推荐解决方案。视频文件通常非常大，如果视频变得流行并最终被数千人观看，托管在标准 Web 服务器上可能会变得非常昂贵（带宽成本）。直接将视频上传到 YouTube 或类似平台，然后将其嵌入到我们的网站上，就像我们刚才做的那样，要高效得多，用户友好性也更强。

在博客帖子中添加音频

WordPress 还使添加音频到你的博客帖子与添加视频一样简单。为了演示这一点，我将创建一个全新的帖子，并将其命名为“Risotto 播客”。在其中，我将分享一个流行的烹饪相关播客的一期。我有两种方法可以做到这一点：

• 与视频类似，如果我有音频文件的直接 URL，我可以直接将其复制粘贴到帖子中。

• 如果我在桌面上有实际的音频文件，我可以使用基于块的编辑器的音频块上传它。以下是添加到帖子后的该块的外观：

我现在需要做的就是从我的桌面选择音频文件。一旦上传完成，WordPress 就会在画布上显示一个实时音频播放器：

除了直接上传音频文件外，你还可以从第三方平台嵌入它们。WordPress 支持从 SoundCloud、Spotify、Rdio 和其他许多服务中嵌入。同样，要获取支持平台的全名单，请随时访问codex.wordpress.org/Embeds。

有限的编辑可能性

与图片不同，WordPress 在音频和视频方面并没有给我们提供太多的编辑可能性。图像可以通过多种方式进行处理，例如旋转、裁剪和缩放。然而，在 WordPress 中处理视频却没有这样的可能性。一旦上传了视频文件或音频文件，我们就无法以任何方式修改它。我们只能将其原样显示在我们的网站上。

使用基于块的编辑器与代码编辑器

正如我们讨论的那样，WordPress 附带了一个新的基于块的编辑器，旨在让大多数用户更容易创建网页，即使他们没有网站管理的先验经验。然而，如果你对编码和 HTML 感到舒适，你可能还想看看 WordPress 中可用的代码编辑器。如果你想要添加使用基于块的编辑器无法实现的特殊内容或样式，这可能会特别有用。

要从视觉编辑器切换到代码编辑器，请在编辑帖子时点击屏幕右上角的三点，然后点击代码编辑器。请参考以下截图：

你将看到你目前正在编辑的帖子及其原始 HTML 的完整面貌。仅举一个例子，以下是这本书最初创建的帖子在代码编辑器中查看时的样子：

虽然这个面板允许你做任何你想做的事情，但你也需要小心不要破坏文档的 HTML 结构。因此，在你对 HTML 文档的结构有基本了解之前，可能不是进行这类修改的好主意。

标题和正文

WordPress 提供的许多有趣发布功能之一是帖子的标题和正文的概念。这听起来可能有些奇怪，但实际上非常简单。

当你发布一篇新帖子时，你并不一定想立即在首页上显示其全部内容。一个更用户友好的方法是只显示标题，然后在各自的 URL 下显示完整的帖子。

在 WordPress 中实现这一点非常简单。你只需要使用基于块的编辑器中可用的“更多”块。只需将其添加到画布上，然后将其拖放到文章顶部附近的位置——最好是第一段之后。请参考以下截图：

在主页面上，大多数 WordPress 主题通过展示摘要和继续阅读链接来显示这样的文章，然后整个文章（摘要和文章的其余部分）在文章的单独 URL 下显示。

草稿、待审文章和时间戳

在本节中，我想再介绍三个额外的项目：草稿、待审文章和时间戳。

草稿

WordPress 为你提供了保存文章草稿的选项。这个术语相当直白。这意味着你不必立即发布你的文章，但你仍然可以保留你的进度，并从你离开的地方继续。

如果你正在撰写一篇新文章，好消息是 WordPress 会自动保存你的进度。一般来说，如果你在编辑面板的右上角看到“已保存”徽章（见下一张截图），那么这意味着你到目前为止的所有进度都已保存：

你可以安全地离开页面，不用担心任何东西会丢失。如果没有“已保存”徽章，那么将有一个标记为“保存草稿”的链接。你可以点击它来手动保存你的进度。

待审文章

待审文章是一个将大大有助于多作者博客用户的特性。在一个更大的出版结构中，有多个个人负责出版过程中的不同领域。作为一个优质的工具，WordPress 通过提供将文章保存为待审审核的方式，支持这样的结构。在编辑-作者关系中，如果编辑看到标记为“待审审核”的文章，他们会知道应该查看并准备发布。

在撰写文章时，切换到设置侧边栏中的“文档”标签，然后勾选“待审审核”复选框。接下来，点击预览按钮旁边的“保存为待审”链接。请参考以下截图：

完成这些后，你将拥有一篇崭新的文章，现在正等待审核。

时间戳

WordPress 还允许你更改任何给定文章的时间戳。如果你今天写了一篇文章，希望它能像昨天一样发布，或者如果你提前写了一篇文章，不希望它在正确的那天显示，这会很有用。

默认情况下，时间戳将设置为当前时间。要更改它，请点击主“发布”按钮，然后在负责处理发布日期的框中进行必要的更改。请参考以下截图：

一旦您设置了想要的时间，主要的发布按钮可能会将其标签更改为“计划”（如果您正在安排在稍后日期发布文章）。点击该按钮以保存您的更改。

高级文章选项

到现在为止，您已经掌握了文章最常见和简单的选项，您可能想知道在撰写博客文章时还应该做的一些其他事情。我们将在本章的这一部分中涵盖所有这些内容。

摘要

摘要可以在您网站上的多个位置显示。它们的确切使用方式取决于您在网站上激活的主题。最常见的情况是，主题会在引言（在本章前面已描述）的位置显示文章的摘要，该引言是从文章的主体中提取的。实际上，摘要为您提供了另一种总结文章内容的方法，并使用该文本而不是从文章主体自动提取的文本。

要编辑文章的摘要，切换到设置侧边栏的文档选项卡，并滚动到摘要部分（如下面的截图所示）。在那里，您可以写一个简短的摘要，通常最好保持为一到三行的一段文字：

话虽如此，但值得一提的是，输入摘要是可选的。然而，建议您还是利用这个可能性。摘要可以显著提高您网站的阅读性，并使读者更容易理解您的内容——前提是您当前的主题以某种方式使用了摘要。在某些情况下，摘要还可以为您的网站带来额外的 SEO 优势——前提是您的主题在谷歌和其他搜索引擎可以看到的地方显示了它们。

讨论

在设置侧边栏的文档选项卡中，您还可以找到一个有用的部分，即“讨论”。这是您可以设置如何处理您正在工作的文章的社区互动的地方。

可用的复选框有两个：一个用于允许评论，另一个用于跟踪回调和 pingback。这两个复选框可能默认都是勾选的。如果您想关闭文章的评论或跟踪回调和 pingback，您必须取消勾选它们：

如果您取消勾选“允许评论”框，访客将无法对那个特定的博客文章进行评论。如果您取消勾选“允许 pingback & trackback”框，会发生一些更复杂的事情，您不会立即看到其效果。如果该框未勾选，当其他人从他们的网站上提及并链接到您的博客文章时，您的博客不会识别这一事实。如果该框保持勾选，其他人的 pingback（提及）将与其他评论一起显示在您的文章下方。

如果您想默认不勾选这两个框中的任何一个或两个，请转到设置，然后从 WordPress 仪表板的左侧主侧边栏中选择“讨论”。您可以取消勾选标记为“允许来自其他博客的链接通知（pingback 和 trackback）”的新文章，或者允许人们在新文章上发表评论的框。

最初，跟踪回和 pingback 功能是为了提供一种与其它网站沟通的方式——让他们知道您已经发布了一篇提及他们的帖子，或者反过来，以某种方式（通常是通过链接）进行。然而，如今，跟踪回和 pingback 正变得有些过时，大多数博客作者甚至懒得检查他们收到的跟踪回/ pingback。就其价值而言，您可能可以安全地完全忽略跟踪回和 pingback。是否在您的网站上支持它们完全取决于您自己。

如果您想了解更多关于跟踪回和 pingback 的信息，您可以访问codex.wordpress.org/Introduction_to_Blogging#Trackbacks和codex.wordpress.org/Introduction_to_Blogging#Pingbacks。

使用帖子修订版本

除了许多内容格式化功能外，WordPress 还允许对您的帖子进行一些基本的版本控制。这意味着 WordPress 保存了您所有帖子的每一个子版本。或者用简单的话说，每次您按下更新按钮时，WordPress 不会覆盖帖子的上一个版本，而是创建一个全新的版本，并将旧版本安全地存储在数据库中。

虽然这个功能一开始看起来并不是最有用的一个，但实际上对于由多个人管理内容的网站来说非常重要。在这种情况下，很容易将帖子的最新版本混淆，所以总是有回到之前版本的可能性是很好的。

再次强调，我们将通过查看设置侧边栏的文档标签来查找修订版本。那里有一个名为“修订”的部分，以及一个与您当前编辑的帖子实际修订版本数量相对应的数字：

如果您点击这个标签，您将被带到一页，您可以比较单个修订版本，然后从现在开始恢复您想要工作的那个版本。界面提供了一个主要的滑块，可以用来选择帖子的单个修订版本。这可以在以下屏幕截图中看到：

修订功能有两个主要版本：

• 第一种情况是当“比较任何两个修订版本”的框未勾选时，它允许您比较当前选中的修订版本（在滑块上）和直接 preceding 它的修订版本。

• 第二种情况是勾选了比较任何两个修订版框。在这种情况下，您可以单独选择您想要比较的修订版，这实际上允许您像框中建议的那样比较任何两个修订版。左侧的修订版总是上一个修订版，而右侧的是下一个或当前修订版（如前一张截图所示）。每个建立差异的段落将以红色和绿色突出显示，每个单独的差异都将有额外的突出显示。点击“恢复此修订版”按钮将恢复右侧的修订版，您将自动返回到帖子编辑屏幕。

如果您认为修订版对您的网站没有任何特别的作用，那么您可以选择简单地忽略修订版框。当您正常处理内容时，不必担心修订版，WordPress 默认会显示您帖子的最新版本。

更改帖子的作者

这是在 WordPress 中一个非常基本但有用的功能。WordPress 中的每个帖子和页面都有一个作者，这本身就很明显。然而，如果您愿意，您可以更改任何给定条目的指定作者。为了做到这一点，请查看设置侧边栏的文档标签页，并找到作者标签。旁边有一个下拉菜单，列出了您网站上每个用户账户。只需选择一个新作者，然后点击主更新按钮以保存更改：

注意：如果您网站上只有一个用户，那么该框甚至不会可见。

保护内容

WordPress 允许您隐藏帖子。您可以通过标记为私有来隐藏帖子，这样除了您自己之外，其他人看不到（尽管管理员和编辑的用户角色仍然可以看到），或者您可以通过标记为密码保护来隐藏它，这样除了与您共享密码的人之外，其他人看不到。

要实现这一点，请查看设置侧边栏的文档标签页，并找到可见性标签。旁边有一个链接，上面写着公共。一旦您点击它，您将看到可用的选项：

如果您点击“私有”单选按钮，该帖子将不会在博客上显示，除非由具有管理员或编辑角色的某人查看。如果您点击“密码保护”单选按钮，您将看到一个可以输入密码的框。您的博客访客将看到帖子标题以及一个提示，说明他们必须输入密码才能阅读帖子的其余部分。

美观的永久链接

我们已经在第二章WordPress 入门中讨论了调整您网站的永久链接设置。现在是时候扩展这一知识，并讨论一下所谓的帖子永久链接或短网址。

关于什么是“文章别名”的最准确定义之一来自 WordPress Codex 本身。在codex.wordpress.org/Glossary#Post_Slug提供的资源中，我们了解到文章别名是由几个由破折号分隔的小写单词组成，描述了一篇文章，通常是从文章标题中提取出来以创建一个用户友好的永久链接。

换句话说，文章别名就是位于文章 URL 中的域名之后的部分。例如，我关于我最喜欢的三个菜品的文章使用了这个 URL：http://localhost/my-top-3-favorite-dishes/，其中最后一部分——my-top-3-favorite-dishes就是别名。正如官方定义所说，WordPress 通过将我的文章标题全部转换为小写，删除所有标点符号，并用破折号替换空格来选择别名。如果我希望它变成其他什么样子，比如3-favorite-dishes，我可以通过访问设置侧边栏的文档标签并查找标记为“永久链接”的部分来更改它：

可读的 URL 是谷歌搜索引擎所喜爱的，因此使用它们有助于为搜索引擎优化你的网站。这也有助于用户在点击 URL 之前了解文章的内容。

博客上的讨论 – 评论

评论是大多数博客的重要元素。虽然只有你和你的作者可以为你的博客写新文章，但你的访客可以在那些文章下添加评论。这可以在博客中培养一种社区感，让人们可以对你的写作给出反馈，并为你的访客提供帮助或与其他访客交谈的方式。

添加评论

如果你查看你博客的首页，你会注意到每个文章都有一个写着“留下评论”的链接（前提是你没有完全禁用评论）。点击这个链接会带你到文章页面的底部，这是添加评论的地方。

如果你已登录 WordPress 仪表板，你会看到你的名字和一个可以写评论的空间。如果你没有登录，你会看到一个任何其他访客都会看到的评论表单。这个表单包括填写姓名、电子邮件、网站和当然，一个用于评论本身的大框：

一旦你输入了所需的信息并点击“发表评论”按钮，评论就会被输入到 WordPress 数据库中。它何时出现在网站上取决于你的讨论设置。

讨论设置

在前面的截图上，请注意，名称和电子邮件字段都被标记为必填(*)。作为博客/网站的拥有者，你可以更改评论的要求。这可以在你访问 WordPress 仪表板中的设置 | 讨论时完成。

提交、通知和审核设置

让我们专注于“设置 | 讨论”页面上的复选框，这些复选框与提交、通知和审核相关。在此页面上勾选的框将决定评论在博客上发布之前需要经过多少审核和检查。

首先，让我们看看在“评论出现之前”可见的与审核相关的设置。这两个选项与允许评论出现在网站上的条件有关：

• 必须手动批准评论：如果勾选此框，则每个评论在出现在网站上之前都必须由您手动批准。

• 评论作者必须有一个之前批准的评论：如果您取消勾选上面的框，但勾选这个框，那么您已经稍微放宽了设置。这意味着如果评论者之前发表过评论并且其评论已被批准，那么该评论者的未来评论就不需要您验证——它们将立即出现在网站上。该评论者只需输入之前批准评论中相同的姓名和电子邮件即可。

接下来，让我们看看在“其他评论设置”下可见的评论提交设置：

前两个选项控制用户在能够输入评论之前必须做什么：

• 评论作者必须填写姓名和电子邮件：如果您保留此勾选，那么任何尝试留下任一字段为空的评论者都会遇到错误。这并不增加很大的安全性，因为机器人知道如何填写姓名和电子邮件，而且任何人都可以在那里填写虚假信息。然而，如果长时间讨论发展起来，这有助于博客读者追踪谁是谁，并且可以稍微阻止冲动评论。此外，拥有 Gravatar 账户的访客很乐意提供他们的电子邮件地址。这是因为使用与 Gravatar 关联的电子邮件地址将导致他们的个人资料图片（头像）与评论一起显示，使其在所有其他评论中显得更加个性化和显眼。

• 用户必须注册并登录才能发表评论：大多数博客作者不会勾选此框，因为这意味着只有注册博客的访客才能发表评论。大多数博客作者不希望有随机的人注册，而且大多数访客也不希望被迫在您的博客上注册。如果您勾选此框，您可能根本收不到任何评论。或者，如果您正在为某个封闭的社区设置博客，这个设置可能是有用的。

• 自动关闭 X 天前的文章评论：在这里，您可以设置任何数量的天数，在此之后您的内容上的评论将被关闭。尽管这个功能一开始可能看起来不是一个有用的功能，但它实际上对各种类型的新闻网站或其他在线出版物来说可能非常有价值，在这些网站上，允许对旧事件的评论几乎没有意义。

• 显示评论 cookies 同意复选框：当选中时，用户将在评论表单下方看到另一个复选框，上面写着：“下次评论时，在此浏览器中保存我的姓名、电子邮件和网站。”

• 启用嵌套评论 X 层深：此选项默认启用，这是使您的网站更具可读性和用户友好性的另一种方式。有时，评论者希望能够对其他人的评论做出回应，仅仅作为持续讨论的一部分。这就是允许他们这样做的功能。此外，它还为您，作为作者，提供了一个与观众互动的绝佳方式，通过直接回复他们的每一条评论。

• 将评论分成页面 [...]: 如果您每篇文章的评论超过 200 条，这个功能对您才有价值。所以您可以放心地不选中它。

最后，让我们看看与通知有关的设置。这两个选项位于“随时通过电子邮件通知我”标题下。这些选项与收到有关评论活动的电子邮件通知的情况有关：

• 任何人发表评论：这通常是一个需要保留的设置。无论是否需要审核，每当有人发表评论时，您都会收到电子邮件。这将使您更容易跟踪博客上的讨论，并意识到需要快速删除的未经审核的评论。

• 评论被保留以供审核：如果您对跟踪您博客上的每一条评论不感兴趣，您可以取消选中“任何人发表评论”复选框，并只保留此复选框选中。您只会收到关于看起来合法但需要审核和/或您批准的评论的电子邮件。

何时审核或黑名单评论

如果您将页面向下滚动一点，您将看到评论审核区域：

这是页面顶部审核设置的扩展。请注意，如果您已选中“评论必须手动审核”复选框，您可以安全地忽略此评论审核框。否则，您可以使用此框帮助 WordPress 确定哪些评论可能没问题，哪些可能是垃圾邮件或不适合您的博客。您可以让 WordPress 怀疑一个评论，如果它包含超过一定数量的链接，因为垃圾邮件评论通常只是一串 URL。

较大的框用于您输入可疑词汇和 IP 地址：

• 在这里，您可以输入常见于垃圾邮件中的单词（您可以通过查看垃圾邮件来找出这些单词），或者只是一般的不雅词汇。

• 这些 IP 地址将包括过去那些发表不当评论或添加实际垃圾邮件的人的评论。每当 WordPress 收到您博客上的评论时，它会为您捕获 IP 地址，这样您就可以随时使用它们。

再向下滚动一点，您会看到“评论黑名单”框：

与我们刚才看到的“评论审核”框不同，后者告诉 WordPress 如何识别可疑评论，而“评论黑名单”框告诉 WordPress 如何识别几乎肯定是不好的评论。这些评论不会被添加到审核队列中，您也不会收到关于它们的电子邮件；它们会被立即标记为垃圾邮件。

头像显示设置

页面上的最后一个部分被标记为“头像”。正如我在第二章“WordPress 入门”中提到的，头像是一个代表个人形象的图片。WordPress 中的头像通过 Gravatar 提供，这是一个可在gravatar.com/找到的服务，它允许您创建个人在线资料，该资料将在整个网络上的其他网站上一致使用。默认情况下，如果勾选了“头像显示”框，头像就会出现在您的博客上，这个框位于讨论设置页面的底部附近。

第二个框“最大评分”会告诉 WordPress 何时不应显示被评为过于露骨的头像。还记得我们上传新图片到 Gravatar 时设置的评分吗？这里的设置就是您可以选择在网站上允许哪些图片的地方（建议选择 G 级评分）。

第三个框“默认头像”告诉 WordPress 为没有携带自己图像的访客使用哪个头像。

审核评论

现在我们已经彻底探讨了需要审核的评论设置，让我们来讨论一下您实际上需要做什么来审核评论。审核意味着您会查看处于悬而未决状态的评论，并决定它是否足够有洞察力，可以在您的博客上发布。如果评论好，它就会出现在您网站的首页上；如果不好，它会被标记为垃圾邮件，或者被删除，除了您和撰写评论的人之外，没有人会看到。

要查看等待审核的评论，请从 WordPress 仪表板的侧边栏导航到“评论”。如果您有任何等待审核的评论，主菜单中会有一个小数字告诉您有多少评论等待审核：

这个主要的评论页面功能齐全，就像帖子页面一样。对于每条评论，您从左到右可以看到以下信息：

• 评论者头像、姓名、网站地址（如果有提供）、电子邮件地址（如果有提供）和 IP 地址

• 评论文本，以及用于批准它的链接，以便它在网站上显示（当你在评论上悬停鼠标时，这些链接会出现）；你也可以将其标记为垃圾邮件、删除它、编辑它、快速编辑它或回复它

• 评论提交的时间和日期

• 发表评论的帖子的标题（这也是编辑该帖子的链接），括号中的数字表示该帖子已有多少条已批准的评论（这也是一个链接，可以过滤评论列表，只显示该帖子的评论），以及指向该帖子的链接（标记为查看帖子）

等待审核的评论具有红色背景，就像前面截图中的第一个评论一样。

你可以点击任何评论下的快速编辑链接来打开其快速访问选项。这将允许你编辑评论的文本和评论者的姓名、电子邮件和 URL。

你可以使用顶部的链接——所有、待审、批准、垃圾邮件和回收站，根据这些状态过滤列表。你还可以使用所有评论类型下拉筛选菜单过滤 ping 或评论。你可以选择一个或多个评论，在列表顶部和底部的批量操作菜单中应用任何可用的批量操作。

另一种快速访问此页面或对评论执行操作的方法是使用 WordPress 在评论被保留以供审核时发送给你的电子邮件中的链接（前提是你已在设置 | 讨论面板中选择了该选项）。

此外，这个列表显示了所有需要审核的 pingback。从博客主的角度来看，pingback 看起来就像任何其他评论一样，这意味着你可以编辑它们，将它们标记为垃圾邮件，或者像处理标准评论那样删除它们。

添加和管理分类

在本章的早期，你学习了如何在添加帖子时快速添加分类。现在，让我们谈谈如何以更大的方式管理你的分类。首先，导航到帖子 | 分类。你会看到分类页面，如下所示：

这是一个有用的页面，它结合了添加、编辑和审查所有分类的能力。正如你所看到的，当你撰写博客文章时添加的任何分类都会在这里列出。你可以通过点击列表中的相应链接来编辑、快速编辑或删除任何分类。

如果你在这个页面上添加一个分类，你还可以选择它的别名。别名是显示在你网站 URL 中的简短文本。如果你没有选择别名，WordPress 会为你创建一个，通过将分类名称转换为全部小写，用短横线替换空格，并删除任何其他标点符号（类似于对帖子别名的处理）。

你还可以在这个页面上做的一件事是为任何分类选择一个父分类。一些主题支持以层次结构显示分类，但并非所有主题都支持。在一个优秀的现代主题中，如果你为分类创建一个自定义菜单，所有子分类都将显示为子菜单。

能够创建分类层次结构实际上是区分分类和标签的主要技术特点。除此之外，这两个分类体系在结构上相当相似，尽管它们仍然有不同的用途。

摘要

在本章中，你学习了添加和管理博客内容所需的所有知识。你了解了帖子、分类和评论。你发现了标签和摘录。你还学习了添加和编辑图片、处理视频和音频内容、使用新的区块编辑器、更改时间戳、自定义摘录以及不同的发布方式。

你对博客内容的控制已经完整，你已准备好让你的博客焕发活力！

在下一章中，你将学习如何使用 WordPress 管理所有其他类型的内容。

第四章：页面、媒体和导入/导出内容

到目前为止，您已经完全控制了您网站上的博客部分。然而，您可能已经注意到 WordPress 提供了比仅仅帖子、评论、标签和分类多得多的功能。

在本章中，我们将探索并学习如何控制 WordPress 允许您使用的所有其他类型的内容。您将能够创建不属于您持续博客的静态页面，向您的帖子添加各种类型的媒体，并创建吸引人的图片库来展示照片和其他图像。

本章将涵盖以下主题：

• 创建和管理您的页面

• 浏览您的媒体库

• 导入/导出内容

页面

初看之下，页面看起来与帖子非常相似。页面和帖子都有一个标题和一个内容区域，我们可以在这里写入扩展文本，添加图片等。然而，页面与帖子的处理方式截然不同。首先，页面没有分类或标签（页面不需要分类，因为在大多数网站上，页面的数量远少于帖子）。此外，帖子属于您的博客，旨在成为围绕特定主题的持续、扩展发布的组成部分。帖子会定期添加，而页面则更加静态，通常不会期望有太多变化。

简而言之，我建议您将页面视为静态内容的片段，将帖子视为一系列按时间顺序发布的文章。换句话说，页面旨在包含无论何时阅读都同样更新的内容。例如，人们通过 WordPress 页面发布的内容通常是关于他们公司或业务、团队以及其他相关且永恒的细节的详细信息。帖子通常非常具有时效性，并呈现今天/现在重要的建议/新闻。对于大多数博客来说，帖子是内容的基础，占整个内容目录的 90%以上。

当您首次安装 WordPress 时，会自动为您创建一个页面（连同第一个帖子第一个评论）。您可以通过访问http://YOURSITE.com/sample-page/来查看该页面。

添加页面

要添加新页面，请访问您的wp-admin并导航到页面 | 添加新页面，或者通过点击顶部菜单中的“新建”然后选择“页面”使用下拉菜单。这将带您到基于块的编辑器。正如您将注意到的，这与我们处理博客帖子时使用的编辑器相同。块编辑器非常通用，WordPress 将其用于帖子页面。

创建新页面所需的最少操作是输入标题和一些内容。然后，点击蓝色“发布”按钮，就像您为帖子做的那样。您的新页面将可在其唯一的 URL 下访问。

您将在基于块的编辑器的设置侧边栏中认出大部分部分。它们对页面和帖子的工作方式相同。让我们谈谈一个新部分——称为“页面属性”的部分，它包括父页面和顺序等元素：

父级

WordPress 允许您以分层结构组织您的页面。这样，您可以把所有内容组织成主页面和子页面，如果您网站上页面的数量较多，这很有用。例如，如果我要和另外三位作者一起写博客，我们每个人都会在网站上有一个关于我们的页面，但那些将是主关于页面的子页面。如果我添加其中一个页面，我会首先创建一个新的关于页面（主页面），然后创建一个仅为我自己的页面，称为关于 Karol，最后选择那个主关于页面作为新页面的父页面。

顺序

默认情况下，您创建的所有页面将按页面标题的字母顺序排列。如果您想按其他顺序排列，可以在每个页面的“顺序”框中输入数字来指定。编号较低的页面（例如，0）将排在编号较高的页面（例如，5）之前。您可以通过编辑一些页面并给它们分配不同的数字来轻松测试这一点。

诚然，这不是一个很清晰的重新排列页面的方法，尤其是如果您想将它们显示在菜单中。您可以通过直接操作菜单（如第八章所述，自定义您的网站外观/设计）来更容易地做到这一点。最后，我建议您根本不要麻烦自己设置顺序属性。

管理页面

要在wp-admin中查看网站上所有页面的列表，请从主菜单导航到“页面”。您将看到以下截图所示的内容：

到现在为止，这种列表格式应该开始变得熟悉了。您有您的页面列表，并且在每个行中，都有一些有用的链接，允许您编辑、快速编辑、删除或查看页面。您可以通过点击作者的名字来按该作者过滤列表。您可以使用顶部两个链接，全部和已发布，来按状态过滤页面（如果您有保存为草稿或待审阅的页面，它们也将出现在这里）。还有通过位于页面列表上方的下拉菜单按日期过滤。此外，您还可以通过列表顶部和底部的批量操作菜单检查某些框并批量编辑页面。最后，您可以通过顶部的搜索框搜索您的页面。

设置主页

在你可以在网站上创建的所有页面中，有一个页面非常特别。那就是首页，也称为主页。简单来说，首页就是访客访问你的主要网站地址时看到的页面——通常像YOURSITE.com这样的东西。

默认情况下，WordPress 会在首页上显示你最近发布的博客文章列表——按时间顺序倒序排列。虽然对于某些类型的网站来说，在首页上显示最新的博客文章是可以的，但并不是对所有人来说都是最佳选择。通常，你最好探索一下设置一个完全定制的首页，并手动选择你想要显示的内容。

从现在开始，我们将假设你正在使用默认的 WordPress 主题——Twenty Nineteen。如果你使用的是不同的主题，本章本节中描述的过程的部分可能有所不同。

创建一个占位符首页

我们需要做的第一件事可能看起来有些不合常理，但很快就会明白。让我们先创建两个空白页面。你可以用正常的方式来做这件事；只需前往“页面”|“添加新页面”：

• 将第一个页面的标题命名为“首页”，保存并发布它。现在不要添加任何其他内容，只需标题即可。

• 将第二个页面的标题命名为“博客”；也保存并发布它。

启用自定义首页

我们需要指示 WordPress 在确定你的首页内容时开始使用这两个页面。

前往设置 | 阅读设置。一旦进入，将页面上的第一个设置从“你的最新文章”切换到“一个静态页面”。从下拉菜单中，将你的新页面“首页”指定为“主页”，将页面“博客”指定为“文章页面”，如下所示：

点击“保存更改”。

有了这个，你新创建的一个页面——首页——已经成为了你整个网站的首页。然而，目前那里没有什么内容，因为页面是空的。

另一个页面——“博客”——被分配了列出你的最新博客文章的任务，按时间顺序倒序排列。换句话说，博客页面现在做了之前默认首页所做的工作。如果你访问YOURSITE.com/blog，你可以看到博客页面。

定制你的首页

一个空白的首页肯定不是你想要的，所以让我们稍微定制一下：

1. 前往“页面”并点击“首页”页面开始编辑。首先给页面起一个标题——当访客到达你的网站时，你希望他们首先看到的内容。我不会在这里发挥创意，只是简单地输入“欢迎来到我的网站！”

2. 接下来，添加你认为应该在首页上出现的内容。如果你正在建立一个商业网站，你可能需要提及你的业务做什么以及它如何服务客户。再次强调，我不会在这里发挥创意，只是简单地添加几句话。到目前为止，我有的内容如下：

1. 在下一步中，让我们展示一些博客上最新的帖子，这样人们就可以了解他们可以从你这里期待什么样的内容。首先，你可以输入一条简单的邀请人们查看你最新帖子的信息。

2. 之后，让我们添加一个我们尚未使用过的新的块。这个块叫做最新帖子，你可以在小部件部分找到它。请参考以下截图：

1. 一旦添加此块，它将自动填充你最新的博客帖子。我将稍微自定义该块。首先，我会通过点击以下按钮将视图从列表更改为网格：

1. 接下来，我将通过设置侧边栏调整一些其他设置，如下所示：

我所做的更改如下：

• 列数：设置为 2

• 项目数量：设置为 2

• 显示帖子日期：设置为是

如你所见，这些设置相当直观，所以你可以根据你特定的网站需求进行调整。

当我此时点击预览按钮，我会在页面上看到我的两篇最新帖子并排显示：

最后，让我们为首页设置一个特色图片。这张图片将在整个网站的页眉部分显示，所以最好选择一个能让你引以为豪的代表性图片。

为特色图片分配操作与博客帖子相同。

1. 从设置侧边栏切换到文档选项卡，然后向下滚动到标有特色图片的章节。选择你想要设置的图片，并保存设置。完成后，你将看到你的图片已被分配：

在这个阶段，我们已经完成了自定义首页的工作。当然，首页可以包含更多内容，这完全取决于你想要首页代表什么。这就是 WordPress 的全部魔力——你不必满足于现状，而是可以打造一个真正属于你自己的网站。

1. 要查看你当前首页的全貌，只需导航到你的主要网站地址。这是我首页上的内容：

媒体库

媒体库是 WordPress 存储所有上传文件的地方，例如图片、PDF 文件、音乐和视频。要查看你的媒体库，请导航到主菜单中的媒体（目前可能没有很多媒体）：

您现在看到的是一个漂亮的网格布局，使得浏览媒体变得非常用户友好。我的媒体库目前有四张照片。一旦我点击其中任何一张，我就会看到我们之前在第三章创建博客内容中讨论的附件详情屏幕。在这个屏幕上，有许多选项可以修改所选的文件。

我们可以编辑细节，例如标题、说明、替代文本和描述，还可以永久删除文件或在前端查看它：

您还可以将新文件添加到媒体库中。转到媒体 | 添加新文件以访问一个页面，类似于上传文件时获得的上传媒体页面。当您点击“选择文件”按钮并选择要上传的文件，或直接从桌面拖放它时，WordPress 会上传文件，然后将其与其他媒体文件一起显示在库中。此时，您的新的项目将未与任何帖子或页面关联。

要将其包含在某个地方（帖子或页面中），请转到帖子或页面，并编辑其中一个帖子/页面。点击左上角的+按钮，并选择图片块。现在，您不需要上传新文件，只需从媒体库中选择它。我们已经在上一章中更详细地介绍了整个过程：

创建图片画廊

WordPress 不仅允许您将单个图片添加到您的帖子或页面中，还允许您创建由多张图片组成的精美画廊。以下是创建新的图片画廊并在帖子或页面中显示它的步骤：

选择帖子或页面

您可以为任何新页面或现有页面或帖子添加一个画廊（或多个画廊）。例如，我选择了我的一篇现有帖子，您可以在下面的屏幕截图中看到：

将画廊添加到这篇帖子的第一步是在页面的左上角点击+按钮，并选择画廊块：

将图片添加到画廊

这个新的画廊块看起来与标准的图片块非常相似，并提供了几个主要选项：

此外，除了上传图片或从媒体库中选择图片之外，您还可以直接从您的桌面拖放多个图片。WordPress 会立即开始将它们转换成画廊。对于这个例子，如果您想从媒体库中选择图片，只需点击“媒体库”按钮。您会看到一个您此时应该很熟悉的面板。在那里，只需点击您想要包含在画廊中的图片。例如，我已选择了三张图片（见右上角的小方框）：

在这个阶段，如果你想调整图片的标题和描述，可以点击创建新相册按钮。在下一步中，你可以通过拖动图片到显示区域来重新排列你的图片。你还可以调整标题（标题将被保存，以便在稍后使用相同图片创建相册时重用）。完成之后，只需点击插入相册按钮：

您将在您的帖子画布上直接看到相册的预览。通过点击相册块，您还可以看到一些额外的选项。例如，您可以更改相册中的列数，设置是否要将图片链接到任何地方，以及裁剪它们以适应块中的空间。您还可以上传额外的图片并将它们添加到相册中。您可以在以下截图中看到这些选项：

例如，如果您决定将列数更改为 2，WordPress 将尽其所能使您的相册看起来仍然很棒。以下是我这样做时我的相册发生的情况：

如您所见，WordPress 使每张图片完美地适应页面，尽管这种完美的程度取决于您使用的主题。

导入/导出内容

本章我们将讨论的最后一件事是导入和导出您的内容的功能。默认情况下，WordPress 允许您从其他地方获取内容并在您的网站上发布。但请注意，这不会自动发生。WordPress 只会帮助您导入内容，然后您可以决定接下来如何处理它。

支持的平台有很多，包括 Blogger、LiveJournal、Tumblr 博客等。您可以通过导航到工具 | 导入（导入内容时的起点）来查看完整列表：

导入内容

如果您想从任何来源导入内容，首先需要点击可用的平台下方的“立即安装”链接之一（在前面截图中可见）。WordPress 使用额外的插件来处理导入，并且首先需要安装它们才能执行此程序。

从每个可用的平台导入内容的方式略有不同，但总体过程看起来相似，所以我们将以另一个 WordPress 网站为例——也就是说，我们将从另一个 WordPress 网站导入内容。为了实现这一点，我们只需点击 WordPress 部分中的“立即安装”链接（在前面截图中的最后一个），然后，当安装完成后，点击刚刚出现的“运行导入器”链接。请参考以下截图：

这将直接带你去导入面板：

这是一个非常简单的界面，你所要做的就是取一个 WordPress 导出文件并将其上传到你的网站。平台将负责提取存档并将内容导入其中。因此，你的网站将会充满新的文章、页面、自定义字段、导航菜单，甚至是评论。

这个功能的主要目的是帮助那些从 Blogger 或 LiveJournal 等平台迁移网站的用户。想象一下，如果有人有一个包含一百多篇博客文章的 Blogger 博客。逐个处理并将它们手动输入 WordPress 将会非常耗时。有了这个功能，可以在一分钟内完成。

导出内容

导出内容甚至比导入更简单。首先，导航到工具 | 导出：

在这里，你除了选择要导出的内容然后点击大按钮下载你的 WordPress 导出文件外，没有太多可以做的：

• 选择所有内容将导出你的文章、页面、评论、自定义字段、术语、导航菜单和自定义文章

• 只选择文章、页面或媒体是非常直观的

当你点击下载导出文件按钮时，你将得到一个与我们在导入时使用的文件一样的文件。这意味着你可以将这个文件拿去，在另一个域名上创建你网站的镜像副本。

摘要

在这一章中，我们探讨了 WordPress 可以处理的内容，这些内容并非直接关于博客。你学习了静态页面、主页、媒体库、图片画廊以及内容的导入/导出。

现在，你已经完全准备好使用 WordPress 管理面板来控制你网站的所有内容。接下来，你将学习如何通过安装新的插件来扩展你网站的功能，我们将在下一章中讨论这一点。

第二部分：自定义 WordPress

在你安装了 WordPress 并熟悉其基本功能之后，本节将是你的下一步。在本节中，我们将探讨许多不同的方法，这些方法可以帮助你扩展 WordPress 的默认功能。

本节将涵盖以下章节：

• 第五章, 插件——它们是什么以及为什么你需要它们

• 第六章, 保护你的 WordPress 网站

• 第七章, 选择和安装主题

• 第八章, 自定义你的网站外观/设计

• 第九章, 开发你自己的主题

• 第十章, 社交媒体集成、播客和 HTTPS

• 第十一章, 开发插件、小工具以及 REST API 简介

第五章：插件——它们是什么以及为什么您需要它们

插件的作用在近年来增长了很多。如今，很难想象任何 WordPress 网站能够在没有至少安装一些（基本）插件的情况下运行。

在本章中，您将了解插件是什么，为什么需要使用它们，如何使用它们，在哪里获取它们，以及如何跟上任何新发布的对社区有用的插件。我们还将讨论 WordPress 世界中一些最基本和最受欢迎的插件，以及为什么拥有它们可能是个好主意。好，让我们开始吧！

让我们看看本章将涵盖的主题：

• 拆解插件

• 安装插件

• 必备插件包

拆解插件——它们是什么？

简而言之，插件是小型脚本（包含可执行 PHP 代码的文件），允许您在 WordPress 网站上包含新的功能——这些功能默认情况下不可用或未启用。WordPress 最好的优点之一是它是一个非常优化的平台。它使您的网站加载速度快，不包含很多冗余代码。然而，WordPress 本身只提供绝对必要的功能范围——对每个人有用的功能。同时，该平台通过引入插件，提供了一种简单直接的方式来扩展您网站的能力。想法很简单——如果您希望您的网站能够处理特定的新的任务，那么肯定有一个插件可以做到这一点。就像在苹果世界和流行的表达，“有应用可以做到这一点”一样。

为什么使用插件？

插件最好的地方在于您不需要任何特定的编程知识就能使用它们。本质上，它们就像 iOS 或 Android 的标准应用程序——您可以安装它们并享受它们提供的东西，而不必了解里面的情况。话虽如此，并非所有插件在数据安全或代码质量方面都是安全的。我们将在本章后面讨论这个话题。

此外，合适的插件组合可以使您的网站更加优化，更加用户友好，更加吸引人，更加适合社交媒体，得到适当的备份，防止垃圾邮件，最终，更加独特。插件确实是 WordPress 最好的特性之一。

在像 WordPress 这样的内容管理系统流行之前，网站所有者没有简单的方法向他们的网站引入新的功能。这样做总是需要雇佣专业程序员并投资整个开发过程。如今，这种情况已经不再存在，几乎任何人都可以拥有一个令人印象深刻的网站，而不会损失太多。

哪里可以获取插件？

WordPress 插件背后的社区规模庞大。并没有一个中心化的插件开发公司。全世界的开发者都在创建插件，然后通过互联网进行分发。而且，他们中的很多人根本得不到任何直接的报酬。访问 WordPress 插件的最佳和最安全的地方是官方目录，网址为 wordpress.org/plugins/:

在撰写本书时，官方目录中已有超过 55,000 个不同的插件可供选择，而且这个数字还在不断增长，每周大约有 100+ 个新插件被添加。这真的很令人印象深刻，因为其中许多插件都是非常先进的网络软件，而不仅仅是简单的单脚本插件。

在官方目录的页面中心有一个搜索框（如前一张截图所示），允许您通过主题和标签搜索插件。您还可以查看最受欢迎的插件以及特色插件。简而言之，当您寻找插件时，官方插件目录应该是您首先考虑的地方。同时，养成检查您感兴趣的插件受欢迎程度的好习惯。下载已经有大量满意用户证明的插件，将提高您获得一个您会喜欢使用的优质产品的机会。这非常重要，因为您的网站安全绝不能被低估。通过从官方 WordPress 目录获取插件，您至少可以确信这些插件在没有任何恶意的方式下。我们将在下一章中更多地讨论网站安全。

在寻找特定任务的插件时，您还可以进行 Google 搜索。我建议搜索您试图解决的问题，看看其他用户推荐了哪些插件以及为什么推荐。通常，多个插件执行类似的功能，您会发现其他 WordPress 用户提供的反馈在选择它们之间非常有价值。然而，在这样做的时候，务必留意可能破坏您的网站或允许他人入侵的恶意或编码不良的插件。在安装没有用户评论、评论或反馈的新插件时，要小心，尤其是那些在互联网上有负面反馈的插件。

为了更深入地了解您为网站考虑的插件，您还可以查看每个插件的变更日志和支持论坛（官方 plugin 目录中的每个插件页面都有一个名为“支持”的标签）。这应该能给您一个关于特定插件编码、支持等方面做得好或不好的概念。

除了免费插件，还有一大套付费插件（付费插件）。然而，您在官方目录中找不到它们。这些插件中的大多数都有自己的网站来处理销售、客户支持和使用教程。如果您感兴趣，可以找到一些更受欢迎的付费插件目录，例如codecanyon.net/category/wordpress。

发现新插件

一般而言，如果一个插件证明它是一个高质量的解决方案并获得了某些知名度，它将在官方目录的首页“特色插件”部分展示。但如果你想要随时了解最新动态，你可以关注wordpress.org/plugins/browse/new/上的动态。

此外，发现新插件的一个好方法是成为 WordPress 流行博客的常客。尽管这些博客不是官方作品（它们由独立所有者运营），但它们确实提供了一系列令人印象深刻的提示和建议，不仅限于插件，还包括与 WordPress 相关的其他方面。以下是一些博客列表：

• wptavern.com/

• codeinwp.com/blog/

• themeisle.com/blog/

• www.wpbeginner.com/

安装插件——如何进行

安装插件的步骤很简单：

1. 找到您的插件

2. 将它下载到您的 WordPress 站点，无论是手动还是通过自动安装器

3. 安装并激活它

4. （如果需要）配置它

将插件添加到您的 WordPress 安装中有两种方式：

• 手动安装它

• 直接从wp-admin内部安装

第一个选项——手动安装插件——通常比第二个选项需要更多的努力，但有时这是与某些插件（大多是付费插件）工作的唯一方式。第二个选项——在wp-admin内部安装——通常更快更简单，但并非所有情况下都可行。您需要在一个配置正确的服务器上，以便 WordPress 能够添加文件（我们已经在第二章，WordPress 入门指南）中讨论了安装 WordPress 和服务器配置）。此外，您想要安装的插件必须可在 WordPress 插件仓库中找到，即官方插件目录。

在接下来的部分，我们将首先介绍自动安装（因为它更容易操作），然后处理手动方法。

自动安装

如果您想安装的插件可在官方插件目录wordpress.org/plugins/中找到，那么您可以在wp-admin内部搜索并安装该插件。只需导航到插件 | 添加新插件。您将在右上角找到一个搜索框。在那里输入您想要的插件名称（如下面的截图所示）：

一旦您看到您的插件，点击“更多详情”链接以查看有关其提供的功能的更多信息：

我建议您始终仔细查看这些信息。务必注意版本兼容性。在插件详情中列出了一个名为“兼容至”的参数。在某些情况下，您可以冒险安装稍微过时的插件，但您应该谨慎行事。查看插件下载次数也是一个好主意。下载次数越多，就有越多的人有机会查看插件并评估其质量。

安装后，您需要仔细测试插件并验证其是否运行正确。大多数时候，如果“兼容至”参数指示较旧的 WordPress 版本，这并不一定意味着插件将无法与较新版本一起工作。这只意味着它尚未经过彻底测试，因此进行自己的测试很重要。然而，我强烈建议不要安装超过两年未更新的任何插件。幸运的是，无论何时遇到这样的插件，WordPress 本身都会通过官方插件页面上的消息警告您，如下面的截图所示，或者在wp-admin的插件详情部分，将有一个标记为“最后更新”的参数：

如果一切正常，您可以点击“立即安装”按钮继续。几秒钟后，您将能够激活插件。您会看到一个出现的“激活”按钮。请参考以下截图：

到目前为止，插件已安装并激活。换句话说，它应该完全可用。

手动插件安装

以下步骤允许您安装您能找到的任何 WordPress 插件，无论它来自 WordPress.org 的官方目录(wordpress.org/)还是其他地方。

要手动安装插件，您必须首先从官方目录wordpress.org/plugins/或从另一个网站或来源（通常在处理付费插件时）下载插件存档。

在这种情况下，Jetpack 插件可在官方目录wordpress.org/plugins/jetpack/中找到：

只需点击蓝色的“下载”按钮，并将生成的 ZIP 文件保存在你容易找到的地方。一旦你下载了插件，如果你的服务器设置正确，你应该可以直接通过“插件 | 添加新插件”页面上传 ZIP 文件。转到该页面，点击顶部的“上传插件”按钮，并选择插件的 ZIP 文件，如下面的截图所示：

如果这个自动上传器对你不起作用，你可以用老式的方法来做。首先解压缩，也就是说，提取你下载的 ZIP 文件，使其成为一个目录，可能命名为jetpack（至少在这个情况下）。然后，使用你的 FTP 客户端，将这个目录上传到你的 WordPress 安装的wp-content/plugins/目录内。你也会看到那个目录中 WordPress 自带的两款插件——akismet和hello.php。

如果你需要任何关于 FTP 软件的帮助，请查看第二章，WordPress 入门，其中我们讨论了安装 WordPress 的主题。

上传完成后，你将能够激活插件。这是有效开启插件所必需的。这可以通过点击“激活插件”按钮来完成，如下面的截图所示。到此为止，你就完成了，Jetpack 插件正在运行：

插件安装后要做什么

在你的插件安装并准备就绪后，你可能还想做一件事。虽然一些插件在激活后就能完美运行，但其他插件可能需要一些额外的调整。以下是最可能出现的四种情况：

• 你可能不需要做任何事情。一些插件只是改变了 WordPress 执行某些事情的方式，激活它们就是你所要做的全部。

• 在插件开始工作之前，你可能需要对其进行配置。一些插件需要你做出选择并设置新的设置。

• 你也可能获得一组短代码或其他元素，你可以使用它们在你的帖子或页面中包含插件提供的额外内容。

• 可能没有配置页面，但你可能需要在你主题的某个模板文件中添加一些代码。

如果你不确定上传和激活插件后要做什么，请务必阅读插件可能附带的 README 文件，或者查看插件网站上的常见问题解答。

许多插件作者接受捐赠。我强烈建议向那些你认为有用的插件作者捐赠。这有助于鼓励社区中的每个人继续编写大家都能使用的优秀插件。即使你只能捐赠一小笔金额，这也会有所贡献。想想看，你节省了多少时间，多亏了你最喜欢的插件开发者。如果这很显著，也许你真的应该考虑捐赠。

必备的插件包

尽管官方目录中有超过 55,000 个插件，但你肯定不需要在 WordPress 网站上同时使用它们所有。有一小部分我们可以称之为“必备包”。我的必备插件列表可能与下一个人的不同，所以请将以下信息视为指导，而不是刻在石头上的必要性。话虽如此，如果我是诚实的，尽管我的某些博客同时运行着超过 25 个插件，但基本的必备列表仅包括七个插件。所有这些插件都处理特定任务，旨在使 WordPress 网站更好、更实用。

备份

备份可能是任何网站所有者最重要的任务，我非常认真地这么说。例如，你能想象一个整夜失去整个网站，而且无法恢复的情况吗？现在这听起来可能有点难以置信，但这种情况确实发生过。如果你运营的是一个个人博客，那可能并不那么悲惨。但对于一个商业网站来说，那完全是另一回事。

因此，备份的主要问题之一是，只有定期进行才有效。换句话说，你需要经常创建备份并将它们保存在安全的地方。虽然这一切听起来都很不错，但谁有那么多时间去手动做这些呢？没有人，老实说。这就是为什么我们将使用一个插件，它在后台进行魔法般的操作，而无需我们任何监督——介绍 UpdraftPlus——一个可在 wordpress.org/plugins/updraftplus/ 找到的 WordPress 备份插件：

此插件允许你以简单易懂且无烦恼的方式处理网站备份。它连接到你的远程存储账户，例如 Dropbox（但这里还有更多选择），然后自动定期备份你的网站。它只需要最少的初始设置。

如果你还没有账户，你可以在 www.dropbox.com/ 免费注册 Dropbox。作为免费套餐的一部分，你将获得 2 GB 的磁盘空间，这足以保持你的网站备份。

这里是整合 UpdraftPlus 与 Dropbox 所必需的步骤。在安装并激活插件后，导航到你的 wp-admin 中的设置 | UpdraftPlus 备份，然后切换到设置标签页。在那里，点击 Dropbox 标志：

点击标志后，向下滚动并点击主要的保存更改按钮。这将重新加载页面，你会看到一个通知，表明需要与 Dropbox 进行额外的授权，如下所示：

只需点击通知中的链接，您就会被带到 Dropbox 授权页面。要继续，您需要登录您的 Dropbox 账户并确认授权。几秒钟后，您将被重定向回您的网站，您的设置将就绪。在这个阶段，您已经将插件与 Dropbox 集成。现在需要做的就是告诉插件自动备份您的网站。

返回插件的设置选项卡。现在要注意的两个字段如下：

• 文件备份计划

• 数据库备份计划

这取决于您的个人喜好，但对于每天不发布多个条目的网站，将前者设置为每周，后者设置为每日将恰到好处，如下所示：

使用此插件，您还可以手动触发备份（除了备份计划功能之外）。当您首次安装插件时，这样做是个好主意，只是为了检查一切是否运行正常，并完成初始备份。您可以在设置中启动备份 | UpdraftPlus 备份。您将看到以下屏幕：

您需要做的只是点击大型的“立即备份”按钮。

启用 Google Analytics

Google Analytics 是一个非常受欢迎的网站统计和分析解决方案。它是免费的，对于初学者来说易于使用，并且对于任何愿意深入了解的人来说都非常强大。简而言之，Google Analytics 让您了解有关您网站所获得的网站流量的统计数据和数据，包括精确的访问者数量（每日、每月等）、流量来源、您最受欢迎的内容以及无数其他统计数据。Google Analytics 可在www.google.com/analytics/获取。

要在您的网站上启用 Google Analytics，您首先需要注册一个 Google 账户，启用分析，然后在控制面板中添加您的网站（所有这些都在官方 Google Analytics 页面上，包括详细的教程文档）。接下来，获取 Google 提供的跟踪代码并将其包含在您的网站上。这一步是 MonsterInsights 插件在 WordPress 中实现 Google Analytics 并使整个过程变得简单的地方。您可以在wordpress.org/plugins/google-analytics-for-wordpress/获取它：

下载并激活它后，转到洞察 | 设置。尽管插件有很多设置，但您必须做的唯一一件事是验证插件，以便您能够启用与您的 Google Analytics 账户的连接。只需点击“使用您的 Google 账户进行验证”按钮：

这将带您转到 Google 上的一个页面，在那里您需要点击另一个按钮，授权访问，然后您将被带回到您的wp-admin页面。现在，您可以选择所谓的用户代理配置文件，这就是您想要用于监控网站的内容。如果您在使用这种半自动认证方式时遇到问题，您可以简单地手动输入您的 Google Analytics 代码（称为 UA 代码）。此代码在 Google Analytics 的您的个人资料中可见（通常以UA-开头，后跟九位数字）。

一旦您完成认证过程，您的网站就完全连接到 Google Analytics，并且流量统计数据正在收集。过了一段时间后，您可以导航到 Google Analytics 中的您的个人资料，看看您的网站在访客受欢迎程度方面表现如何。此外，为了更立即地了解跟踪代码是否设置正确，您可以导航到 Google Analytics 中的实时流量部分。

缓存

老实说，缓存是一个相当复杂的概念。如果您说的是工程学，那么这里是对它的定义：在计算机科学中，缓存是一个透明地存储数据的组件，以便未来对该数据的请求可以更快地提供服务。用简单的话来说，如果您在网站上启用了缓存，它将加载得更快，并且对您的观众/访客来说将更加易于访问。幸运的是，尽管这个概念本身并不那么直接，但使您能够缓存的插件却是。目前，最顶尖的插件被称为W3 Total Cache，可在wordpress.org/plugins/w3-total-cache/找到：

并不只是我在推荐它。实际上，许多主要的托管公司和专家表示，它提供了快速优化您网站的方法。不仅如此，该插件还在网络上的一些主要博客中使用。

安装过程与任何 WordPress 插件相同。但就在您激活它之后，您会发现使用方式相当不同。首先，它通过左侧边栏中的一个全新的部分进行访问。它被标记为性能，位于设置下方。点击它不到一秒钟后，您就会意识到这个插件非常庞大。它可能有一本完全独立的书籍来专门介绍它。因此，在这里，我将只提供一个快速入门指南。

前往性能 | 常规设置，浏览页面。有许多标记为启用的复选框。为了开始使用这个插件，我建议您启用（勾选以下复选框）以下块：

• 页面缓存

• 数据库缓存

• 对象缓存

• 浏览器缓存

然后，点击任何“保存所有设置”按钮。从现在开始，你的网站将完全启用缓存，你的访客应该会立即开始体验到性能的提升。显然，我们只是触及了这款插件带来的可能性和自定义选项，所以我鼓励你在空闲时间更仔细地研究它。

搜索引擎优化

搜索引擎优化（SEO）是网上最受欢迎的话题之一（至少在网站所有者中）。简单地说，如果你正确地优化你网站的 SEO，这将提高你在搜索引擎（如 Google）中的排名，并且每天都会吸引更多的访客。从理论上讲，这个概念相当简单，但要实现这一目标的工作可能会变成一份全职工作。如果你不打算花大量时间在 SEO 上，那么至少，获取Yoast SEO插件，可在wordpress.org/plugins/wordpress-seo/找到，并处理基本设置。这个插件在博客圈中非常受欢迎，它被用于一些最受欢迎的博客中：

与之前的插件 W3 Total Cache 类似，这个插件在wp-admin中也有一个自定义部分。它位于设置下方，被称为 SEO。了解这个插件核心设置的最好方法是使用配置向导。你会在访问wp-admin中的插件部分 SEO 后看到指向它的链接：

这个向导做得非常好，它会一步一步地引导你完成插件的整个配置阶段，包括其最基本的设置和功能。我强烈建议你花些时间用这个插件优化你的网站，因为这项工作肯定会在长期内带来回报，也许甚至更快：

WordPress SEO 插件的作者 Joost de Valk 发布了一个单独的资源。这是你获取有关如何设置插件以及你可以做些什么来使你的网站 SEO 友好更深入信息的最佳去处。你可以在yoast.com/wordpress-seo/找到它。

社交媒体集成

社交媒体已经席卷了网络空间，如今，我们几乎无法想象一个网站在没有至少一些社交媒体集成的情况下存在。这种集成的益处显而易见。有了 WordPress 的良好社交媒体插件，你将能够将你的帖子分享给你的朋友和家人在所有最流行的社交平台上。不仅如此，你的读者也能这样做，从而有效地扩大你的受众群体，使你的网站更加受欢迎。最终，在社交媒体上发布病毒式内容可以迅速增加你的流量，让你的网站每周甚至每天都能被成千上万的新人看到。

因此，我们将通过在你的网站上显示一些社交媒体按钮来使你的读者（以及你）更容易分享你的内容，更准确地说，是在你的网站包含的每个帖子或页面上。

名为“Simple Social Media Share Buttons”的社交媒体插件是一个出色的免费解决方案，它提供了所需的功能。它可在wordpress.org/plugins/simple-social-buttons/找到:

安装并激活后，你可以转到“社交按钮”|“设置”中的插件设置部分。在那里，你可以查看插件自带的一些默认设置。好消息是，如果你不想处理任何这些设置，你可以保持原样——所有设置都是可选的。然而，如果你想进行一些调整，你还可以更改关于如何在你的网站上展示社交媒体按钮的许多事情：

如你所见，界面非常易于理解，让你可以从一系列不同的社交网络中进行选择，同时也提供了一些基本的定制选项（例如更改按钮的大小、它们在页面上的位置，以及是否显示分享计数器）。当你完成设置实验后，点击保存更改。

例如，我在设置中选择的设置仅包括 Facebook、Twitter 和 LinkedIn 按钮，以及一个简洁的极简主题，使这些按钮更加突出。以下是它们在博客帖子中的样子：

Jetpack

这个神秘的名字正是当今最受欢迎的插件之一的名字。由 WordPress.com 背后的团队开发的 Jetpack，提供了一系列真正卓越的功能和功能。该插件由多个模块组成，可以逐个启用或禁用。这让你可以完全控制你想要使用和不想使用的功能。Jetpack 可在wordpress.org/plugins/jetpack/找到：

下载并激活它后，你会在 wp-admin 中看到一个新部分，但这次，它位于仪表板下方，如下面的截图所示：

在内部，你可以看到所有可用的模块和功能。首先，你应该导航到 Jetpack | 设置来启用或禁用你需要的/不需要的模块。那里有超过 30 个模块，所以你有很多选择。幸运的是，它们已经被分成了几个类别：

• 写作：使内容创作更轻松的一切，以及网站加速的设置

• 分享：一些额外的社交媒体集成

• 讨论：帮助读者讨论和互动你内容的工具

• 流量：帮助你监控网站流量的工具和设置

• 安全：备份、增加的安全性和垃圾邮件保护

我不会在这里详细说明每个模块，因为这可能需要单独的一章。相反，我鼓励你点击你想要了解的每个模块的名称，自己获取所有信息。一般来说，每个模块都非常用户友好，所以你在安装或之后使用它们时不应遇到任何麻烦。

评论垃圾邮件

对于在线出版商来说，如果你遇到的是评论垃圾邮件，这可能是最令人烦恼的事情之一。基本上，垃圾邮件评论是为了将链接回退到特定网站而提交的评论。人们提交垃圾邮件评论的主要原因是为了 SEO。一般来说，在 SEO 方面，指向网站的链接数量是一个已知的排名因素，全球的网站所有者都在尽其所能获取尽可能多的链接。不幸的是，对我们来说，有时这意味着使用各种垃圾邮件方法。

WordPress 默认设置的评论方式使得任何人只需提交评论并在其中一个评论字段中输入网站地址，就能从你的网站获得链接。如果他们这样做，并且评论被批准，那么在评论的“名称”字段中输入的内容将成为链接的文本，而“网站”字段则成为链接的目标。

关于评论垃圾邮件最糟糕的是，一旦你的网站变得稍微有点受欢迎，你每天可能会开始收到数百条垃圾邮件评论；因此，手动处理它们几乎变得不可能。

不幸的是，与 WordPress 默认集成的功能中并没有包含打击评论垃圾邮件的功能。这意味着你必须安装一些插件来启用此功能。目前，让我们专注于最受欢迎的垃圾邮件保护插件——Akismet。好事是，它直接包含在标准的 WordPress 安装中，所以你应该能在你的 wp-admin 中的“插件”部分找到它。你需要做的只是激活它。

使用 Akismet

在激活插件后，您将在 wp-admin 的顶部区域看到一个提示。点击其中的大按钮：

Akismet 插件要求您拥有一个特殊的 API 密钥。获取这个 API 密钥并不特别困难，但我们仍然需要经过几个步骤。首先，点击“获取您的 API 密钥”按钮：

您将被重定向到 akismet.com (akismet.com/)，在那里您将能够完成整个过程。屏幕上的说明非常清晰，并一步一步地引导您完成所有步骤。要开始，您首先需要一个 WordPress.com 个人资料账户。如果您还没有，系统会提示您创建一个。注册时不需要任何花哨的东西——只需提供标准信息即可。我们已经在之前的章节中讨论过这一点。

一旦您有了账户并开始设置 Akismet，您应该特别注意您将要选择的特定订阅计划。在撰写本文时，有三个可供选择：基本（免费）、增值（5 美元）和企业（50 美元）。为了获得标准的垃圾邮件保护，您可以放心地选择基本计划，如下面的截图所示：

现在，这是一个有点棘手的问题。您选择的计划基于自愿捐赠。如果您不愿意花钱，只需将中间的滑块向左滑动，直到 $0.00/yr：

点击最后的激活链接后，您将被重定向回您的 WordPress 网站，API 密钥将已经在 Akismet 设置的正确字段中。

如果您感到自信，可以勾选“静默丢弃最糟糕和最普遍的垃圾邮件，这样我就永远不会看到它”的复选框。Akismet 在识别哪些评论实际上是垃圾邮件方面相对较好，勾选此复选框将使这些评论消失。然而，如果您担心 Akismet 误识别评论，请保持此选项未勾选。您只需点击“保存更改”按钮，您的博客现在就受到评论垃圾邮件的保护！这如下面的截图所示：

摘要

本章主要介绍了如何在不接触任何源代码的情况下扩展您网站上的功能，并使您的内容更具吸引力。基本上，这就是插件背后的整个理念。

一些开发者可能不需要插件，因为他们可以自己编写代码。然而，对于其他人来说，插件是使 WordPress 对每个人来说都易于使用和吸引人的关键。

到目前为止，我们知道了如何控制我们 WordPress 网站的内容，但这只是开始。在下一章中，我们将学习如何处理基本网站安全，并防止黑客接管我们的网站。

第六章：保护你的 WordPress 网站

网站安全的话题可能令人畏惧。一方面，我们都希望我们的网站是安全的，但另一方面，我们担心我们没有足够的技能来对抗试图入侵我们网站的黑客。但先别急着想这个；为什么有人会首先攻击你的网站呢？！你不是金融机构或流行的在线出版物，所以为什么有人会花时间试图损害你的网站呢？

嗯，在这种情况下，现实可能很残酷。大多数黑客攻击并不是为了窃取你的收入或完全控制你的网站。通常，它们是在你的网站上包含一小段代码，该代码链接到其他外部网站（大多数情况下，要么是欺诈网站，要么是不良内容）。黑客从中得到了什么？这因人而异，但通常，这类攻击是为了利用你的网站作为实现特定目标网络的一部分。实际上，你的网站变成了僵尸——它做黑客让它做的事情，并成为更大规模类似僵尸网站网络的一部分。

那么，我们如何防止你的网站发生这种僵尸化呢？这正是本章的主题。让我们从基础开始。

让我们看看本章将涵盖的主题：

• WordPress 安全原则

• WordPress 安全最佳实践

• 安装 SSL

• 安全插件以及哪些插件需要获取

• 设置安全用户账户

• 用户角色和能力

• 管理用户

• 用户管理插件

WordPress 安全原则

在我们深入探讨 WordPress 安全的任何具体技巧和技术之前，让我们先打下一些基础。你的首要目标是设置最基本元素，以便你可以避免 99%的攻击。记住，黑客并不是针对你的网站进行单独攻击。相反，他们针对的是一系列网站，并试图利用已知的漏洞。因此，如果你从你的网站上消除那个特定的漏洞，那么你实际上就是在防止攻击发生。

再次强调，我们的首要目标是：通过实施最佳实践进行预防。或者换句话说，让我们做 20%的工作，以获得 80%的结果。为了实现这一点，让我们从一些网站安全总体最佳实践开始。

WordPress 安全最佳实践

WordPress 网站安全最基本最佳实践的优点在于它们都非常简单易行。让我们从基础开始。

使用强密码

这听起来非常简单，但强大密码的价值不容小觑。许多黑客攻击试图利用用户拥有简单密码的情况，这些密码要么是字典中的单词，要么是最常用的密码之一。换句话说，如果你的 WordPress 密码在以下列表中，那么你就是在做错了：

|

• 123456

• 密码

• 12345678

• qwerty

• 12345

• 123456789

• letmein

• 1234567

• football

• iloveyou

|

• admin

• welcome

• monkey

• login

• abc123

• starwars

• 123123

• dragon

• password

• master

• hello

|

要查看最常用密码的更完整列表，请访问此页面：en.wikipedia.org/wiki/List_of_the_most_common_passwords。

那么，如何设置一个强大的密码？有两种方法：

• 或者使用一组随机字符，包括小写和大写字母、数字和特殊符号（如连字符）；例如：noUYhf56%%6fJJJ-Njh

• 想出一个实际的句子，然后使用连字符将其组合成一个密码；例如：我-喜欢-披萨-但-蛋糕-也很好

要更改密码，请转到用户 | 您的配置文件。一旦到达那里，点击生成密码按钮（参考以下截图）。WordPress 将建议一个密码，但您也可以输入自己的密码。完成后，点击更新配置文件：

保持 WordPress 更新

随着 WordPress 软件的每一次新版本发布，您都会得到一系列的改进和升级。其中一些是完全新的功能，一些是对旧功能的改进，还有一些是在安全领域内的改进。因此，保持 WordPress 更新是避免麻烦并确保您的 WordPress 网站与网站安全领域的最新发展保持同步的最佳方式。

每当有新的 WordPress 版本可用时，您将在wp-admin中看到一个更新提示。请确保注意这些提示。它们的重要性怎么强调都不过分。

保持主题和插件更新

保持更新这个想法，就像 WordPress 核心会更新一样，主题和插件也会更新。您应该一有可用就安装它们，原因和您想要安装 WordPress 更新的原因相同。

要查看您网站一般可用的更新，请转到仪表板 | 更新。您将在这里看到一个摘要，以及允许您安装更新的链接，如下面的截图所示：

避免安装不必要的插件

网上可用的 WordPress 插件有成千上万种。尽管其中一些可能看起来很吸引人，但在安装一些不太受欢迎的插件或未经用户测试的插件之前，您应该三思而后行。

一般而言，首先，您不应该安装任何不是为网站高效工作所必需的东西。如果一个插件只是个有趣的东西，但不是必需的，您可能应该跳过它。

除此之外，还要注意你考虑的插件的评价、兼容性信息和流行度数字。例如，以下是从 Jetpack 插件官方页面wordpress.org/plugins/jetpack/的一些相关字段：

当安装新的插件时，尽量不选择评分低、安装数量少或未与当前 WordPress 版本测试过的插件。

关于 WordPress 安全最佳实践的讨论就到这里。现在，让我们做一些额外的工作。

安装 SSL

安全套接字层（SSL）是一种创建于加密网站服务器（网站）与客户端浏览器（阅读网站的人）之间连接的网页技术。

在加密连接下，基本上不可能拦截来回传输的数据，因此进行某些操作时非常安全，甚至包括处理银行转账等最敏感的任务。

简而言之，一旦您在网站上启用 SSL，您将使黑客更难入侵和/或扭曲您网站与访客之间的连接。

幸运的是，如今安装 SSL 证书是一件简单的事情。大多数流行的网络托管商都将免费 SSL 证书作为您主要托管计划的一部分提供。您需要做的只是检查用户面板中的几个复选框来启用它。

不幸的是，具体步骤因托管服务而异。以下是如何使用一些流行的提供商来完成此操作的方法：

• Bluehost：my.bluehost.com/hosting/help/free-ssl

• SiteGround：www.siteground.com/tutorials/getting-started/configure-ssl-with-one-click/

• GoDaddy：www.godaddy.com/garage/enable-https-server/

• HostGator：support.hostgator.com/categories/ssl-certificates/ssl-setup-use/

如果您在其他地方托管网站，您可能会在他们的文档中找到类似的指南。

然而，即使您已经通过了您托管商用户面板中的步骤，您的 WordPress 网站上的 SSL 仍然只部分启用。这引出了安全插件的话题。

安全插件和哪些插件需要获取

网上有很多不同的安全插件，都承诺为您的 WordPress 网站处理一件事或另一件事。然而，并非所有这些插件都是必需的，或者说，很少是必需的。因此，让我们花一分钟时间讨论一下那些真正有用的插件。我们之所以在上一章中没有具体列出它们，是为了在这里更深入地探讨。

SSL 插件

在您的托管商端启用 SSL 后，是时候准备您的 WordPress 网站来接收它了：

1. 这可以通过一个名为Really Simple SSL的插件来完成，该插件可在wordpress.org/plugins/really-simple-ssl/找到：

1. 激活插件后，你会看到如下消息：

1. 点击继续，激活 SSL！按钮。完成此操作后，你将立即从 WordPress 仪表板注销，但不用担心，这只是过程的一部分。当你再次登录时，你会看到仪表板现在在https下而不是标准的http下可用。

2. 为了确保一切按预期工作，正常访问你的网站，并寻找网站地址旁边的特征性锁头：

通用安全插件

除了 SSL 之外，你还应该安装一个通用的安全插件来处理网站安全中的一些其他常见漏洞。我们将使用的插件名为Wordfence Security，可在wordpress.org/plugins/wordfence/找到：

开始使用此插件只需要基本的设置。安装并激活后，你会看到邀请你进行浏览并输入管理员电子邮件以接收有关网站安全通知的邀请，如以下截图所示：

虽然这个浏览很短，但它会向你展示所有最重要的功能，并告诉你如何有效地使用插件。大多数情况下，插件不需要任何监督，而且多亏了通知电子邮件，你只需坐下来放松，等待插件联系你，换句话说：

开始使用此插件的最佳方式是前往wp-admin中的 Wordfence | 扫描，然后点击下面的截图所示的大号开始新扫描按钮：

完成此操作后，你会看到正在运行的扫描。当扫描完成且一切正常时，你会看到一行勾选标记，确认扫描成功：

如果有任何问题，Wordfence 将在页面下方显示它们，并也会给你提供解决问题的提示。在任何情况下，你都可以通过点击标有查看完整日志或显示日志（如前一个截图所示）的链接来查看扫描的完整日志。

除了基本的扫描功能外，此插件还允许你阻止个别 IP 地址访问你的网站，通过缓存提高你网站的性能，甚至使你的网站对整个国家不可用（以防某些地理区域给你带来严重问题）。

然而，在这方面最重要的方面是，从现在开始，Wordfence 保护将自动运行，你不需要主动做任何事情来保持你的网站安全。每当需要你的注意时，Wordfence 将通过电子邮件发送通知，并告诉你应该做什么。这在很大程度上是一种设置后即可忽略的解决方案。

其他可以考虑的插件

在 SSL 和 Wordfence 问题解决之后，现在让我们快速浏览一下其他流行的安全插件。安装它们是可选的，具体取决于你认为在网站安全方面应该遵循的良好方向：

• Google 身份验证器 (wordpress.org/plugins/miniorange-2-factor-authentication/)：使用它来启用双因素认证

• 强制使用强密码 (wordpress.org/plugins/force-strong-passwords/)：提供密码强度指示器，并禁止使用弱密码

• WP 安全审计日志 (wordpress.org/plugins/wp-security-audit-log/)：记录你网站管理区域中所有活动的日志

• 登录锁定 (wordpress.org/plugins/login-lockdown/)：通过记录每次失败的登录尝试的 IP 地址和时间戳来保护你的登录页面，然后根据失败的登录尝试锁定特定的 IP 地址

• Sucuri 安全 (wordpress.org/plugins/sucuri-scanner/)：Wordfence 的替代品，另一个出色的安全扫描插件

了解更多信息：如果你想了解更多关于网站安全和 WordPress 安全的信息，你应该订阅 Sucuri 博客（在blog.sucuri.net/）。Sucuri 是一家备受尊敬的公司，在网站和 WordPress 安全方面处于领先地位。每当在 WordPress 领域发现新的漏洞时，通常都是 Sucuri 首先发布消息。

设置安全用户账户

到目前为止，在这本书中，我们专注于与个人网站一起工作——一个属于并仅由一个人使用和拥有的网站。然而，许多博客的使用方式不同——可能有一个博客或网站有各种作者、编辑和管理员。这使得网站更像是一个社区项目或甚至是一个在线杂志。此外，大型在线出版商使用 WordPress 作为其网站的基础也绝非罕见，在这种情况下，网站有多个作者、编辑、审稿人和总体贡献者，他们有不同的责任，更不用说技术团队或设计师了。所有这些人在与网站互动时都应该有自己的用户账户。

此外，即使只是你管理自己的个人 WordPress 网站，你也应该确保自己的账户尽可能安全。在本节中，你将了解如何使用户账户安全以及如何从头开始创建它们的所有细节。

在创建新用户账户时，你应该牢记以下三条主要规则：

• 每个新用户账户都应该有足够的权限来完成他们的工作，但不要更多

• 不要使用明显的用户名，例如admin或user；相反，使事情稍微复杂一点，例如使用firstname.lastname

• 使用强密码——这一点你已经知道了

让我们更详细地探讨第一个方面——账户权限。根据你为谁创建用户账户，这个人可能不需要对你的网站拥有完整的管理员级别访问权限。在大多数情况下，人们只想能够撰写和发布新的帖子或页面，而他们不需要管理员凭证来做这件事。以下是对 WordPress 中所有可用用户账户类型的概述，以及它们的目的。

用户角色和能力

WordPress 允许你在网站上使用无限数量的用户账户。每个用户都可以被分配五个不同角色中的一个。让我们逐一查看这些角色，从最强大的角色开始。

管理员

当你安装 WordPress 时，它会自动为你创建一个具有管理权限的用户。这个角色被称为管理员，每个 WordPress 网站都必须至少有一个管理员账户（你将无法删除所有账户）。正如你在前面的章节中已经看到的，管理员可以做任何事情。

管理员的主要目的是管理网站的所有事务。

通常，你不想在单个博客或网站上拥有很多管理员。对于有 10 到 20 个作者和编辑的博客，最好只保留一个管理员账户，或者对于有数十个用户的博客，可能最多只有三个管理员。

只有具有管理员角色的用户才能执行的一些操作示例如下：

• 切换博客主题

• 添加、编辑、激活或停用插件

• 添加、编辑或删除用户

• 管理一般博客选项和设置

当创建更多管理员账户（或管理主要账户）时，请确保只使用难以通过任何暴力破解方法破解的复杂密码。正如我们之前提到的，许多黑客攻击都围绕密码猜测展开，所以你的密码越复杂，破解它就越困难。

编辑

在管理员之后，编辑拥有最强大的角色。这个角色是为那些需要管理网站内容的所有方面，但不需要能够改变网站基本结构、设计或功能本身（这由管理员负责）的用户而设。

编辑的主要目的是管理网站的内容。

为了了解用户以编辑身份登录时的屏幕看起来像什么，让我们比较一下编辑菜单（在右侧）与管理员菜单（在左侧）：

如您所见，顶部部分没有变化（除了“更新”链接）。然而，几乎整个底部菜单，包括“外观”、“插件”、“用户”（替换为“个人资料”）和“设置”，都已经消失。我们可以看到，编辑只剩下编辑自己的个人资料和访问“工具”部分的能力，该部分包括任何允许编辑级别用户访问的插件页面。

具有编辑角色的用户可以执行以下操作示例：

• 管理所有帖子

• 创建和编辑页面

• 管理评论

• 管理分类、标签和链接

• 编辑其他用户的帖子

编辑角色的一个有利方面是，如果你仔细看，你会发现它拥有在特定 WordPress 网站上发布任何内容所需的所有凭证。这使得它非常适合日常使用，即使是单作者博客/网站。因此，我实际上鼓励你为自己设置一个单独的编辑账户，然后用它来发布和编辑内容，而不是使用默认的管理员账户。这种设置要安全得多，尤其是如果有人试图窃取你的密码，或者在你账户发生任何其他意外的情况下，网站本身也不会受到损害（因为编辑不能安装新的插件或删除任何现有的插件）。

对于多作者博客/网站，编辑角色旨在分配给负责在网站上发布内容的用户。正如其名所示，编辑角色非常适合编辑。

作者

作者的访问权限比编辑少得多。作者可以添加和编辑他们自己的帖子，并管理他们下属发布的帖子。然而，他们不能编辑其他作者发布的帖子，也不能管理不属于他们的帖子的评论。

作者的主要目的是管理他们自己的内容。

为了了解具有作者角色的用户体验，让我们比较一下作者菜单（在右侧）与编辑菜单（在左侧）：

如您在前面的屏幕截图中所见，“页面”部分已经消失。此外，如果作者查看完整的帖子列表，他们只能查看，但不能编辑、快速编辑或删除他们未创建的帖子（突出显示）：

如您所想象，作者角色非常适合，嗯，作者——那些积极参与为您网站创建内容的用户。例如，作者可以执行以下操作：

• 提交和发布他们的帖子

• 发布后管理他们的帖子

• 在他们的帖子下管理评论

贡献者

贡献者只能撰写帖子并提交给编辑审核。这些帖子将处于“待审核”状态，直到编辑或管理员同意发布它们。贡献者不能上传图片或其他文件，查看媒体库，添加分类，编辑评论，或执行其他更多权限用户可进行的任务。

贡献者的主要目的是提交内容供考虑。

值得注意的是，尽管贡献者可以创建和提交他们的作品供审核，但一旦文章发布，他们就无法以任何方式编辑它。然而，他们可以访问评论部分（进行管理）。

在这个角色的实际应用中，它最常用于与客座博主或任何其他非内部团队常规贡献者合作时。客座博主现在非常流行，通过贡献者账户处理它比通过电子邮件接收文章然后复制粘贴到 WordPress 上要省力得多。

订阅者

订阅者几乎什么都不能做，听起来可能很奇怪。他们只能登录并编辑他们的个人资料（调整他们的名字、姓氏、密码、个人简介等信息），仅此而已。根据“设置 | 讨论”中设置的权限，博客访客可能需要注册为订阅者才能发表评论。此外，还有一些插件处理向订阅者发送信息更新，例如时事通讯或新帖子的电子邮件通知。

订阅者对网站没有编辑权限。

大多数时候，这个角色被用作占位符。例如，一个特定的作者过去一直定期为您的网站做出贡献，但几个月内没有提交任何内容。您不必完全删除他们的账户，只需将角色更改为订阅者即可。

管理用户

要管理用户，请登录（当然是以管理员身份）并导航到“用户”。您将看到现有用户列表，如下面的截图所示：

当我们安装 WordPress 时，它只是创建了我们第一个用户（这就是我们一直登录的方式）。所以让我们创建一个新用户，并分配给该用户下一个最强大的角色——编辑。

1. 要这样做，请导航到“用户 | 添加新用户”。您将看到“添加新用户”表单，如下面的截图所示：

在此表单中，仅需要填写“用户名”和“电子邮件”字段。密码将自动处理。WordPress 将自动生成一个安全的密码，并在完成后发送给新用户。您还可以将“角色”从默认的（订阅者）更改为其他角色。在这种情况下，我选择了“编辑”。

1. 然后，单击“添加新用户”按钮。除了必填字段外，填写“名字”和“姓氏”也是良好的实践。这可以使进一步管理用户账户的任务更加清晰。

2. 在此示例中，我将重复此过程以添加一个作者、一个贡献者和一个订阅者。当我完成时，“用户”页面（用户可以在此管理）将如以下截图所示：

要查看您可以在每个新用户账户上执行的操作，只需将鼠标光标悬停在任意一行上。在这种情况下，您可以编辑或删除用户。您可以使用复选框和批量操作菜单，或者使用筛选链接仅查看具有特定角色的用户。您可以通过勾选框（或多个框）并使用“更改角色为...”下拉菜单来更改此页面上一个或多个用户的角色。

启用用户自助注册

通过自己添加用户不是向您的 WordPress 网站添加用户的唯一方法。您还可以让您的用户能够自行注册。

1. 首先，转到“设置 | 一般”并确保您已检查“会员”旁边的“任何人都可以注册”。

1. 我强烈建议选择订阅者作为新用户的默认角色，尽管如果您的博客需要，贡献者也会很好。然而，自动允许新用户分配具有更多权限的角色只会带来麻烦。

2. 接下来，在您的博客上某个位置添加一个链接，指向登录和注册页面。最简单的方法是使用名为“元数据”的小工具，它随您的 WordPress 安装一起提供。它将在您的侧边栏中添加一个带有几个有用链接的框，包括“登录”和“注册”。

3. 点击“注册”的用户将被带到以下基本注册页面，该页面只要求他们的用户名和电子邮件，如以下截图所示：

提交此表单后，用户将收到密码电子邮件，主要网站管理员将收到有关新注册的电子邮件通知。现在用户可以登录并编辑他们的个人资料，或者如果管理员更改了他们的角色，还可以做更多的事情。

您可以在codex.wordpress.org/Roles_and_Capabilities了解更多关于内置 WordPress 角色和功能的信息。

用户管理插件

在撰写本文时，WordPress 插件目录中有数百个带有用户标签的插件（wordpress.org/plugins/tags/users）。我们可以将这些插件分为许多组，因为它们提供的功能非常广泛。例如，有以下插件：

• 处理各种作者账户、共同撰写帖子和多作者网站

• 在 WordPress 周围构建会员网站，会员可以根据他们的订阅模式访问内容的高级包

• 构建一个经典的电子商务商店，让每个人都可以从可用的商品目录中进行购买

• 基于 WordPress 创建一个在线论坛

• 从 WordPress 直接向特定网站的用户发送电子邮件通讯，而不是使用外部服务

• 在 WordPress 上启动一个社交网络

• 管理注册用户的个人资料

如您所见，可能性是惊人的。如果我们愿意，我们可以用 WordPress 网站及其用户做几乎任何事情。只有我们的想象力限制了我们的行动。话虽如此，在考虑任何此类插件时，您应该始终考虑网站的安全性。

摘要

在本章中，您了解了 WordPress 安全性的原则以及如何确保您的网站不会成为黑客或恶意脚本/软件的受害者。您还学习了如何管理在一个网站或博客上工作的用户组。

现在已经解决了这些问题，是时候我们学习一些关于如何控制您网站设计的方法了。在下一章中，我们将讨论主题，以及为什么它们是 WordPress 最激动人心的部分。

第七章：选择和安装主题

使用内容管理系统（CMS）为您网站带来的最大优势之一是，您可以在不了解 HTML 和 CSS 的情况下更改您网站的外观和感觉。几乎每个 CMS 都允许用户自定义他们网站的外观，而无需担心内容被更改。这些管理外观被称为主题。在其他平台（例如 Blogger、Joomla 和 Drupal）上，主题有时被称为模板或布局。

数千个 WordPress 主题可以免费下载，还有数千个以相当低的价格提供。其中一些免费主题是由 WordPress 社区的成员开发的，并在 WordPress 的主网站上列出wordpress.org/themes/，而其他则可以在网络上的独立网站上找到。

在您准备好开始更改您网站的主题之前，您需要了解以下内容：

• 关于您考虑的主题的一些基本因素

• 如何找到高质量的主题

• 如何选择最适合您的内容和受众的主题

• 如何安装主题

在本章中，我们将讨论所有这些主题。本章是使用主题的入门指南。在接下来的章节中，我们将讨论开发您自己的主题的高级主题。

寻找主题

有数十个网站提供 WordPress 主题供您下载并安装到自己的网站上。许多主题开发者提供免费的主题，而有些则收取少量费用。当然，如果您找不到符合您需求的免费主题，您始终可以雇佣一个主题开发者为您创建定制的主题，或者您可以自己成为主题开发者（参见第九章 Developing Your Own Theme，开发您自己的主题）。

WordPress 主题目录

在寻找主题时，您应该首先访问位于wordpress.org/themes/的官方 WordPress 主题目录。这是 WordPress 社区中每个人上传他们的免费主题并使用关键词对其进行标记的地方，这些关键词描述了他们主题的基本外观、布局和功能，如下面的截图所示：

要更好地了解主题的外观，除了缩略图提供的内容外，只需点击主题的标题（以我的情况为例，Hestia，在wordpress.org/themes/hestia/）。您将被带到主题的详细信息页面，如下面的截图所示：

前一页向您展示了主题的描述、所有适用于它的标签、其他用户给予它的平均评分以及一些关于主题的评论。如果您点击“预览”按钮，您将能够看到主题的实际应用效果，如下面的截图所示：

当您浏览主题目录时，请务必注意您喜欢的任何主题；我们将在本章后面讨论如何将其添加到您的 WordPress 网站中。

值得指出的是，官方目录中的每个主题都附带其自己的支持部分和用户评价部分。您可以通过点击右侧边栏中的链接来查看它们，如下面的截图所示：

主题的主要类型

如前所述，主题主要有两种类型——免费主题和付费主题。此外，如果您不认为价格是一个因素，我们还可以将主题分为其他四个组——标准主题、子主题、起始主题和主题框架：

• 子主题：我们将在下一章中详细讨论这个问题，所以现在让我们说，子主题是一个继承另一个主题（父主题）功能性的主题。

• 标准主题：这些主题旨在以原始形式工作，同时允许一些基本的定制和调整（就像默认主题 Twenty Nineteen 一样）。

• 起始主题：在 WordPress 世界中，这是一个相对较新的概念。简而言之，当使用它们时，您被鼓励直接修改主题文件，并有效地使它们成为您目前正在构建的主题的基础。正如其名所示，它们为您的主题提供了一个很好的起点。这对于开发者来说是一个很好的解决方案，但对于只想下载一个很好的主题并立即使用它的普通用户来说，则不是那么理想。

• 主题框架：这些与起始主题有些相似（它们旨在用作自定义主题开发的基座），但它们通常提供更广泛的各种内置功能，并且可以直接作为独立主题使用（至少在一定程度上）。

在某种程度上，起始主题和主题框架之间的主要区别在于，当您获得一个起始主题时，您必须事先投入工作来使主题功能化。使用框架时，您会立即获得一个功能化的主题，但随后您需要花费时间调整其各种元素，使其与您的网站完美匹配。关于主题框架和起始主题的共同之处在于，它们通常是高度依赖代码的产品，这意味着如果您没有编程技能或者没有雇佣任何具备这些技能的人，您就无法充分利用它们。现在这可能听起来不是很清楚，没关系。我们将在下一章中进一步解释这个概念。

最后，标准主题是大多数博客作者和网站所有者在 WordPress 之旅中使用的主题，尤其是如果他们不需要任何高级定制或运营特定目的的网站（例如动画网站和交互式网站）。

寻找更多主题

如果你无法在官方目录中找到你想要的主题，你还有其他选择。有一些第三方网站提供免费主题，还有一些网站以价格出售主题。大多数商业主题提供两个或三个价格点：

• 第一个价格是购买主题供自己使用的成本，价格从 20 美元到 100 美元不等。这样的许可证允许你在单个网站上使用该主题。

• 第二个价格是如果你想在多个网站（域名）上使用该主题，或者当你需要项目图形（例如，Photoshop 文档）和其他开发文件时，你需要支付的价格。在这种情况下，通常价格在 60 美元到 200 美元之间。

• 最后一个价格点，尽管现在不太流行，是独家许可证。如果你想成为该主题的唯一用户，你可以获得它。价格可以从 500 美元到 1500 美元，甚至更多。

让我们专注于免费主题和付费主题的区别。虽然官方目录中的每个主题都是免费的，但互联网上的其他部分在这个问题上被一分为二。一些网站只提供免费主题，而另一些则只提供付费主题。还有一些分销商介于两者之间。我个人不推荐从官方目录或受尊敬的主题商店（通过促销提供一些免费主题）之外的其他地方获取任何免费主题。

原因很简单。只有高质量的主题才能进入官方目录，我不仅仅是在谈论外观或设计。除了设计之外，重要的是代码结构和代码质量。没有任何一个主题包含任何神秘的代码块（例如加密代码或可疑的外部链接），这些代码块会进入官方目录。这正是官方目录成为网上最好的免费 WordPress 主题来源之一的原因。

当谈到主题商店中发布的各种免费主题时，故事相当相似。可以说，WordPress 主题的第一梯队由受尊敬的、严肃的公司组成。因此，即使它们发布免费主题，也无法承受其质量低劣或存在其他任何问题。因此，在大多数情况下，它们也是可以安全使用的。

我们在网上能看到的最后一件事是，有成百上千个免费主题在随机网站上发布，通过付费广告、顶级主题列表、广告文章等方式推广。让我再说一遍：我不建议你们获取任何这些主题，即使设计很吸引人。事实上，你们永远不知道里面有什么，以及哪些安全漏洞可以被利用来黑客攻击这样的主题。它们几乎也从未得到其创作者的支持，并且没有主题文档或更新。简而言之，这样做不值得。

最后，如果你有一些钱想投资到你的网站和其质量上，考虑购买一个完整的付费主题，或者甚至是一个付费主题框架。如我之前提到的，价格范围大约在 20 到 100 美元之间，具体取决于制造商和主题附带的功能。

你可以查看任何你想要的主题提供商。但为了使事情更快，以下是我首选的第一批高质量主题商店列表：

• ThemeIsle: themeisle.com/

• Elegant Themes: www.elegantthemes.com/

• ThemeForest: themeforest.net/category/wordpress

此外，这里还有一个基于销售和产品质量的顶级 WordPress 主题商店列表：www.codeinwp.com/blog/wordpress-theme-shop-directory-2016/。

通常，大多数好的商业主题网站都允许你在购买之前预览主题的实际效果。一些网站甚至允许你在下载之前自定义主题。就像任何其他在线购物体验一样，在购买之前做一些研究，以确保你将获得一个质量好、支持良好的主题。市面上有很多编码不良的主题，甚至有恶意代码的主题。在购买主题之前，请验证主题的来源，并查看你是否能找到其他购买者的反馈或评论。

要找到更多提供主题的网站，只需在 Google 上搜索WordPress themes或premium WordPress themes，你将得到超过 1 亿个搜索结果。此外，请记住，选择主题不是最终的。你总是可以在以后审查你的决定，并在几个点击中更改主题。

选择主题时需要考虑的因素

让我们快速看一下在选择和安装主题时需要考虑的一些因素，这样你就能更好地了解情况。

主题的结构

WordPress 主题实际上是一个目录中的文件集合。没有特殊或异常的格式，只需对主题目录中的文件有一些基本要求。一个目录要成为有效的 WordPress 主题，必须满足以下条件：

• 它应该有一个style.css文件和一个index.php文件

• style.css文件必须在它的初始行中包含基本主题信息

在大多数主题中，你都会发现一些额外的文件。它们如下：

• 一个screenshot.png文件，这是显示主题外观的小缩略图。

• 一个images目录，其中包含与主题相关的所有图像。

• 不同的文件用于不同的目的（例如，functions.php、header.php、footer.php、page.php、single.php 和 archive.php）。阅读以下文章了解最常用的文件：codex.wordpress.org/Theme_Development#Template_Files。

想了解更多关于各种主题文件的结构及其层次关系，请随意阅读以下文章：developer.wordpress.org/themes/basics/organizing-theme-files/ 和 developer.wordpress.org/themes/basics/template-hierarchy/。

你现在不必担心这些细节，但了解它们将帮助你识别下载的主题内部发生的事情。这也会在接下来的章节中很有用，我们将讨论从头开始制作自己的主题。

此外，如果你下载的主题和其目录结构看起来与这里描述的非常不同，也无需担心。一些主题开发者决定采用自己的结构以提供一些额外功能和更可定制的环境。这种情况通常适用于各种主题框架和带有预制作子主题的大规模付费主题。

选择主题时需要考虑的因素

当你浏览可用的主题时，你会看到在外观、感觉和布局选项方面有很多不同的选择。说实话，选择一个完美的主题需要努力和思考。几年前，只有少数几个高质量的网站和商店可以让你接触到一些主题。现在，有成百上千个。所有这些导致了一个情况，即在选择主题时需要考虑多个因素。最好从以下方面开始。

主题的目的

正如我在本章和前几章中多次提到的，如今，WordPress 完全能够运行任何类型的网站，这一点也反映在可用的主题数量上。因此，首先要回答的问题是：你需要这个主题做什么？

根据你计划推出的网站类型，你应该关注不同类型的主题。以下是一些流行的可能性：

• 传统博客：这些博客的内容以倒序排列，只有几页静态内容。

• 照片博客：在内容组织方面，这些与传统的博客非常相似，但在这个案例中，内容主要由照片组成。这是摄影师和其他创意人士中流行的一种博客类型。

• 视频博客：这些与照片博客非常相似，但现在我们处理的是视频。

• 小型企业网站和公司网站：大多数小型企业网站不像传统博客那样有很多帖子。它们通常专注于静态页面，以提供关于业务最重要的信息（如联系数据和优惠）。这种类型最常用于像餐厅、咖啡馆、酒店和其他类似业务的地方企业。公司网站在本质上非常相似，但规模更大，内容也更多。

• 单页微型网站：有些人非常清楚他们只需要一个最小的在线存在，实际上将他们的新网站视为一张现代名片。在这种情况下，一个单页网站解决方案对他们来说非常合适。简而言之，单页网站就是听起来那样；它们只包含一个页面。然而，由于该页面的巧妙设计和结构，访客仍然可以在浏览时获得丰富的体验。

• 在线杂志：传统博客和在线杂志之间的主要区别在于后者包含的内容更多，通常每天发布多达十个或更多的帖子。这需要良好的内容布局和清晰的展示。

• 电子商务商店：传统上被称为在线商店或商店，电子商务商店是任何提供购物车功能并允许访客购买产品的网站，就像他们在传统商店或超市做的那样。

• 软件/应用程序网站：这些是致力于推广/销售特定产品的网站。如今，这通常是某种应用程序或其他移动软件。

选择网站主题的技巧在于理解其目的，并不仅仅基于主题的外观，还要考虑你需要这个主题的原因，比如它的功能以及进一步定制的选项。最简单的方法是关注你寻找主题的网站上主题的分类。例如，如果你访问了像themeisle.com/wordpress-themes/或themeforest.net/category/wordpress这样的流行主题商店，你会看到它们提供了按目的过滤主题的机制。以下是 ThemeForest 是如何做到这一点的：

您也可以在网上做一些研究，了解您所在领域和您网站类型所使用的主题的标准。例如，如果您正在考虑创建一个照片博客，找出其他照片博客使用的是什么类型的主题——它们是否有很多侧边栏？它们发布的照片有多大？是否有许多静态页面？等等。想法是这样的：不要重新发明轮子。如果您计划推出的站点与您计划推出的站点有显著数量的相似站点，那么您应该始终尝试从它们那里学习，然后在选择主题时做出明智的决定。

主题许可

如果您从官方目录获取主题，那么这部分与您无关。

然而，当从专业主题商店获取主题时，您通常有两个或更多关于许可证的选择。如我之前提到的，价格范围通常在 20 到 100 美元之间。现在，有许多许可模式，但以下两个示例是网络中最受欢迎的：

• 标准单站点许可证：这允许您使用该主题创建一个站点。如果您只是想为自己寻找一个主题，并且不打算在其他人的站点上使用它，那么这是推荐的选择。这是最便宜的许可证类型。

• 开发者许可证：此许可证针对开发人员和希望使用主题创建多个站点的人。此外，该套餐通常包括 PSD 项目文件和其他中期开发文件（请注意，一些单站点许可证也包括这些）。开发者许可证的价格可能是标准单站点许可证的两倍。

仅提供最新主题

这可能是这里最重要的参数。您的主题必须是最新的，否则将无法利用 WordPress 的最新功能。唯一的坏消息是，您无法确定一个主题是否是现代的。您只能依赖主题卖家提供的信息。但尽管听起来很糟糕，这实际上并不是一个大问题，因为严肃的主题商店无法承担在营销材料中撒谎的代价。所以，每当您看到一条消息说主题与 WordPress 版本 X.X 兼容时，它很可能是真的。此外，随着 WordPress 5 的发布，以及它带来的所有重大变化（与之前的版本相比），使用经过验证与 WordPress 5 兼容的主题非常重要。

此外，一个很好的经验法则是检查最后更新时间。根据您从哪个主题商店获取主题，这些信息可以在各种地方显示，因此我无法给您提供任何具体的建议在哪里寻找它。尽管如此，如果您从wordpress.org/themes/的官方目录获取主题，那么您可以在每个主题页面的右侧边栏中找到这个细节（标记为“最后更新”）。

可定制的主题

在考虑主题时，确保找到以下问题的答案：

• 侧边栏是否灵活？我能选择显示多少个侧边栏？

• 这个小部件准备好了吗？

• 它支持自定义菜单吗？

• 它是否与 WordPress 5.0 中引入的新 WordPress 块编辑器兼容？

• 主题是复杂的还是简单的？我更喜欢哪一个？

• 它是否支持自定义设置面板？或者它是否提供了一个主题设置页面，我可以在这里自定义布局、分类显示、主页和其他选项？

在 WordPress 发展的这个阶段，我建议拒绝任何不支持小部件、自定义菜单、没有提供良好的自定义功能或似乎与新 WordPress 块编辑器不兼容的主题。所有这一切背后的理念是，如今，可以直接使用主题的情况很少见，所以至少有几种自定义可能性会非常有益。

响应式结构的主题

这是在现代主题中的一项新参数。在过去，如果你想使你的网站适合移动设备，你需要安装一些插件和额外的移动主题，然后同时启用它们来工作。现在，有了 HTML5 和 CSS3，你只需使用一个主题，就可以确信它将在所有可能的设备上看起来都很棒（从台式电脑到笔记本电脑，再到移动设备）。所有这一切的关键词是响应式设计/结构。

每当主题开发者表明他们的主题是响应式的，这意味着它与人们现在用来上网的所有设备兼容。简而言之，每当一个主题是响应式的，这个事实肯定会在官方销售/下载页面上提到。

支持、评论和文档

这尤其重要，如果你正在购买付费的付费主题。简单地说，因为你正在花钱，你自然想确保你得到的产品是一个质量好、提供良好客户服务和精心设计的功能的优质产品，因此文档、评论和客户支持的重要性不言而喻。就是这样简单。

我必须承认，选择一个主题可能需要一些时间，尤其是如果你必须记住我们刚刚提到的所有内容，但这项工作肯定会物有所值。让我们不要忘记，你可能会至少使用这个主题一年或两年（这是一个常见的场景），所以你当然不希望把钱花在低质量的产品上。

安装和更换主题

现在你已经选择了想要使用的主题，你需要将其安装到你的 WordPress 网站上。你将有以下两种选择，就像添加新插件时一样：

• 如果你想要的主题在 WordPress 主题目录中，你可以直接从wp-admin中添加主题

• 否则，你将不得不下载主题的 ZIP 存档，然后手动将其上传到你的网站

从 wp-admin 中添加主题

如前所述，如果你从 WordPress 主题目录中选择了一个主题，你可以在wp-admin内部直接添加主题：

1. 首先，导航到“外观”，然后点击顶部的“添加新主题”按钮（如以下截图所示）：

将出现的屏幕将与“添加新插件”屏幕非常相似。在顶部，你会看到一些熟悉元素，例如各种子导航链接（特色、热门、最新、收藏夹、功能筛选器），以及右侧的搜索框。你可以点击网格上显示的任何主题来查看其详细信息，以及一个漂亮的预览。

1. 使用“功能筛选器”（如下面的截图所示），你可以根据主题具有或不具有的功能来筛选一些主题。功能筛选器是找到提供所需特定功能范围的主题的绝佳方式。例如，你可以选择只显示具有响应式布局的主题。这将确保你的网站在所有设备上看起来都很棒，包括所有台式电脑、以及手机和平板电脑：

1. 现在，我已经找到了一个喜欢的主题，所以我不需要过滤，只需在搜索框中输入主题名称，如下面的截图所示：

1. 当我悬停在主题块上时，我会看到额外的链接，用于查看详细信息、预览和安装。点击“预览”是一个很好的方式来查看主题在实际应用中的样子。当我点击“安装”时，主题将被自动下载并添加到我的主题收藏夹中（在wp-admin的“外观”部分可见），如下面的截图所示：

1. 点击主题后，我会看到一个包含所有详细信息的更大块，以及两个额外的链接来激活并查看主题的实时预览，如下面的截图所示：

此时，点击“激活”按钮将导致主题被启用，并将其设置为网站上的新设计——而不是默认的“Twenty Nineteen”（当你首次安装 WordPress 时的默认主题）。

下载、解压和上传

如果由于任何原因你无法在wp-admin内部安装主题，你将不得不使用以下程序。

此外，由于外部主题来源（如各种主题商店和独立开发者）的日益流行，手动下载和安装主题已成为处理事务的默认方式，并逐渐取代了从官方目录获取主题的传统方法。

因此，为了在解释手动安装时提供一个好的例子，我将获取一个主题（一个免费的）并指导您完成安装过程：

1. 要开始，您需要下载您想要的主题并将其 ZIP 存档保存在您的桌面上的某个位置。不要解压存档。我想尝试的主题叫做Underscores，这是一个免费的起始主题，可在underscores.me/找到。

2. 根据您主题的来源，为了真正获取它，您可能需要创建用户账户、进行购买或注册时事通讯等。当然，有时可能只有一个直接下载链接。Underscores 使用一个非常简单的模式。您需要做的只是输入您想在underscores.me/字段中使用的主题名称（可以是您想要的任何名称）。然后，点击生成后，您将获得 ZIP 下载：

1. 在这个阶段，您可以通过wp-admin导航到外观 | 主题并点击添加新按钮来上传那个 ZIP 文件。在那里，点击上传主题按钮，这将带您到可以最终执行手动安装的地方，如下面的截图所示：

1. 您在那里需要做的只是从您的桌面上选择 ZIP 文件，然后点击安装现在按钮。片刻之后，您将被重定向到成功页面，在那里您将能够激活您的新主题。

如果这个方法不起作用，请继续以下步骤手动提取和上传主题文件。

1. 如果您使用的是 Mac，ZIP 文件可能已经自动解压，在这种情况下，您会在桌面上看到一个目录而不是 ZIP 文件，或者除了 ZIP 文件外还有目录。如果没有，那么请手动解压/解压，以便您在桌面上有主题目录。

2. 以下截图显示了下载的 Underscores 主题的文件内容。除了必需的style.css文件和index.php文件外，它还有许多其他文件，用于处理不同的任务并处理主题的显示和功能各个方面：

1. 您需要将主题目录上传到您的 WordPress 网站。正如您在第二章“WordPress 入门”中所做的那样，您需要与您的服务器建立 FTP 连接。一旦连接，导航到您的 WordPress 网站安装目录。

2. 接下来，进入wp-content目录，然后进入themes目录。你将在这里看到已经有一个名为twentynineteen的主题目录（可能还有其他一些）。这些是随 WordPress 预先安装的主题。你在这里需要做的唯一一件事就是上传你刚刚解压的目录，让它与默认的twentynineteen目录并排放置。就这样了！

到目前为止，当你回到wp-admin中的“外观”时，你将看到等待在那里的新主题。现在剩下的唯一一件事就是激活它，并使用它作为你网站的主要设计。

摘要

本章介绍了如何管理 WordPress 网站的基本外观。你学习了在哪里可以找到主题，为什么它们是有用的，各种主题之间基本区别是什么，如何为你的网站选择一个完美的主题，以及如何手动通过wp-admin安装主题。

在下一章中，你将学习如何自定义现有的 WordPress 主题，从而使你的网站呈现出你想要的样子。

第八章：定制您的网站外观/设计

在这个阶段，您已经知道 WordPress 在您网站上可以拥有多少种设计——这都归功于主题。然而，仅仅获取一个主题并直接使用它并不一定是最佳优化方法。因此，在本章中，我们将更进一步——您将学习如何定制您的主题，使您的网站看起来完全符合您的期望。

我们将首先讨论如何管理导航菜单以及如何使用基本的布局定制功能来进一步增强您整个网站的功能。然后，我们将讨论小工具及其如何使用来使您的侧边栏更加实用和读者友好。我们将涵盖 WordPress 定制器的话题，以及它能为您的整体网站展示带来什么。最后，我们将讨论 Google AMP 以及如何确保您的网站在移动设备上的显示不仅仅是优化过的。

让我们看看本章我们将探讨的主题：

• 菜单

• 小工具

• WordPress 定制器

• 优化移动设备和使用 AMP

菜单

菜单对于任何网站的导航便捷性和帮助读者找到东西起着非常重要的作用。一个经典的网站菜单是显示在页面顶部附近，列出作为网站一部分的各个子页面。这些通常包括关于和联系等页面。在幕后，菜单只是指向您网站内不同区域的简单链接列表。

恰好，WordPress 以非常用户友好的方式处理菜单。您可以轻松创建包含指向页面、文章、分类存档甚至任意 URL 的链接的菜单。当您完成配置菜单本身后，您可以将其添加到设计中以显示。

添加菜单

让我们看看菜单管理屏幕。

1. 要到达那里，只需导航到“外观 | 菜单”：

1. 要创建您的第一个菜单，在“菜单名称”处输入一个标题（例如，主菜单），然后点击“创建菜单”。

2. 在这样做之后，您可以从左侧的面板中选择单个页面并点击“添加到菜单”按钮以确认：

1. 如果您想将特定的博客文章添加到菜单中，您也可以这样做。只需点击面板中的“文章”标题，然后选择您想要链接的确切文章。为了确认，点击“添加到菜单”：

1. 您还可以在菜单中添加一些自定义链接。这可以通过点击左侧的“自定义链接”标题并填写所需的链接信息来完成。为了确认，点击“添加到菜单”：

1. 接下来，您可以添加一些分类链接。点击左侧的“分类”标题，然后点击您想要包含的分类旁边的复选框。点击“添加到菜单”以确认：

1. 最后，请确保点击右上角的“保存菜单”。以下是我新菜单现在的样子：

1. 您还可以将项目拖到右侧，使其成为上方项目的子项。例如，我将我的一个帖子作为子项拖到“食谱”分类下。现在，我的菜单看起来如下截图所示：

您可以通过点击顶部的“创建新菜单”链接并重复此过程来创建更多菜单。

现在，您可能会问：我创建了新的菜单，但如何让它在我的网站上显示出来？

显示菜单

如果您有一个启用了菜单的主题（您可能已经有了），那么，一旦您有一个菜单，在“菜单”页面上就会出现一个新的框，显示菜单位置。Twenty Nineteen 有三个菜单位置，它们分别命名为“主要”、“页脚菜单”和“社交链接菜单”：

将您新创建的菜单分配到 Twenty Nineteen 预设菜单区域，您只需勾选一个复选框，如图所示的前一个屏幕截图。目前，我网站上的主要导航看起来如下截图所示：

当我点击“食谱”旁边的向下箭头时，我还会看到我保存为子项的其他帖子，如图所示的下个屏幕截图。Twenty Nineteen 在悬停菜单中显示子项：

小部件

小部件是 WordPress 中的一种原生机制。它们的主要目的是为我们提供一个简单易用的方式来自定义网站的侧边栏、页脚和页眉，并添加额外内容。尽管小部件最常见的位置确实是侧边栏，但唯一实际的规则是，小部件必须显示在小部件区域内，并且小部件区域可以位于主题开发者希望它所在的位置。常见的小部件包括以下内容：

• 博客文章的月度存档

• 一个可点击的页面列表

• 一个可点击的最新帖子列表

• 一个包含登录/登出链接、RSS 订阅链接和其他 WordPress 链接的元数据框

• 在博客上发布的最新评论

• 一个可点击的分类列表

• 一个标签云

• 一个文本和 HTML 的块

• 一个搜索框

这些天，几乎所有主题都启用了小部件功能，并提供一个或多个可用的小部件区域。如果我要简化一下，我会说小部件区域的行为就像菜单的位置。

要控制您新网站上的小部件，请执行以下操作：

1. 导航到外观 | 小部件。Twenty Nineteen 只包含一个小部件区域，如图所示，称为页脚：

1. 正如名称所示，这个部件区域出现在网站的页脚。你与部件的交互方式非常简单。你唯一需要做的就是从左侧可见的任何部件中选取一个，并将其拖放到任何可用部件区域下的右侧区域。例如，让我们以导航菜单块为例，将其拖动到页脚。结果如下面的截图所示：

1. 现在，我们可以给这个块添加一个标题，并使用下拉菜单选择我们想要包含在这个部件中的自定义菜单。目前只有一个菜单，是我们之前创建的，名为“主菜单”。一旦我们点击“保存”按钮（如前面的截图所示），我们的菜单就会被添加到适当的位置。

2. 到目前为止，我们在网站上显示了主菜单两次。一个在顶部区域，另一个在页脚内。正如你所见，如果你想在网站上某个位置放置菜单，你有两种方式可以实现。你可以在“外观 | 菜单”部分分配它，或者将其作为导航菜单部件，并将其放置在你主题支持的任何部件区域中。

3. 启用任何其他类型的部件与刚才描述的过程非常相似。你只需要拖动你喜欢的部件，并将其放置到你希望显示它的区域。然后，一旦部件放置好，你可以调整其设置和内容。

4. 当你在“外观 | 部件”部分工作时，你可以点击任何部件右侧的小向下箭头以展开详细信息并查看选项。你可以从左侧的可用部件集合中拖动一个新的部件，你可以上下拖动现有的部件以改变它们的顺序，并且你可以通过展开它然后点击“删除”来删除一个部件。

5. 尝试将部件放入不同的部件区域，然后刷新你的博客以查看它们的样式。如果你对任何部件进行了更改，请务必点击“保存”。

6. 此外，在屏幕底部，还有一个名为“无效部件”的额外部分，如下面的截图所示。许多部件都有它们的设置和参数。因此，即使你现在不想在网站上显示特定的部件，但又不想丢失其设置（以防将来你想再次使用该部件），这个部分就是放置它的位置。正如标签所说，这是你可以拖动你的部件以将其从显示中移除但保留其设置的地方。这也是你将找到任何之前激活但现在在切换到不使用相同部件区域命名约定的主题后自动停用的部件的地方：

WordPress 自定义器

WordPress 中另一个高度依赖于您主题的功能是自定义器模块。如果您在仪表板的屏幕设置中仍然启用了欢迎框，您可以通过单击下面的截图所示的 自定义您的网站 按钮来访问此模块：

访问此模块的另一种方式是通过访问 http://yoursite.com/wp-admin /customize.php。这是您将看到的内容（假设您正在使用默认主题）：

通过浏览左侧的各个选项卡，您可以调整您网站的各种方面——一些我们在本章中已经讨论过，还有一些是完全新的。我们将在这里查看它们。大多数主题中可用的自定义化如下：

• 网站标识

• 颜色

• 标题媒体

• 菜单

• 小部件

• 首页设置 / 静态首页

• 额外的 CSS

这个模块最好的地方是它提供了一个实时预览，这使得编辑设计的基本方面变得更快。完成编辑后，您可以在左上角可见的 X 按钮或 保存并发布 按钮上单击。

在我们深入了解自定义器的各个部分之前，让我们先看看界面各个部分那些好奇的铅笔图标。您可以在下面的截图中看到一个示例：

简而言之，这些是快捷图标。这意味着它们会显示在可以自定义编辑的特定界面元素旁边。因此，您无需在左侧边栏中搜索特定的自定义设置，只需单击相应的快捷图标，您就会立即跳转到正确的选项面板。例如，如果您单击网站的标题，您将跳转到可以编辑它的确切部分，如下面的截图所示：

我们将在浏览自定义器时逐一探索这些选项。

网站标识

网站标识 是自定义边栏中第一个可用的区块：

当您单击它时，您将能够调整诸如网站的 Logo、网站标题、标语和网站图标等设置。然而，这里需要说明的是，所有这些选项对您网站的影响在很大程度上取决于您当前的主题。例如，一个主题将显示的标志位置与另一个主题完全不同，网站标题也是如此，等等。因此，始终尝试那里的设置，并亲自了解它们的效果是个好主意。在幕后，我们正在处理的选项只是标准的输入字段和图像/媒体选择面板。这正是我们在本书的前几章中已经涵盖的内容

对于大多数 WordPress 主题来说，通常有一个元素是相同的，那就是“网站图标”设置。网站图标是可见于您网络浏览器窗口角落的小图标。例如，如果您访问这个图书出版商的网站www.packtpub.com/，您将看到以下截图所示的网站图标：

总体来说，网站图标是给您的网站在访问者的网络浏览器中提供一些视觉表示的好方法，这样他们就可以在同时打开多个浏览器标签时更容易地识别它。您可以通过自定义选择器轻松选择您的网站图标。目前推荐的图标图像尺寸至少为宽 512 像素，高 512 像素。

颜色

自定义选择器侧边栏的第二部分被标记为“颜色”。在这里，您可以选择当前主题为网站预定义的配色方案之一。Twenty Nineteen 主题在那里有两个选项，如下面的截图所示。此外，还有一个额外的设置来定义主颜色是否会影响您页面或文章的特色图像（自己尝试一下看看效果）：

从“默认”切换到“自定义”会将网站设计从白色背景颜色切换到您想要的任何颜色。如果您点击“自定义”，您就可以使用颜色选择器以更自由的方式调整设计中使用的某些颜色。

页眉媒体

页眉媒体是自定义选择器侧边栏中的另一个流行部分。尽管如此，这并不是当前默认主题 Twenty Nineteen 中可用的部分。然而，我在这里描述它，因为您很可能在其他许多主题中找到它。为了演示这一点，我将切换到 WordPress 的先前默认主题 Twenty Seventeen。这是使用该主题时的“页眉媒体”部分的外观。请参考以下截图：

大多数主题将允许您选择任何图像放置在页眉中，有时甚至是一个视频，就像 Twenty Seventeen 一样。Twenty Seventeen 对页眉图像也有一些具体要求（实际上，大多数主题都有，Twenty Seventeen 只是其中的一个例子）。建议的尺寸是宽 2000 像素，高 1200 像素，但您不必过于担心这一点，因为 WordPress 也提供了一些方便的图像编辑工具。您在这里需要做的就是使用“选择图像”或“添加新图像”按钮，从您的“媒体库”中选择一张图片，或者上传一张新图片。WordPress 会立即将您重定向到上述图像编辑工具，在那里您可以调整和裁剪您的图像，如下面的截图所示：

在点击“裁剪图片”按钮然后“保存并发布”后，我们就完成了设置标题图片。以下是网站可能的样子：

背景

一些 WordPress 主题还允许您调整不仅标题，还有整个网站的背景，这意味着您可以将任何图片放置在整个网站的背景中，并使其始终保持在那里。这与桌面壁纸类似，但适用于您的 WordPress 网站。尽管当前默认主题“二十九”不提供此功能，但这在其他主题中仍然是一个非常常见的功能，所以让我们使用另一个前默认主题“二十十五”来讨论它。

如果您使用该主题，并进入自定义器，您将在侧边栏中看到一个名为“背景图片”的新部分，如以下屏幕截图所示：

我们必须做的第一件事是选择我们想要放置在我们整个网站背景中的图片。让我再说一遍：我们的整个网站。在选择图片后（只需点击前一个屏幕截图中可见的“选择图片”按钮），预览块将被刷新，您将能够看到您的背景在当前时刻的样子。立即，在选项块底部出现了一些新的选项：

各种选项如下：

• 背景重复：这可以是无重复、平铺、水平平铺或垂直平铺：

  • 无重复：这意味着您的背景图片只会显示一次，当访客向下滚动时，背景图片将简单地耗尽。

  • 平铺：这是最受欢迎的设置，实际上也是默认设置。这意味着 WordPress 将在两个维度（宽度和高度）上重复您的图片。无论访客浏览您网站的哪个部分，背景图片始终可见。

  • 水平平铺：这将在水平方向上平铺您的图片。

  • 垂直平铺：这将在垂直方向上平铺您的图片。

• 背景位置：这可以是左、中或右。这决定了背景图片是否应该对齐到左、中或右。

• 背景附件：这可以是滚动或固定：

  • 滚动：您的图片会随着内容滚动。

  • 固定：您的图片保持在固定位置。换句话说，它始终静止在背景中。

我鼓励您在调整网站时尝试这些设置一段时间。

小工具

尽管我们在本章前面讨论了小工具，但自定义器为您提供了另一种使用它们的方式。您可以在名为“小工具”的部分中这样做。

一旦点击它，你将看到当前主题中所有可用的“小工具区域”。然后，当你点击任何一个区域时，你将看到分配给该特定区域的“单个小工具”。所有这些小工具都可以像我们在本章前面所做的那样轻松编辑；方法是一样的。

主页设置或静态前端页面

在自定义设置中，这个下一部分通常被称为“主页设置”或“静态前端页面”，具体取决于你使用的特定主题。一旦你导航到那里，你将能够更改当访客访问你的主页时显示的页面的主要设置——你网站的地址。你可以在以下设置中进行一些设置：

一旦进入那里，你将能够在“您的最新文章”的默认设置（在这个模式下，主页只是您最新博客文章的经典列表；这可能是你习惯的默认设置）和新的设置“静态页面”之间进行选择。第二个选项允许你将任何你希望的页面设置为网站的首页。你可以从“主页”下的下拉列表中选择一个现有的页面，或者通过点击“+添加新页面”链接创建一个新页面。

如你从“第四章，页面、媒体和导入/导出内容”中可能记得的那样，我们在那里所做的就是创建一个新页面并将其设置为网站的定制主页。我们将其命名为“主页”——非常合适。重要的是要记住，你分配为主页的任何页面仍然是一个正常的页面，这意味着你可以通过wp-admin的“页面”部分像编辑其他页面一样编辑它。

除了主页之外，这里还有一个名为“文章页面”的另一个区块。如果你将主页改为静态页面，那么分配一个新的“文章页面”总是一个好主意。由于最新的文章列表将不再显示在主页上，新的“文章页面”将从现在开始处理这项任务。与主页一样，你可以选择一个现有的页面作为新的文章页面，或者创建一个新的页面。

然而，在这种情况下，实际上创建一个全新的页面比选择一个现有的页面要方便得多。你可以将其命名为 BLOG 或另一个类似的名称，以传达页面的目的。这个页面的有趣之处在于，你不需要手动编辑它或在其上放置任何内容。WordPress 会自动填充这个页面，所以你唯一需要做的就是创建它，仅此而已。

如果你创建了新的“文章页面”，别忘了从你的主菜单中链接它。否则，当你的观众访问你的网站时，他们将无法找到它。我们在本章前面讨论了菜单。

额外 CSS

额外 CSS 是自定义设置的最后一块。如果你想在当前主题中包含一些自定义更改，而这些更改无法通过其他方式实现，这将很有用。一旦你点击“额外 CSS”，你将看到一个文本输入块，你可以在这里输入任何你想要的 CSS 代码。不过，请注意。如果你不确定自己在做什么，处理原始 CSS 代码可能会迅速引起问题。总的来说，这个部分是为高级主题自定义而设计的：

安排你的设计更改

在 WordPress 自定义设置中，你还可以做的一件有趣的事情是安排你的更改在指定日期公开，而不是立即推出。

默认情况下，当你点击主“发布”按钮时，你对网站所做的任何更改将立即公开。为了安排更改，请点击 WordPress 自定义设置中主“发布”按钮旁边的齿轮图标。然后，从出现的部分中选择“安排”，然后选择你希望更改公开的确切日期和时间。参考以下截图：

除了这些，你可能还在前面的截图中发现了一个可用的预览链接。你可以用它来与他人分享你的更改，或者稍后自己回顾。

在实际的真实场景中，当你在实时网站上工作时，这个整个功能可能会很有用。你并不总是希望你的更改在你完成工作后立即上线。为计划发布做准备通常是一个更有吸引力的视角。此外，多亏了这个功能，你可以在网站流量高峰时段避免推出更改。

自定义预览

最后但同样重要的是，在自定义设置窗口的左下角有四个有趣的图标，如下面的截图所示：

从左到右，它们是“隐藏控件”按钮（这个按钮会隐藏整个自定义设置侧边栏，以便你在调整网站时有一个更大的画布），桌面视图图标，平板视图图标，和移动视图图标。最后这三个图标尤为重要。如今，越来越多的人倾向于在移动设备上浏览网页，而不是在经典的桌面电脑上。因此，确保你的网站在这些设备上正确显示至关重要。这三个图标——桌面视图图标、平板视图图标和移动视图图标，允许你做到这一点。当你点击任何一个图标时，整个自定义设置窗口的大小将改变，以模拟平板和移动设备上的显示模式。在模式之间切换，你可以确保你的网站在所有设备上看起来都很棒。我们将在本章的下一部分详细讨论移动优化。

优化移动设备和与 AMP 协同工作

加速移动页面（AMP）是由谷歌推出的一项开源项目，旨在使无论用户使用什么设备，移动设备上的内容查看更加流畅和用户友好。

几年前，移动网络的概念才刚刚开始，许多网站在移动查看方面的优化非常糟糕。在那些日子里，由于技术不允许在手机上有效消费媒体，移动设备并不那么重要。然而，随着智能手机的引入，这一切都发生了变化。如今，使用移动设备上网的人数比使用桌面电脑和笔记本电脑的人数还要多。

显然，网站需要适应并为其默认的桌面视图提供优化的移动查看界面。

这就是 AMP 发挥作用的地方。在许多情况下，使现有网站对移动设备友好并不是一件容易的事情。如果你的主题/设计不是出厂时就进行了移动优化，那么在它上面添加移动功能可能会很困难。AMP 提供了一个更简单的解决方案。你不需要手动重建网站的部分，而是可以安装一个 AMP 模块插件，并自动完成。作为结果，你将得到一个网站的 AMP 版本。这个新版本将只对您的移动访客显示。以下是 AMP 成为好主意的原因：

• 它针对高性能进行了优化——AMP 页面几乎瞬间加载完成，这对于移动用户来说是一个更理想的场景，比等待几秒钟才开始在页面上看到任何内容要好——这是未针对移动查看优化的页面的常见情况

• 谷歌在显示移动搜索结果时更喜欢 AMP 页面

• AMP 的设计简化了，将内容放在首位，因此让您的访客能够快速到达他们感兴趣的部分

让我们再加上这样一个事实：AMP 正迅速变得流行。据数据表明（theblog.adobe.com/google-amp-one-year-later），到 2017 年 2 月，美国顶级出版商的 AMP 页面占所有网络流量的惊人 7%。

如何在 WordPress 中启用 AMP

毫不奇怪，有一个插件可以为你处理集成。它简单地被称为“WordPress 的 AMP”，你可以从wordpress.org/plugins/amp/获取：

这个插件的使用简直不能再简单了。你唯一需要做的就是安装并激活它。之后，它会自动运行，无需人工干预。只有少数几个可选设置你可以调整。第一个可以在“AMP | 通用”中找到。默认情况下，WordPress 的 AMP 仅对博客文章启用。你可以通过开启它来为你的页面也启用：

在这个阶段，你的网站已经完全集成了 AMP。每当有人尝试在移动设备上访问你的文章或页面时，他们将被重定向到其 AMP 版本。如果你在你的标准文章 URL 末尾附加/amp/，你就可以找到这些版本，例如：

• 文章的标准版本：yoursite.com/some-post/

• 文章的 AMP 版本：yoursite.com/some-post/amp/

你可以定制的第二件事是 AMP 主题的颜色方案。为此，转到外观 | AMP。你将能够更改颜色和颜色方案的整体氛围：

这就是一篇示例文章在转换为 AMP 并在移动设备上查看时的样子：

了解更多：

• 如果你想了解更多关于 AMP 项目的信息，官方网站是一个好的起点：www.ampproject.org/

• 这是一份针对开发者的AMP 快速入门指南：www.ampproject.org/docs/getting_started/quickstart

• 这是一份针对 AMP 页面的在线验证器：validator.ampproject.org/

摘要

在本章中，你学习了主题定制的基础知识。你现在了解了菜单、小工具、页眉和背景设置，如何使用 WordPress 定制器，如何使你的网站准备好使用 AMP，以及更多。在这个阶段，你知道如何为你的网站挑选一个优秀的 WordPress 主题，然后如何精确地定制它以满足你的需求。

在下一章中，你将逐步学习如何从头开始构建自己的主题。

第九章：开发你自己的主题

到目前为止，你知道如何在网络上找到主题并将它们安装到你的 WordPress 网站上使用。但是，WordPress 还有更多要提供，尤其是在主题开发方面。在本章中，你将学习如何将你自己的设计转换成一个完全功能性的 WordPress 主题，然后你可以在你的网站上使用它。你还将学习如何与其他网络用户分享你的 WordPress 主题。

在我们开始之前，你需要以下内容：

• 你自己的网站设计

• 将你的设计切割成 HTML 结构的能力

我们将从切割和切割的建议开始，以确保你的 HTML 和 CSS 文件尽可能符合 WordPress 的要求，然后介绍将 HTML 构建转换为完全功能性的主题的步骤。

注意，我假设你已经熟悉编写和使用 HTML 和 CSS。

本章我们将涵盖以下主题：

• 设置你的设计

• 将你的构建转换为主题

• 在你的主题中创建模板文件

• 使你的主题对小工具友好

• 在你的主题中启用菜单

• 使你的主题在 WordPress 自定义器中可编辑

• 创建子主题

• 分享你的主题

本章仅涵盖主题创建的非常基础的部分。实际上，这个主题值得有一整本书，而且确实有一本！我强烈推荐《WordPress 主题开发：入门指南》，作者 Rachel McCollin 和 Tessa Blakeley Silver，Packt Publishing。这本书详细介绍了你如何创建自己的主题，包括选择配色方案、考虑字体、编写最佳 CSS 以及使用快速设计合成来布局 HTML 等细节。如果这一章让你还想了解更多，就去那里看看吧！

设置你的设计

几乎世界上任何设计都可以变成 WordPress 主题。然而，你应该遵循一些关于你主题设计和 HTML/CSS 构建的一般指南。

设计你的主题以符合 WordPress 的要求

虽然你可以以任何你想要的方式设计你的博客，但一个好的起点是使用以下截图所示的标准博客布局：

注意，虽然这些标准布局的列数不同，但它们大多数都有以下基本部分：

• 标题

• 主要列

• 侧边栏（s）

• 页脚

WordPress 期望你的主题大部分遵循这个模式。虽然你可以发挥创意，不在你的设计中包含一个或多个这些模块，但如果你不跳过任何内容，你将能从这次体验中获得最多的教育价值。WordPress 将为你提供使你的工作更轻松的功能。此外，一个保持与 WordPress 主题相同的一般设计模式的构建将很容易适应现有的插件和小工具。

话虽如此，在 WordPress 世界中，一个常见的情况是构建定制的首页或着陆页（即特定目的的页面，大多是商业用途），这些页面具有完全不同的设计。因此，你可能会遇到一眼看上去不像是用 WordPress 构建的网站。此外，许多现代主题框架也提供了创建此类自定义首页以及其他自定义页面模板的可能性。这都属于使 WordPress 能够运行任何类型网站的趋势的一部分。

在本章中，你将学习如何构建一个提供经典博客布局的基本 WordPress 主题。以下截图展示了最终产品的样子：

设计的 HTML 结构建立在 _S 启动主题之上（你可以在underscores.me/上了解更多关于下划线的信息）上，视觉元素全部通过 CSS 完成，对原始 HTML 结构只做了最小程度的修改。

主题开发的三个路径

实际上，在开发你的新主题时，你可以遵循三条路径：

• 你可以选择从头开始，通过手动构建主题的 HTML 结构和功能结构

• 你可以在现有的主题框架之上进行工作，你只需要将你的设计适应框架本身提供的结构

• 你可以选择一个介于两者之间的解决方案

所有这些路径都有其优缺点。

从零开始构建主题

从零开始构建主题的主要优势是获得巨大的教育价值。当你从头开始开发主题时，你会学习到主题构建和功能的基础知识。这种知识对你的 WordPress 未来项目将大有裨益。

另一方面，这也是三条路径中最耗时的。在专业的生产环境中（在以设计和发展主题为职业的人中间），从头开始创建主题是一种耗时很高的方法，使其相当无效。这不仅仅关于适应设计（在主题框架中也必须这样做）；更多的是关于构建主题的核心功能。

使用框架构建主题

这种方法的主要优点是它的时效性和最终结果的质量。例如，如果你是从头开始构建主题，你必须确保在开发过程完成后很长时间内保持你的主题更新。问题是，WordPress 更新非常频繁（大约每 50-90 天更新一次），许多功能的目的随着时间的推移而改变——它们甚至可能被完全删除或被新的功能所取代。在这种情况下，只有保持更新的现代主题才能充分利用这些功能。显然，更新你的主题将需要大量的工作。这就是主题框架发挥作用的地方。本质上，主题框架是设计非常简约且没有视觉复杂性的主题。

框架的目的是通过充当父主题来成为任何未来主题的基础。框架本身没有设计的事实使得每个创作者几乎可以引入任何可想象的设计，同时充分利用框架提供的功能和结构。现在，优质框架的强大之处在于它们几乎与 WordPress 插件一样频繁地更新。简而言之，如果你使用框架，你不必担心你的主题过时。每当有更新可用时，你只需简单地执行它，然后忘记这一切。

这让我想到了使用主题框架的主要缺点。大多数情况下，主题框架都是庞大的、复杂的网络软件（超文本预处理器，或 PHP 脚本）。因此，如果你想有效地使用它们，你必须花大量的时间学习框架本身。除此之外，如果你决定以后切换到不同的框架，你将不得不重新学习（框架通常彼此非常不同）。正如你所看到的，使用框架带来的好处是有代价的。

下面是一些流行的主题框架（包括付费和免费的），如下所示：

• Gantry (免费): gantry.org/

• 樱桃框架 (免费): www.cherryframework.com/

• 混合核心 (免费): themehybrid.com/hybrid-core

• Unyson 框架 (免费): unyson.io/

• 创世纪 (付费): my.studiopress.com/themes/genesis/

• 一些框架列在官方 WordPress 网站上：

  codex.wordpress.org/Theme_Frameworks

使用起始主题构建主题

最后，还有一个第三种解决方案，它介于从头开始构建主题和使用框架之间——使用起始主题。

启动主题，就像我们将在本章中使用的主题一样，是一个很好的解决方案，以确保你构建的主题具有正确的框架，与现代化实践保持一致，并且优化用于 WordPress 网站。除此之外，启动主题还让你有充分的自由来调整你的创作（你几乎有从头开始构建主题时相同的自由）。

换句话说，启动主题为你提供了两全其美的解决方案；也就是说，从头开始和使用框架。你可以通过这种方式学习 WordPress 主题的基本结构，同时，你不必担心犯任何愚蠢的错误，因为任务的核心是由启动主题本身处理的。

下面的主要目的是学习这门手艺，了解 WordPress 内部的所有基本结构和机制。你的主题开发之旅从你在 Photoshop 或其他类似工具中准备好图形设计开始。你也可以使用本章的代码包并从那里开始与设计一起工作。无论如何，下一步是将它转换成一些 HTML 代码。

将你的设计转换为代码

对于本章的目的，我假设你已经知道如何将图形网站设计转换为 HTML 和 CSS 结构。有了这个，我们将在本章中介绍一些关于如何进行切片和切块的要点。

让我们开始工作，看看为构建的当前主题生成的 HTML 结构（由 _S 启动主题生成）。只是为了提醒你，启动主题可以在underscores.me/生成。

检查 HTML 结构

下面的是我食品博客设计的 HTML 文件的基本布局；我在这里展示它只是为了给你一个我们将要工作的总体概念：

<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1">
<link rel="profile" href="http://gmpg.org/xfn/11">
<link rel="stylesheet" id="open-sans-css"
  href="//fonts.googleapis.com/css?family=Open+Sans%3A300italic
  %2C400italic%2C600italic%2C300%2C400%2C600&subset=latin%2
  Clatin-ext&ver=4.0.1" type="text/css" media="all" /> 
<! -  embedding Google Fonts  - >
<link rel="stylesheet" id="daily-cooking-custom-style-css"
  href="style.css" type="text/css" media="all" /> 
<! -  embedding the style sheet for the design  - >
<title>Daily Cooking</title>
</head>

<body>
<div id="page">
  <header id="masthead" class="site-header" role="banner">
    <div class="site-branding">
      <h1 class="site-title">Daily Cooking</h1>
    </div>
    <nav id="site-navigation" class="main-navigation"
    role="navigation">
      <! -  placeholder for site navigation  - >
    </nav>
  </header>

  <div id="content" class="site-content">
    <div id="primary" class="content-area">
    <main id="main"  class="site-main" role="main">
    <article>
      <header class="entry-header">
        <h1 class="entry-title">Hello world!</h1>
      </header>

      <div class="entry-content">
        <p>Welcome!</p>
        <! -  main content block  - >
      </div>

      <footer class="entry-footer">
        <! -  footer of the content block  - >
      </footer>
    </article>
    </main></div>

    <div id="secondary" role="complementary">
      <! -  sidebar  - >
    </div>
  </div>

  <footer class="site-footer" role="contentinfo">
    <! -  main footer of the page  - >
  </footer>
</div>
</body>
</html>

这个 HTML 结构可以在本章的官方代码包中找到——称为阶段 1。

你可以看到我已经将主要部分分离出来，如下所示：

• 标题位于 HTML5 <header> 标签中。

• 作为其中的一部分，有主要网站导航，也在 HTML5 <nav> 标签中。

• 接下来，我们有主要内容块，<div id="content" class="site-content">;；每个单独的文章将显示在独立的 HTML5 <article> 标签内。

• 之后，我们有一个处理侧边栏的部分，<div id="secondary" role="complementary">。侧边栏设置了role="complementary"属性。本质上，角色属性描述了元素在文档上下文中的作用。在这种情况下，侧边栏是对主要内容（如果你仔细观察，你会发现内容部分确实设置为role="main"）的补充。一般来说，这样的属性旨在解释 HTML 结构中元素的目的。

• 最后，是页脚部分，使用<footer>标签。请注意，这是 HTML5，可能在旧版网页浏览器上无法正常工作。

现在我已经有了基本布局，我将添加一些更多的 HTML 元素来使其更加丰满，包括在<head>中添加更多信息，以及在主要内容框中添加一些额外的 CSS。然后，我将填充侧边栏、页眉、内容和页脚。

检查 CSS

通常，在网页开发中，一个好的实践是从重置各种网页浏览器使用的默认样式开始你的 CSS 设计。主要问题，以及为什么这是一个重要步骤的原因，是大多数流行的网页浏览器（或者说，我应该说，每一个）都有自己的默认 CSS 样式集。如果你想让你的主题在每一个浏览器中看起来完全一样，你必须从重置这些样式开始，无论它们实际上可能是什么。好事是，你不必手动做这件事。你只需使用互联网上可用的重置脚本之一。请记住，本章中列出的每一块代码也都在你书的官方代码包中可用。所以，我们首先要做的是在新的style.css文件开头添加以下 CSS：

/* setting up the basic elements - starter setup */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  border: 0;
  font-family: inherit;
  font-size: 100%;
  font-style: inherit;
  font-weight: inherit;
  margin: 0;
  outline: 0;
  padding: 0;
  vertical-align: baseline;
}

html {
  font-size: 62.5%;
  overflow-y: scroll;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}

body {
  background: #fff;
}

/* resetting the basic content blocks */
article, aside, details, figcaption, figure, footer, header, main,
  nav, section {
  display: block;
}

/* resetting the lists */
ol, ul {
  list-style: none;
}

table {
  border-collapse: separate;
  border-spacing: 0;
}
caption, th, td {
  font-weight: normal;
  text-align: left;
}

blockquote:before, blockquote:after, q:before, q:after {
  content: "";
}
blockquote, q {
  quotes: " "";
}

a:focus {
  outline: thin dotted;
}
a:hover, a:active {
  outline: 0;
}
a img {
  border: 0;
}

现在，让我们看看实际的 CSS——构建我们设计的东西，而不仅仅是重置它。首先，我们将回顾显示设计中的所有内容的 CSS。请注意，我为所有关键元素都设置了样式，例如页眉、侧边栏、主要内容区域和页脚。

此外，请注意，这只是一个框架；它只表示最终 CSS 样式表的各个区域。关于 CSS 的讨论并不是本书关注的重点。因此，我包括了上述代码包的完整版本，现在，我只展示 CSS 的各个区域。这是为了在你查看完整的样式表时使整个事情更容易理解。说实话，从 CSS 设计角度来看，最终的 CSS 并不复杂，但它相当长。以下是简化版本：

1. 让我们从字体设置和各种标准内容元素开始。在这里我不展示单个样式，因为它们相当基础，在我们 WordPress 网站结构中不起很大作用：

      /* -  -  -  - -
      Typography
       -  -  -  -  - -*/

      body, button, input, select, textarea {}
      h1, h2, h3, h4, h5, h6 {}
      h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {}
      p {}
      b, strong {}
      dfn, cite, em, i {}
      blockquote {}
      address {}
      pre {}
      code, kbd, tt, var {}
      abbr, acronym {}
      mark, ins {}
      sup, sub {}
      small {}
      big {}

      /* -  -  -  - 
      Elements
       -  -  -  - -*/

      hr {}
      ul, ol {}
      dt {}
      dd {}
      img {}
      figure {}
      table {}
      button, input, select, textarea {}

1. 接下来是一组规则，将负责对齐、总体设计结构、标题和其他典型 HTML 元素的处理：

      .site-header {
        width: 15%;
        float: left;
        height: auto;
        background: #279090;
        margin-right: 2.5%;
        border-radius: 6px;
      }

      #page {
        width: 1160px;
        margin: 0 auto;
        margin-top: 50px;
        position: relative;
        overflow: auto;
      }

      #primary {
        width: 56%;
        float: left;
      }

      /* Navigation */
      .main-navigation {
        clear: both;
        display: block
        float: left;
        width: 100%;
      }

      /* Alignments */
      .alignleft {
        display: inline;
        float: left;
        margin-right: 1.5em;
      }
      .alignright {
        display: inline;
        float: right;
        margin-left: 1.5em;
      }
      .aligncenter {
        clear: both;
        display: block;
        margin: 0 auto;
      }

1. 网站结构的中心部分是显示文章和页面的地方。其代码如下：

      .site-content .page, .site-content .post {
        margin-bottom: 40px;
        background-color: white;
        border-radius: 6px;
      }

      .entry-header h1.entry-title {
        text-align: center;
      }

      .site-content .entry-content {
        padding: 10px 20px;
      }

1. 主要侧边栏的代码如下所示：

      #secondary {
        width: 24.5%;
        float: left;
        height: auto;
        margin-left: 2%;
        opacity: 0.6;
        background-color: white;
        border-radius: 3px;
        padding: 0 10px;
      }

1. 最后，页脚的代码如下：

      .site-footer {
        float: right;
        padding: 20px;
      }

在这个样式表中，你会发现许多特定的类，这些类不仅仅是我的创作，而是来自 WordPress 本身。我的意思是：当 WordPress 创建所有项目时，包括页面列表、分类列表、存档列表、图片和画廊，它会给许多这些项目一个特定的类名。如果你知道这些类名，你可以准备你的样式表来利用它们。这也是我们在这里使用起始主题的另一个原因。有了它，我们不必担心任何这些问题。

例如，当你向帖子或页面添加图片时，WordPress 会给你选择将其放在右侧、左侧或文本中心的选项。根据你的选择，WordPress 将分配以下任一类给图片：alignleft、alignright或aligncenter。这些特定的类在 CSS 样式表的对齐部分中处理。另一件事是，当你添加带有标题的图片时，WordPress 会给它分配wp-caption类。这个特定的事情在样式表的标题部分中处理。WordPress 使用许多其他你可以利用的类，当你在构建样式表时。我在第十三章中列出了一些，创建非博客网站第二部分 – 电子商务网站和自定义内容元素。

现在你已经将 HTML 和 CSS 整理好了，你准备好进行下一步了——将你的 HTML 构建转换为 WordPress 主题。

将你的构建转换为主题

你将把你的 HTML 构建转换为主题，它由多个模板文件和其他脚本组成。我们将首先深入了解主题的内部工作原理，以便熟悉它是如何组合在一起的。然后，我们将实际将我们的 HTML 构建转换为 WordPress 可以使用的主题目录。最后，我们将包含 WordPress 函数，以填充主题内容。正如我在前面的章节中提到的，在本地环境中为你的 WordPress 网站进行开发可以使整个过程更加顺畅。考虑在你的家用电脑上使用 WAMP、MAMP 或其他方式来安装 Apache 和 MySQL 以启动服务器。

创建主题目录

将你的 HTML 构建转换为主题的第一步是创建你的主题目录，并给它提供所有使其被 WordPress 识别为主题所需的东西。让我们先概述一下步骤，然后一步一步地进行，如下所示：

1. 命名你的目录并创建构建文件的备份副本

2. 准备必要的文件

3. 添加你的主题截图，命名为screenshot.png

4. 上传你的主题目录

5. 激活你的主题

现在我们一步一步地来做这些。

命名你的目录并创建构建文件的备份副本

你可能希望给你的构建目录一个有意义的名称。我给我的主题命名为Daily Cooking Custom。我将目录命名为daily-cooking-custom。现在，我建议创建 HTML 和 CSS 文件的备份副本。因为你最终会将构建拆分成模板文件，你可能会轻易地失去追踪你的代码来源。通过保留原始构建的副本，你将能够回到它以供参考。

准备必要的文件

WordPress 只有以下两个要求才能识别你的目录为主题：

• 一个名为index.php的文件

• 一个名为style.css的文件

只需将你的主要设计 HTML 文件重命名为index.php——这满足了第一个要求。为了满足第二个要求，你的样式表需要有一个介绍性注释，描述整个主题的基本信息：标题、作者等等。同时，它必须位于样式表的最顶部。我已经在我的style.css文件中添加了这个注释，如下所示：

/*
Theme Name: Daily Cooking Custom
Theme URI: http://nio.tips/
Author: Karol K
Author URI: http://karol.cc/
Description: Daily Cooking Custom is a custom theme created for the buyers of "WordPress Complete"
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: daily-cooking-custom
Tags: brown, orange, tan, white, yellow, two-columns, right-sidebar, flexible-width, custom-header, custom-menu, translation-ready
*/

上述结构是在基于codex.wordpress.org/Theme_Development#Theme_Stylesheet提供的模板的基础上创建的。每次创建新主题时，事先检查当前推荐的模板总是好的。当你将这个注释部分添加到你的样式表中时，只需将所有细节替换为你主题相关的信息。

添加屏幕截图

记得你第一次学习如何激活新主题时，你的外观选项卡中有主题的缩略图版本？你需要你自己的设计的缩略图。它应该是一个名为screenshot.png的 PNG 文件。只需按照以下步骤操作：

1. 使用 Photoshop 或类似工具将你的设计扁平化

2. 将图片宽度更改为 1200 像素，高度更改为 900 像素

3. 以 PNG-8 文件格式保存它用于网页

上述要求（1200 像素 x 900 像素）是撰写时的当前要求。要获取任何时间点的最新指南，请重新访问官方 Codexcodex.wordpress.org/Theme_Development#Screenshot。

创建屏幕截图

将你的文件命名为screenshot.png并保存在你的构建目录中。这就是启用屏幕截图并允许 WordPress 在加载你的主题时识别它的全部内容。

上传你的目录

使用 FTP 软件，将你的模板目录上传到 WordPress 构建中的wp-content/themes/。它将与twentynineteen和其他你在安装 WordPress 时添加的主题共享主题目录。在下面的屏幕截图中，你可以看到我的daily-cooking-custom主题位于themes目录中：

激活你的主题

现在你已经有了绝对的基本需求，所以你可以激活你的主题（尽管，它现在看起来可能并不多）。登录到你的 wp-admin，然后导航到外观。在那里，你会看到你的主题正在等待你。正如你所看到的，我为我的主题创建了一个漂亮的截图，上面有主题的名称，以便更容易识别：

到目前为止，你可以激活你的新主题并继续工作，以包含 WordPress 生成的内容，并将其变成一个完整的 WordPress 主题。不过，激活后主题可能看起来并不完美，这并不奇怪。还有一些工作要做。这也是拥有开发服务器的另一个好理由。你不想在后台完成最终部分的同时，让这个不完整的主题在实时网站上激活。

注意，并非每个主题安装都会如预期进行。有时，你可能需要处理错误。在大多数情况下，WordPress 会通过通知告诉你出了什么问题。然而，偶尔激活可能会导致严重错误，整个网站可能会变空白。如果发生这种情况，只需将新主题的目录重命名，或者完全删除它。这将迫使 WordPress 切换到默认主题，一切应该会恢复正常。从那时起，你可以开始寻找最初导致崩溃的问题。

说到最终部分，你的主题现在准备好添加所有 WordPress 内容了，所以让我们就这样做吧！

如何创建基本的 WordPress 内容

目前，你的 index.php 文件是唯一的主题文件。我们稍后会将其拆分为模板文件。首先，我们需要包含 WordPress 函数，这些函数会将你的内容输出到你的主题中。

functions.php 文件

简而言之，functions.php 文件旨在设置你的主题并提供一些辅助函数和设置，以便更容易地使用主题。除了这个之外，函数文件还有许多其他应用，我们在这里不讨论，因为它们超出了本书的范围。本质上，functions.php 是一个允许你执行非常广泛修改的文件。尽管在处理函数文件时应该始终注意一些标准事项，但这并不限制你做任何你希望做的事情。例如，你可以创建一个经典的 PHP 函数，如 my_function_name()，然后通过 <?php my_function_name(); ?> 在你的模板文件（如 index.php）中调用它，但这只是可能的情况之一。

虽然这不是必需的，但始终以以下代码行开始你的函数文件是一个很好的参考点：

<?php
/**
* Daily Cooking Custom functions and definitions.
*
* @package Daily Cooking Custom
*/

上述代码行提供了关于主题的基本信息。

下一个部分是设置主题将要启用的默认功能，如下所示：

if(!function_exists('daily_cooking_custom_setup')) :
function daily_cooking_custom_setup() {

  //Make theme available for translation.
  //Translations can be filed in the /languages/ folder.
  load_theme_textdomain('daily-cooking-custom',   
  get_template_directory().'/languages');

  //Adds RSS feed links to <head> for posts and comments.
  add_theme_support('automatic-feed-links');

  //Let WordPress manage the document title.
  add_theme_support('title-tag');

  //This theme uses wp_nav_menu() in one location.
  register_nav_menus(array(
    'primary' => __('Primary Menu', 'daily-cooking-custom'),
  ));

  //Switch default core markup for search form, comment form, 
  //and comments to output valid HTML5.
  add_theme_support('html5', array(
    'search-form', 'comment-form', 'comment-list', 'gallery', 'caption',
  ));

  //Set up the WordPress core custom background feature.
  add_theme_support('custom-background', apply_filters(
    'daily_cooking_custom_custom_background_args', array(
    'default-color' => 'ffffff',
    'default-image' => '',
  )));

}
endif; //daily_cooking_custom_setup
add_action('after_setup_theme', 'daily_cooking_custom_setup');

上述函数daily_cooking_custom_setup()将在正确的时间执行，由在最后调用的after_setup_theme动作触发，以正确设置我们主题的基本功能。由于有注释，大部分代码都很直观，但我想单独提到一点，那就是以下内容（注册菜单）：

register_nav_menus(array(
  'primary' => __('Primary Menu', 'daily-cooking-custom'),
));

这是一小段代码，将允许我们在稍后将其作为主菜单显示。它也是我们将用来设置新主题的方法。此外，前面的函数还允许您注册更多的菜单区域，如果您愿意的话——您只需添加'secondary' => 'Secondary Menu'即可。

接下来，让我们启用我们的样式表 CSS 文件，使其与主题一起加载，或者更准确地说，是在精确的时刻加载。以下是实现方法：

function daily_cooking_custom_scripts() {
  wp_enqueue_style('daily-cooking-custom-style', get_stylesheet_uri());
}
add_action('wp_enqueue_scripts', 'daily_cooking_custom_scripts');

如您所见，这里只有一个样式表。它是由函数中的第一行启用的。

上述代码关闭了我们的第一个类似模板的functions.php文件。稍后，我们将向其中添加新行以使其功能更强大。现在，有趣的部分是函数文件中没有关闭的 PHP 标签（没有?>）。这不是一个错误；这是故意的。由于文件的大部分是纯 PHP 代码，我们不需要这个标签。完整的文件如下：

<?php
/**
 * Daily Cooking Custom functions and definitions
 *
 * @package Daily Cooking Custom
 */

if(!function_exists('daily_cooking_custom_setup')) :
function daily_cooking_custom_setup() {

  //Make theme available for translation.
  //Translations can be filed in the /languages/ folder.
  load_theme_textdomain('daily-cooking-custom', 
  get_template_directory().'/languages');

  //Adds RSS feed links to <head> for posts and comments.
  add_theme_support('automatic-feed-links');

  //Let WordPress manage the document title.
  add_theme_support('title-tag');

  //This theme uses wp_nav_menu() in one location.
  register_nav_menus(array(
    'primary' => __('Primary Menu', 'daily-cooking-custom'),
  ));

  //Switch default core markup for search form, comment form,
  //and comments to output valid HTML5.
  add_theme_support('html5', array(
    'search-form', 'comment-form', 'comment-list', 'gallery', 'caption',
  ));

  //Set up the WordPress core custom background feature.
  add_theme_support('custom-background', apply_filters(
    'daily_cooking_custom_custom_background_args', array(
    'default-color' => 'ffffff',
    'default-image' => '',
  )));

}
endif; //daily_cooking_custom_setup
add_action('after_setup_theme', 'daily_cooking_custom_setup');

function daily_cooking_custom_scripts() {
  wp_enqueue_style('daily-cooking-custom-style', get_stylesheet_uri());
}
add_action('wp_enqueue_scripts', 'daily_cooking_custom_scripts');

<head>标签

好的，让我们继续到index.php文件，以及我们可以在其中执行的事情。在本章的下一节中，我们将修改原始 HTML 结构中的特定代码行。让我们看看如何做到这一点：

1. 设置 HTML 文件的<head></head>部分。让我们从charset和device-width参数开始。以下是紧随<head>标签开启后的两行：

      <meta charset="<?php bloginfo('charset'); ?>">
      <meta name="viewport" content="width=device-width, initial-scale=1">

第一个定义了您的博客使用的字符集。另一个定义了使用的viewport宽度。在这里，它被设置为正在使用的设备的宽度（这允许每个人都能正确查看网站，包括桌面电脑用户、iPad 用户和安卓手机用户）。

1. 您需要添加另一段重要的代码块——首先，将标题标签放入您的主题中以便于 pingback URL；其次，其他一些 WordPress 相关内容。请在您的<head>部分添加以下行：

      <link rel="profile" href="http://gmpg.org/xfn/11">
      <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>">

1. 在关闭</head>标签之前添加以下行（它负责显示您的网站标题并启用许多 WordPress 特定的功能）：

      <?php wp_head(); ?>

1. 现在，将body_class()函数添加到 body 标签中，使其看起来如下：

      <body <?php body_class() ?>>

1. 您的标题现在看起来如下：

      <!DOCTYPE html>
      <html <?php language_attributes(); ?>>
      <head>
      <meta charset="<?php bloginfo('charset'); ?>">
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <link rel="profile" href="http://gmpg.org/xfn/11">
      <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>">
      <?php wp_head(); ?>
      </head>

      <body <?php body_class(); ?>>

标题和页脚

是时候开始添加一些内容了。在这里，我们将处理诸如显示博客主页链接、显示博客标题、显示标语和显示主要导航等事项。所有这些操作都非常简单，所以让我们看看处理它们的代码行。然后，我们将把这些代码行放在我们的 HTML 结构中的正确位置。

首先，我们有显示网站主要 URL 的代码，如下所示：

<?php echo esc_url(home_url('/')); ?>

接下来，显示网站标题的代码如下：

<?php bloginfo('name'); ?>

下面的代码用于显示标语：

<?php bloginfo('description'); ?>

前两行从你在 wp-admin 中设置的博客名称和描述处提取信息，你可以简单地从设置 | 通用页面更改它们。

最后，使用以下代码显示主要导航：

<?php wp_nav_menu(array('theme_location' => 'primary')); ?>

wp_nav_menu() 函数是显示导航菜单的内置方式。它负责菜单及其所有元素的适当 HTML 结构。换句话说，你不必担心其他任何事情，只需使用这一行代码即可。

现在，你的 HTML 中描述标题的部分看起来类似于以下列表。此外，正如你所见，我们正在将标志链接到主页，这是一个标准做法：

<div id="page" class="hfeed site">
  <a class="skip-link screen-reader-text" href="#content">
  <?php _e( 'Skip to content', 'daily-cooking-custom' ); ?></a>

  <header id="masthead" class="site-header" role="banner">

    <div class="site-branding">
      <h1 class="site-title"><a href="<?php echo 
        esc_url(home_url('/')); ?>" 
        rel="home"><?php bloginfo('name');?></a></h1>
      <h2 class="site-description"><?php bloginfo('description');?>
      </h2>
    </div><! -  .site-branding  - >

    <nav id="site-navigation" class="main-navigation" 
      role="navigation">
      <button class="menu-toggle" aria-controls="menu" 
        aria-expanded="false">
      <?php _e( 'Primary Menu', 'daily-cooking-custom' ); ?></button>
      <?php wp_nav_menu(array('theme_location' => 'primary')); ?>
    </nav><! -  #site-navigation  - >

  </header><! -  #masthead  - >

<div id="content" class="site-content">

你在想知道为什么你应该费心做这些，而不是直接输入你的博客标题、URL 和主题描述？一个原因是，如果你以后想更改你的博客标题，你可以在 wp-admin 中简单地进行一步操作，它将在整个网站上更改。另一个原因是，如果你想与他人分享你的主题，你需要给他们提供通过他们自己的 wp-admin 面板轻松更改名称的能力。记住，任何（任何）基于网站目的和内容而变化的（任何）内容都不应硬编码到主题中，而应该是动态生成的。

现在，当我刷新网站时，标题中显示了实际的博客标题，如下面的截图所示：

标题中可见的两个链接是从我的自定义菜单中的一个活动链接。为了使事情完整，我将在我的页脚中添加一些代码来显示“自豪地由 WordPress 提供动力”的消息，并包含 wp_footer() 函数/钩子，许多插件以某种方式使用它，因此每个主题都应该包含它。我的页脚部分的代码现在看起来如下：

  </div><! -  #content  - >

  <footer id="colophon" class="site-footer" role="contentinfo">
    <div class="site-info">
      <a href="<?php echo esc_url( __( 'http://wordpress.org/', 
       'daily-cooking-custom' ) ); ?>">
      <?php printf( __( 'Proudly powered by %s', 'daily-cooking-custom' ),   
        'WordPress' );?></a>
      <span class="sep"> | </span>
      <?php printf( __( 'Theme: %1$s by %2$s.', 'daily-cooking-custom' ),
       'Daily Cooking Custom', '<a href="http://karol.cc/" rel="designer">
       Karol K.</a>, and 
       <a href="http://underscores.me/" rel="designer">_S</a>' ); ?>
    </div><! -  .site-info  - >
  </footer><! -  #colophon  - >

</div><! -  #page  - >

<?php wp_footer(); ?>

</body>
</html>

你可能已经注意到了上一个列表中的神秘 __() 函数。这是一个 WordPress 的本地函数，用于检索与函数中给出的参数相对应的翻译字符串。这是一个旨在为你的网站实现国际化的功能。有关该函数的更多详细信息，请参阅codex.wordpress.org/Function_Reference/_2。

侧边栏

现在，我们可以继续添加 WordPress 生成的侧边栏内容。本质上，这部分工作相当简单。我们只需要包含一些 WordPress 函数，这些函数将处理显示各种动态内容。在这种情况下，是分类、标签和存档。

从顶部开始，在侧边栏区域包含以下代码：

<div id="secondary" class="widget-area" role="complementary">
  <?php if(is_active_sidebar('sidebar-1')) dynamic_sidebar('sidebar-1' ); ?>
</div><! -  #secondary  - >

这段代码负责显示分配给该特定小工具区域的任何小工具。在 HTML 结构的侧边栏中放置小工具是最简单、最实用的方法之一。此外，WordPress 将负责正确显示所有内容，因此你不必担心网站上出现任何奇怪的外观元素。例如，每个菜单都显示为一个<ul>列表，每个菜单元素都在<li>内部。这尽可能地符合标准。

主要列 – 循环

这是我们的 WordPress 代码中最重要的一部分。它被称为循环，并且是您新主题的一个基本部分。循环的职责是按倒序显示您的帖子，仅选择适当的帖子。您需要将所有其他帖子标签放在循环内。围绕帖子信息的基本循环文本使用以下代码显示：

<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
  <?php get_template_part('content', get_post_format()); ?>
<?php endwhile; else: ?>
  <?php get_template_part('content', 'none'); ?>
<?php endif; ?>

正中间的get_template_part()函数调用获取另一个包含循环其余部分的文件；但就现在而言，让我们只关注这里的主体部分。

循环有两个基本部分，如下所示：

• 单个帖子信息

• 如果没有合适的帖子怎么办

第一部分由一个标准的 PHP while循环处理，该循环遍历每个帖子，并对每个元素调用适当的content-[TYPE].php文件。第二部分类似，因为它在无法显示帖子时调用content-none.php文件。这些content-[TYPE].php文件的使用是目前处理 WordPress 显示的不同类型内容的标准。它比使用单个if或switch语句更有效、更清晰。

因此，为了开始这个，让我们创建一个基本的content.php文件，它将作为默认内容类型的占位符。在这个文件中，让我们放置以下代码，它处理循环：

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

<header class="entry-header">
  <?php the_title(sprintf('<h1 class="entry-title">
  <a href="%s" rel="bookmark">', esc_url(get_permalink())), '</a></h1>');
  ?>

  <?php if('post' == get_post_type()) : ?>
  <div class="entry-meta">
    <?php daily_cooking_custom_posted_on(); ?>
  </div>
  <?php endif; ?>
</header>

<div class="entry-content">
  <?php
  the_content(sprintf(__('Continue reading %s <span class="meta-nav">&rarr; 
  </span>', 'daily-cooking-custom'), the_title('<span class="screen-reader-
  text">"', '"</span>', false)));

  wp_link_pages(array('before' => '<div class="page-links">' . __('Pages:',  
  'daily-cooking-custom'), 'after'  => '</div>'));
  ?>
</div>

<footer class="entry-footer">
  <?php daily_cooking_custom_entry_footer(); ?>
</footer>

</article><! -  #post-##  - >

如果您仔细观察，会发现它与本章前面分享的静态 HTML 版本非常相似。唯一的区别是，它不是占位文本，而是调用特定的 WordPress 函数和我们将很快讨论的自定义函数。

让我们从顶部开始；文件从这两行开始：

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
  <header class="entry-header">

这只是一些标准的 HTML 和基本的 WordPress 函数调用，用于显示适当的元素 ID 和 CSS 类。例如，the_ID()函数显示帖子的 ID。接下来，我们有以下一行：

<?php the_title(sprintf('<h1 class="entry-title"><a href="%s" rel="bookmark">', esc_url(get_permalink())), '</a></h1>'); ?>

这将显示当前内容元素（通常是帖子）的链接和标题，而不是使用占位文本。the_title()函数接受三个参数（都是可选的）。在这里，我们只使用了两个。第一个定义了放置在标题之前的文本（在这种情况下，我们正在调用sprintf()函数），第二个定义了放置在标题之后的文本。以下是一段显示当前内容元素各种元信息的代码：

<?php if('post' == get_post_type()) : ?>
<div class="entry-meta">
  <?php daily_cooking_custom_posted_on(); ?>
</div>
<?php endif; ?>

如果我们处理的是标准帖子，则会调用一个自定义函数来显示详细信息。通过额外的函数来处理事情——与直接放置代码相比，这种方式使一切更加清晰。以下是函数的样式（我们可以将其放置在主functions.php文件中，或者在一个名为inc的单独子目录中的新文件中，表示它包含额外的函数；在我们的情况下，这个函数定义可以在inc\template-tags.php中找到）：

function daily_cooking_custom_posted_on() {
  $time_string = '<time class="entry-date published updated" 
  datetime="%1$s">%2$s</time>';
  if ( get_the_time( 'U' ) !== get_the_modified_time( 'U' ) ) {
    $time_string = '<time class="entry-date published" 
    datetime="%1$s">%2$s</time><time class="updated" 
    datetime="%3$s">%4$s</time>';
  }

  $time_string = sprintf( $time_string,
    esc_attr( get_the_date( 'c' ) ),
    esc_html( get_the_date() ),
    esc_attr( get_the_modified_date( 'c' ) ),
    esc_html( get_the_modified_date() )
  );

  $posted_on = sprintf(
    _x( 'Posted on %s', 'post date', 'daily-cooking-custom' ),
    '<a href="' . esc_url( get_permalink() ) . '" rel="bookmark">'
    . $time_string . '</a>'
  );

  $byline = sprintf(
    _x( 'by %s', 'post author', 'daily-cooking-custom' ),
    '<span class="author vcard"><a class="url fn n" href="' .
    esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) )
    ) . '">' . esc_html( get_the_author() ) . '</a></span>'
  );

  echo '<span class="posted-on">' . $posted_on . '</span><span
  class="byline"> ' . $byline . '</span>';
}

如你所见，这是一个相当长的函数，但需要记住的是，它只是用来显示帖子发布的日期和作者的署名。此外，这里还使用了语言函数（_e()和_x()）从数据库中获取翻译数据。你可以在codex.wordpress.org/Function_Reference/_e和codex.wordpress.org/Function_Reference/_x了解更多关于这些函数的信息。

回到我们的content.php文件，我们有以下内容：

<div class="entry-content">
  <?php
  the_content(sprintf(
    __('Continue reading %s <span class="meta-nav">&rarr;</span>', 
     'daily-cooking-custom'),
    the_title('<span class="screen-reader-text">"', '"</span>', false)
  ));

  wp_link_pages(array(
    'before' => '<div class="page-links">' . __('Pages:', 'daily-
    cooking-custom'),
    'after'  => '</div>',
  ));
  ?>
</div>

第一部分（the_content()）负责显示当前帖子的内容，以及一个“继续阅读”链接。这实际上是整个文件中最重要的部分。接下来，第二部分（wp_link_pages()）旨在显示分页帖子的页面链接（WordPress 允许你将内容分成单独的子页面；当处理过长的文本时，这可能很有用）。最后，我们有条目页脚部分的代码，如下所示：

<footer class="entry-footer">
  <?php daily_cooking_custom_entry_footer(); ?>
</footer>

在这里，还有一个对自定义函数的调用。以下是函数的样式：

function daily_cooking_custom_entry_footer() {
  // Hide category and tag text for pages.
  if ( 'post' == get_post_type() ) {
    $categories_list = get_the_category_list( __( ', ', 
     'daily-cooking-custom' ) );
    if ( $categories_list && daily_cooking_custom_categorized_blog() ) {
      printf( '<span class="cat-links">' . __( 'Posted in %1$s', 
       'daily-cooking-custom' ) . '</span>', $categories_list );
    }

    $tags_list = get_the_tag_list( '', __( ', ', 'daily-cooking-custom' 
      ) );
    if ( $tags_list ) {
      printf( '<span class="tags-links">' . __( 'Tagged %1$s', 
        'daily-cooking-custom' ) . '</span>', $tags_list );
    }
  }

  if ( ! is_single() && ! post_password_required() && 
  (comments_open() || get_comments_number() ) ) {
    echo '<span class="comments-link">';
    comments_popup_link(__('Leave a comment', 'daily-cooking-custom'),
     __('1 Comment', 'daily-cooking-custom'), __('% Comments', 
    'daily-cooking-custom'));
    echo '</span>';
  }

  edit_post_link( __( 'Edit', 'daily-cooking-custom' ), 
  '<span class="edit-link">', '</span>' );
}

所有这些代码处理帖子细节，如分类、标签和评论链接（其他访客可以点击以提交对帖子的意见）。我想在这里指出一个有趣的事情，即对comments_popup_link()函数的调用，如下所示：

comments_popup_link(__('Leave a comment', 'daily-cooking-custom'), __('1 Comment', 'daily-cooking-custom'), __('% Comments', 'daily-cooking-custom'));

在这里，你可以看到有三个参数通过逗号分隔传递：

• 第一个选项告诉 WordPress 在没有任何评论时需要显示的文本。

• 第二个选项告诉 WordPress 在只有一个评论时显示的文本。

• 第三个选项告诉 WordPress 在有多于一个评论时需要显示的文本。百分号（%）将被实际存在的评论数量替换。

这就是关于循环的基本理解。当然，它的结构允许你做更多的事情，并包含许多自定义功能。然而，现在我们对我们所拥有的内容感到满意。一旦你保存了你的index.php并重新加载你的网站，你将看到你的新主题正在发挥作用。

这个版本的index.php文件可以在本章的代码包中找到，位于一个名为phase 2的子目录中。在我们的主题文件最终版本出来之前，它们将经历几个阶段。

在本章的后面部分，我将向你展示如何创建自定义页面模板，它将利用循环并用于稍微不同的目的。

在你的主题中创建模板文件

现在，你已经拥有了一个功能性的、基本的模板。它在主博客页面上运行得很好，并且能够成功加载你网站上可以点击的任何内容。然而，我们希望为网站上其他类型的内容使用略有不同的模板。例如，单个帖子页面需要有一个评论表单，访客可以在其中发表评论；页面不需要显示日期、分类或标签；分类页面应该显示分类名称。

在我们能够创建其他模板之前，我们需要将主index.php文件拆分成几个部分，这样不同的模板就可以共享公共元素。我已经多次提到头部、侧边栏和页脚的重要性。现在，我们将它们拆分。首先，让我们快速看一下它是如何工作的。

理解 WordPress 主题结构

通常，WordPress 主题由多个模板文件组成。这使得网站的各个部分（如前端、博客存档、页面、单个帖子以及搜索结果）具有不同的目的。将index.php文件拆分成模板文件不仅允许我们共享设计的一些公共部分，而且还可以在不同部分使用不同的代码。正如我之前提到的，我们很快将拆分设计的四个主要部分（头部、侧边栏、主要内容栏和页脚），以便 WordPress 能够充分利用它们。虽然头部和页脚可能被所有页面共享，但主要内容栏的内容将是不同的。此外，你可能希望在某些页面上有侧边栏，而在其他页面上没有。我们首先创建这些模板文件，然后继续创建其他更可选的模板文件。

拆分它

我们将通过将一些代码移除到三个新的文件中来拆分index.php文件，如下所示：

• header.php

• footer.php

• sidebar.php

header.php 文件

首先，我们将创建一个头部文件。你可以按照以下步骤进行：

1. 从index.php文件的整个顶部开始剪切。这意味着剪切doctype声明、<head>标签、任何杂项打开标签以及<header>标签。在我的情况下，我是从这一行开始剪切的：

      <!DOCTYPE html>

1. 我将跳过并包括以下这些行：

      </header><! -  #masthead  - >
      <div id="content" class="site-content">

1. 将所有这些行粘贴到一个名为header.php的新文件中，该文件位于你的主题目录内。

2. 现在，在index.php文件的顶部（即你刚刚剪切页眉文本的地方），输入以下 WordPress PHP 代码行：

      <?php get_header(); ?>

1. 这是一个包含你刚刚创建的header.php文件的 WordPress 函数。

如果你现在保存所有内容并重新加载你的网站，不应该有任何变化。这里的重要部分是确保对前面的 PHP 函数的调用正好位于你的index.php文件的顶部。

footer.php文件

接下来，我们将创建页脚文件。你可以按照以下步骤进行：

1. 从以下代码中剪切index.php文件底部的所有内容：

      </div><! -  #content  - >
      <footer id="colophon" class="site-footer" role="contentinfo">

1. 剪切到</html>标签。将你刚刚剪切的文本粘贴到一个新的footer.php文件中。将其保存在你的主题目录中。

2. 现在，在index.php文件的底部（即你刚刚剪切页脚文本的地方），输入以下 WordPress PHP 代码行：

      <?php get_footer(); ?>

1. 这是一个特殊的 WordPress 函数，用于包含你刚刚创建的footer.php文件。再次提醒，你应该保存所有内容并重新加载你的网站，以确保没有发生变化。

sidebar.php文件

现在还需要创建一个关键的模板文件。对于这个文件，执行以下步骤：

1. 剪切包含你的侧边栏的整个div元素。在我的例子中，是以下这一行：

      <div id="secondary" class="widget-area" role="complementary">
        <?php if(is_active_sidebar('sidebar-1')) dynamic_sidebar('sidebar-1' ); ?>
      </div>

1. 将此行粘贴到你的主题目录中的一个新文件中，并将其保存为sidebar.php。

2. 现在，在index.php中，将此函数调用替换你刚刚剪切的行，如下所示：

      <?php get_sidebar(); ?>

这将包含侧边栏。

您的四个模板文件

你现在在你的主题目录中有四个模板文件，分别是header.php、footer.php、sidebar.php以及现在变得短得多的index.php。顺便说一句，我的index.php文件现在只有少数几个 WordPress 函数和主循环。以下代码显示了整个文件：

<?php get_header(); ?>

  <div id="primary" class="content-area">
    <main id="main" class="site-main" role="main">

    <?php if (have_posts()) : ?>

      <?php /* Start the Loop */ ?>
      <?php while (have_posts()) : the_post(); ?>

        <?php
        get_template_part('content', get_post_format());
        ?>

      <?php endwhile; ?>

      <?php daily_cooking_custom_paging_nav(); ?>

    <?php else : ?>

      <?php get_template_part('content', 'none'); ?>

    <?php endif; ?>

    </main><! -  #main  - >
  </div><! -  #primary  - >

<?php get_sidebar(); ?>
<?php get_footer(); ?>

创建这四个文件的全部剪切和粘贴过程只是为了为制作替代模板文件的实际目标做铺垫。

本章节的代码包中提供了这个版本的index.php文件，以及header.php、footer.php和sidebar.php，它们位于一个名为phase 3的子目录中。

归档模板

WordPress 现在正在使用index.php模板文件来显示你网站中的所有类型的网页。让我们创建一个新文件——一个在查看月度存档、分类存档和标签存档时将使用的文件。

想了解更多关于 WordPress 如何利用不同文件来显示内容的信息，请自由阅读www.codeinwp.com/blog/wordpress-theme-heirarchy/上的指南。

要创建你的存档模板，复制 index.php 并将其重命名为 archive.php。现在，通过点击侧边栏中的任意月份，导航到网站上查看你的月度存档。此时，你将看到的页面应该与主列表完全相同——由 index.php 处理的那个。

让我们对存档模板进行一个修改。我想让它显示一个消息，让用户知道他们正在哪个类型的存档页面上。目前，存档看起来与主索引列表相同，这不是最优化的情况。为了解决这个问题，只需在 <?php if (have_posts()) : ?> 行中添加以下代码：

<header class="page-header">
  <?php
  the_archive_title('<h1 class="page-title">', '</h1>');
  the_archive_description('<div class="taxonomy-description">', '</div>');
  ?>
</header>

如果我现在去看我的月度存档——或者分类/标签存档——我会在页面顶部看到一个新标题，它会告诉我我在哪里，如下面的截图所示：

这个版本的 archive.php 文件可以在本章的代码包中找到，位于名为 phase 4 的子目录内。

单个模板

我们接下来需要创建的模板是单篇文章视图。目前，单篇文章看起来就像网站的首页（因为它使用了 index.php）——除了它只填充了一个文章的内容。

要开始，再复制一次 index.php，并将其命名为 single.php。这是 WordPress 在服务单个文章时将查找的模板。如果找不到 single.php，它将使用 index.php。

不再拖延，这是我的 single.php 文件。你应该注意到这个文件几乎与 index.php 具有完全相同的元素。唯一的区别是 get_template_part() 函数调用获取了一个不同的元素。在这种情况下，它是 single，如下面的代码所示：

<?php get_header(); ?>

  <div id="primary" class="content-area">
    <main id="main" class="site-main" role="main">

    <?php while (have_posts()) : the_post(); ?>

      <?php get_template_part('content', 'single'); ?>

      <?php daily_cooking_custom_post_nav(); ?>

      <?php
      if (comments_open() || get_comments_number())
        comments_template();
      ?>

    <?php endwhile; // end of the loop. ?>

    </main><! -  #main  - >
  </div><! -  #primary  - >

<?php get_sidebar(); ?>
<?php get_footer(); ?>

之前提到的 get_template_part('content', 'single') 调用将获取 content-single.php 文件。下面是这个文件的样子：

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
  <header class="entry-header">
    <?php the_title('<h1 class="entry-title">', '</h1>'); ?>

    <div class="entry-meta">
      <?php daily_cooking_custom_posted_on(); ?>
    </div>
  </header>

  <div class="entry-content">
    <?php the_content(); ?>
    <?php
      wp_link_pages( array(
        'before' => '<div class="page-links">' . __( 'Pages:',
        'daily-cooking-custom' ),
        'after'  => '</div>',
      ) );
    ?>
  </div>

  <footer class="entry-footer">
    <?php daily_cooking_custom_entry_footer(); ?>
  </footer>
</article><! -  #post-##  - >

这个文件的结构与我们在几页前讨论的那个——content.php——几乎完全相同。以下有三件具体的事情值得指出：

• <article> 标签的存在。单个文章的内容显示在这个标签内。

• 对 the_content() 函数的调用。这次，我们显示的是文章的全部内容，而不仅仅是摘录。

• 在 single.php 中的 comments_template() 函数调用。这显示了评论表单和为这篇文章提交的个别评论。

这些版本的 single.php 文件和 content-single.php 文件可以在本章的代码包中找到，位于名为 phase 4 的子目录内。

页面模板

我们将要创建的最后一个模板是为静态页面视图设计的。在我的食品博客网站上，这将是示例页面，例如。这次最简单的方法是从single.php文件开始。所以，只需复制该文件并将其重命名为page.php。现在，我们将简化文件，以便只显示给定页面的基本信息。最终，我的page.php文件将如下所示：

<?php get_header(); ?>

  <div id="primary" class="content-area">
  <main id="main" class="site-main" role="main">

    <?php while (have_posts()) : the_post(); ?>

      <?php get_template_part('content', 'page'); ?>

    <?php endwhile; // end of the loop. ?>

  </main><! -  #main  - >
  </div><! -  #primary  - >

<?php get_sidebar(); ?>
<?php get_footer(); ?>

我在这里只做了一些小的修改。具体如下：

• 我将get_template_part()函数的最后一个参数从single改为了page。

• 我删除了调用daily_cooking_custom_post_nav()的代码，该代码负责显示文章导航。

• 我删除了处理评论的整个代码块。我们不需要在页面上使用这些。

接下来，我们需要一个自定义的content-page.php文件。最简单的方法是复制content-single.php文件并稍作调整。以下是最终的content-page.php文件：

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
  <header class="entry-header">
    <?php the_title('<h1 class="entry-title">', '</h1>'); ?>
  </header>

  <div class="entry-content">
    <?php the_content(); ?>
    <?php
      wp_link_pages(array(
        'before' => '<div class="page-links">' . __( 'Pages:',
        'daily-cooking-custom' ),
        'after'  => '</div>',
      ));
    ?>
  </div>

  <footer class="entry-footer">
  </footer>
</article><! -  #post-##  - >

在简化文件方面，我做了以下操作：

• 我删除了整个显示元数据的代码。

• 我删除了显示分类和标签的入口页脚。我们不需要在 WordPress 页面中使用这些。

现在，我的示例页面看起来更加简洁，如下面的截图所示：

这些版本的page.php文件和content-page.php文件可以在本章的代码包中找到，位于名为phase 4的子目录中。

生成的 body 和 post 类

当你修改主题以适应不同类型的页面时，你也应该了解 WordPress 将放入你主题中的 CSS 类。如果你仔细查看我们一直在使用的代码，你会看到这两个函数：

• body_class(): 例如，在header.php文件中，具体的行是<body <?php body_class(); ?>>

• post_class(): 例如，在content-page.php文件中，具体的行是<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>。

body_class()函数会根据你查看的页面添加一大堆类到 body 标签上。例如，我网站的主页在 body 中具有以下类：

<body class=" home blog custom-background">

我的“一些西班牙菜肴”单篇文章页面的主体标签如下所示：

<body class=" single single-post postid-41 single-format-standard custom-background">

如果我想对我的任何页面进行不同的样式设计，我可以主要通过 CSS 来实现，而不需要创建另一个模板。

post_class()函数会对单个文章的div元素做类似处理，根据文章本身的特性赋予不同的类。例如，我关于“一些西班牙菜肴”的文章标签具有以下类：

<article id="post-41" class="post-41 post type-post status-publish
format-standard hentry category-uncategorized">

此外，我的示例页面文章标签具有以下类：

<article id="post-2" class="post-2 page type-page status-publish hentry">

在我的样式表中使用这些类，我可以根据文章的分类、标签、文章类型等不同来分别设置每个文章的样式。在设计主题时请记住这一点。当进一步使用主题框架工作时，这一点变得极其重要。尽管允许在 PHP 文件中进行修改，但大多数时候，您只需在 CSS 中工作并调整各种类（WordPress 中的原生类以及框架使用的新类）就可以自定义整个站点的样式。完全在 CSS 文件中构建一个基于主题框架的新网站的情况并不少见。

其他 WordPress 模板

除了archive.php、single.php和page.php之外，WordPress 在特定视图使用index.php之前还会查找许多其他标准模板文件。我们在这里不会创建这些文件，但您可以在自己的 WordPress 安装上自由实验。要了解 WordPress 主题的完整文件层次结构，请自由访问www.codeinwp.com/blog/wordpress-theme-heirarchy/。那里有一个很好的图表，可以直观地展示层次结构。它非常容易理解，比只用文字在这里解释要好得多。此外，当您浏览本章的官方代码包时，您会看到已经创建了并实际上在包内可用的许多其他文件。我们在这里也介绍了它们，因为现在可能信息过多。

学习更多

您还可以在developer.wordpress.org/themes/basics/template-hierarchy/找到模板层级的详细流程图。

在本章中，我们尝试了相当多的 WordPress 模板标签的使用。在第十三章“创建非博客网站第二部分 – 电子商务网站和自定义内容元素”中，我列出了更多最有用的模板标签。

接下来，我们将探讨为页面创建自定义模板。

创建和使用自定义页面模板

WordPress 允许您创建自定义模板。这些模板只能用于页面（不能用于文章）。自定义模板允许您以不同的方式显示内容，并能够轻松地在模板中使用内置的 WordPress 函数。

为了给您一个自定义页面模板是什么以及它们如何使您的网站受益（无论您使用什么主题）的好例子，让我们创建一个存档模板的自定义版本。这也就是我们将用来创建一个比标准版本更有用的自定义存档页面的方法。以下截图显示了目前我的博客上的存档页面看起来是什么样子：

侧边栏中只有几个小链接，用于将访客重定向到标准月度存档。当然，当你的网站上发布更多帖子时，将显示更多链接（每个月份一个链接）。

就存档的想法而言，我必须承认，多少有些不情愿地承认，WordPress 从未擅长于此。作为网络发布解决方案，该平台的一个问题就是帖子通常寿命很短。无论何时发布帖子，它都会在前页上停留一段时间，然后消失在存档中，无论它是否仍然相关，都再也不会被看到。最终，对于新访客来说，在网站上找到这些旧帖子非常困难。

在恢复那些旧帖子为数不多的机会中，掌握 SEO 艺术，仅通过 SEO 努力将一些新流量引导到你的旧帖子（这是最受欢迎的解决方案）。但幸运的是，这并非唯一的方法。再次强调，自定义页面模板在这里也是一种有趣的补救措施。

在前面的屏幕截图中，你可以看到默认的存档版本只是一个侧边栏小部件，包含指向个别月份的一些链接。这种内容组织的问题在于，它提供了一个相当糟糕的用户体验。一般来说，存档并不是关于在一个地方列出所有内容；它们是关于提供一个中心，访客可以前往并找到特定的内容。例如，想想你当地图书馆的存档是如何工作的。这就是你最终希望在网站上实现的目标。因此，我们在这里要做的就是说“不”使用 WordPress 的传统存档模板，并创建一个自定义页面模板来手动处理存档。然后，我们将从菜单中的一个链接到这个存档。以下是操作步骤。

在我们新的存档页面上，我们希望实现以下目标：

• 显示自定义文本：例如，作为一种介绍或通知消息，解释存档中包含的内容。

• 显示分类存档：这是网站上所有使用分类的列表。

• 显示标签云：这是一种标签存档形式，其中网站上使用的所有标签依次显示（内联，而不是列表格式），并且使用频率较高的标签的字体大小会增大。

• 显示 15 篇最新帖子的列表，或者你希望显示的其他数量。

• 显示月度存档块：它位于底部并非偶然，因为这个块对于普通访客来说并不特别有用。

要做到这一点，我们需要创建一个模板。以下展示了我们将采取的步骤：

1. 创建模板文件。复制 page.php 并给它一个新的名字。我喜欢在我的所有自定义模板文件前加上 tmpl_，这样它们就可以与我将要创建的所有 WordPress 模板文件分开排序。我将这个文件命名为 tmpl_archives.php。为了让 WordPress 能够识别这个文件为模板文件，我们需要在页面顶部添加一个特殊样式的注释（就像我们在 style.css 中做的那样）。注释需要按照以下格式进行格式化：

      <?php
      /* Template Name: Blog Archives Custom */
      ?>

在 wp-admin 面板中，模板将通过这个模板名称来识别，所以请确保名称能够向你传达模板的用途。

1. 添加 WordPress 函数。这是过程中的一个关键部分，但幸运的是，在这个阶段并不复杂。查看你的新模板文件，找到以下行的出现：

      <?php get_template_part('content', 'page'); ?>

1. 现在，将其擦除，并替换以下代码：

      <?php get_template_part('content', 'tmpl_archives'); ?>

这是我们想要的结果；你的 tmpl_archives.php 文件中间部分现在应该看起来像以下这样：

      <?php while (have_posts()) : the_post(); ?>
      <?php get_template_part( 'content', 'tmpl_archives' ); ?>
      <?php endwhile; // end of the loop. ?>

1. 接下来，创建一个全新的文件，命名为 content-tmpl_archives.php，并添加以下代码：

      <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
        <header class="entry-header">
          <?php the_title('<h1 class="entry-title">', '</h1>'); ?>
        </header>

        <div class="entry-content">
          <?php the_content(); ?>

          <div style="float: left; width: 50%;">
            <h2>Categories</h2>
            <ul>
            <?php wp_list_categories('orderby=name&title_li='); ?>
            </ul>
          </div>
          <div style="float: left; width: 50%;">
            <h2>Tags</h2>
            <?php wp_tag_cloud('smallest=8&largest=20'); ?>
          </div>
          <div style="clear: both;"></div><! -  clears float  - >

          <?php
          $how_many_last_posts = 15;
          echo '<h2>Last '.$how_many_last_posts.' Posts</h2>';
          $my_query = new WP_Query('post_type=post&nopaging=1');
          if($my_query->have_posts()) {
            echo '<ul>';
            $counter = 1;
            while($my_query->have_posts() && 
              $counter<=$how_many_last_posts) 
            {
              $my_query->the_post();?>
              <li><a href="<?php the_permalink() ?>"
                rel="bookmark" title="Permanent Link to <?php
                the_title_attribute(); ?>"><?php the_title();
                ?></a></li>
              <?php
              $counter++;
            }
            echo '</ul>';
            wp_reset_postdata();
          }
          ?>

          <h2>By Month</h2>
            <p><?php wp_get_archives('type=monthly&
              format=custom&after= |'); 
            ?></p>
        </div>

        <footer class="entry-footer">
        </footer>
      </article><! -  #post-##  - >

代码为我们的新存档模板包含了一些额外的功能。实际上，因为我们正在创建一个自定义模板，所以我们可以添加我们在本章中发现的任何 WordPress 函数，以及任何存在的其他 WordPress 函数（参见第十三章，创建非博客网站第二部分 – 电子商务网站和自定义内容元素）。

下面是代码中一些更有趣的部分，从以下内容开始：

<div style="float: left; width: 50%;">
  <h2>Categories</h2>
  <ul>
  <?php wp_list_categories('orderby=name'); ?>
  </ul>
</div>

这涉及到在网站上添加一个完整的分类列表。div 元素负责在左侧显示这个区块，并允许下一个区块（标签）紧挨着它放置（这比使用 HTML 表格更有效，因为它是一个更跨设备友好的方法）。

代码的下一部分如下：

<div style="float: left; width: 50%;">
  <h2>Tags</h2>
  <?php wp_tag_cloud('smallest=8&largest=20'); ?>
</div>
<div style="clear: both;"></div><! -  clears float  - >

它具有非常相似的目的，只是这次我们显示的是前面提到的标签云。这里最后一个可见的 div 元素是用来清除前面 div 元素中使用的 float 参数的。

接下来，我们有负责显示最新帖子的部分，如下所示：

<?php
$how_many_last_posts = 15;
echo '<h2>Last '.$how_many_last_posts.' Posts</h2>'; 
$my_query = new WP_Query('post_type=post&nopaging=1');
if($my_query->have_posts()) {
  echo '<ul>';
  $counter = 1;
  while($my_query->have_posts() && $counter<=$how_many_last_posts) {
    $my_query->the_post();
    ?>
    <li><a href="<?php the_permalink() ?>" rel="bookmark"
      title="Permanent Link to <?php the_title_attribute();
      ?>"><?php the_title(); ?></a></li>
    <?php
    $counter++;
  }
  echo '</ul>';
  wp_reset_postdata();
}
?>

目前，代码显示的是最新的 15 篇帖子，但如果你只是更改 $how_many_last_posts 变量的值，这可以进行调整。

最后，有一个显示传统月度存档的区块，其中每个月都表示为一个标准链接，如下所示：

<h2>By Month</h2>
<p><?php wp_get_archives('type=monthly&format=custom&after=
  |'); ?></p>

到目前为止，你可以保存文件并继续下一步，即将模板应用于一个页面。

离开你的 HTML 编辑器，登录到你的wp-admin。你需要创建一个页面，你想要在这个页面中使用这个模板。在我的例子中，我会把我的新页面命名为“存档”，以便清楚地表明其目的。在处理页面时，切换到文档选项卡，并滚动到页面属性部分。这就是你将找到模板设置的地方，如下面的截图所示：

将它从默认模板更改为博客存档自定义模板，并保存草稿或立即发布。现在，为了在某个地方看到这个页面，你必须将它添加到其中一个菜单中。我们已经在第四章中介绍了菜单，页面、媒体和导入/导出内容，所以我相信你可以快速完成。一旦你处理好了这个问题，你就可以回到你网站的首页，点击存档页面。然而，因为你的网站在这个阶段内容并不丰富，所以你不会得到惊人的效果，但仍然会有一个很好的最新帖子展示，如下面的截图所示：

你可以为你的 WordPress 主题制作任意数量的自定义模板。

这些tmpl_archives.php文件和content-tmpl_archives.php文件的版本可以在本章的代码包中找到，位于名为phase 5的子目录中。

使你的主题小部件友好

如果你想在主题中使用小部件，你需要让你的主题变得小部件友好（也称为小部件化你的主题）。小部件化实际上非常简单，而且说实话，我们在构建侧边栏时已经处理了这一点。现在让我们回到这个话题，解释一下小部件化是如何工作的。

回到我们的侧边栏

在过去，WordPress 网站在侧边栏中使用静态放置的内容块是非常常见的。换句话说，在我们网站的侧边栏中放置动态内容的唯一方法就是使用手工编写的代码，它会获取我们想要的数据，然后显示它。这个解决方案对于可能不熟悉 PHP 源代码的日常用户来说并不实用。需要找到一个更好的解决方案。因此，小部件应运而生。

小部件让我们能够以某种方式设置侧边栏，以便它们获取在“外观 | 小部件”中设置的数据。因此，用户唯一需要做的就是前往“外观 | 小部件”，选择他们想要在侧边栏（或任何其他小部件区域；这也可以在页脚中）中展示的内容。

为了给你一个新旧对比的例子，以下是一个标准代码片段的示例，它以旧的方式处理显示博客存档（这个可以放在sidebar.php中）：

<div id="secondary" class="widget-area" role="complementary">
  <aside>
    <h1>Archives</h1>
    <ul>
      <?php wp_get_archives(); ?>
    </ul>
  </aside>
</div><! -  #secondary  - >

然而，这段代码在任何方面都是不可定制的，所以一个更好的显示存档的解决方案是使用我们已经在sidebar.php中拥有的代码，如下所示：

<div id="secondary" class="widget-area" role="complementary">
  <?php if(is_active_sidebar('sidebar-1')) dynamic_sidebar( 
    'sidebar-1' ); ?>
</div><! -  #secondary  - >

然后，只需在wp-admin的“外观”|“小工具”部分将一个新的存档小工具分配给这个侧边栏。

与functions.php文件一起工作

让我们来看看这一切是如何实际工作的。正如我之前说的，functions.php文件可以包含许多不同的元素，所以现在是时候关注如何启用动态侧边栏，也就是小工具。在functions.php文件中，我们可以放置以下代码：

function daily_cooking_custom_widgets_init() {
  register_sidebar(array(
    'name'          => __('Sidebar', 'daily-cooking-custom'),
    'id'            => 'sidebar-1',
    'description'   => '',
    'before_widget' => '<aside id="%1$s" class="widget %2$s">',
    'after_widget'  => '</aside>',
    'before_title'  => '<h1 class="widget-title">',
    'after_title'   => '</h1>',
  ));
}
add_action('widgets_init', 'daily_cooking_custom_widgets_init');

在此代码中，我使用了一个新函数来注册一个新的小工具区域。正如你所见，小工具区域简单地被称为Sidebar（name参数）。

现在，最后的add_action('widgets_init', 'daily_cooking_custom_widgets_init')

函数调用实际上是注册小工具区域（这是这里最重要的代码行；它让 WordPress 知道何时启用小工具区域）。

添加一些小工具

到目前为止，你的主题已经准备好小工具了！你现在可以前往wp-admin，导航到“外观”|“小工具”，并添加小工具。例如，如以下截图所示，我已经向一个小工具区域添加了四个小工具：

一定要点击保存，然后返回你的网站并重新加载页面。你放在侧边栏中的默认项目将被小工具替换，如下面的截图所示：

其他小工具化选项

我们刚刚介绍的是将主题小工具化的最简单方法。实际上，还有很多其他可能性，你可以在将代码添加到sidebar.php和functions.php文件时利用它们。例如，有一些选项允许你执行以下操作：

• 小工具化多个侧边栏，并为每个命名

• 小工具化侧边栏的一部分，但保留一些默认项目

• 小工具化页脚

• 自定义搜索表单小工具，等等

学习更多

要了解可用的各种选项以及如何利用它们，请查看 Codex 中的以下资源：codex.wordpress.org/Widgetizing_Themes。

在你的主题中启用菜单

我现在要告诉你的好消息是，菜单已经在我们创建的主题结构中启用。因为我们使用了wp_nav_menu()函数在网站头部（在header.php文件中），如果用户在“外观”|“菜单”中创建了一个菜单，并将其分配给标记为“主菜单”的区域，它将显示在网站上，如下面的截图所示：

如果你想在你的主题中拥有多个导航菜单，你可以注册多个导航菜单位置，让用户创建多个菜单，并选择哪个菜单放在哪个位置。要了解更多信息，请查看codex.wordpress.org/Navigation_Menus的 Codex。

学习更多

wp_nav_menu()函数非常强大，可以接受多个参数，这些参数将允许你控制类和 ID、菜单名称等。请看这里：developer.wordpress.org/reference/functions/wp_nav_menu/。

在 WordPress 自定义化器中使你的主题可编辑

WordPress 自定义化器是 WordPress 生态系统中的相对较新的功能。简而言之，它是一个框架，旨在实时预览用户对其网站所做的任何更改。自定义化器的界面允许修改主题和网站外观的各个方面，从网站的名称、标语，到使用的颜色、布局、小工具、菜单等等。我们曾在第八章中从用户的角度讨论了自定义化器，自定义你的网站外观/设计。

现在，从开发者的角度来看，当你构建你的 WordPress 主题时，有一些事情你应该做，以便使其与自定义化器兼容。幸运的是，我们在本章中作为主题基础的起始主题，即 _S 主题，已经包含了一些基本的自定义化器集成。让我们逐一了解它们，同时看看我们如何进一步扩展主题的功能。

首先，让我们看看以下代码行。它应该放在你的functions.php文件末尾：

require get_template_directory() . '/inc/customizer.php';

这个定义简单地包括了一个额外的文件，该文件负责自定义化器的集成本身。尽管我们可以在functions.php文件中做到一切正确，但将自定义化器处理在单独的文件中可以使主题结构更容易理解。

那个新的customizer.php文件是我们将要添加所有新代码的地方。自定义化器集成的核心是通过customize_register钩子完成的。它允许我们定义新的自定义化器面板、部分（自定义化器内部导航的主要元素）、设置（我们的主题可以接受的数据）和控制（允许我们调整设置的视觉 UI 元素）。

为了注册我们所有的自定义化器新元素，我们可以使用以下函数：

function daily_cooking_custom_customize_register( $wp_customize )
 { /* */ }
add_action( 'customize_register', 'daily_cooking_custom_customize_register' );

在这个函数内部，我们创建新的部分、设置和控制。然而，正如你所注意到的，我们已经在customizer.php文件中创建了此函数。这又是我们在 _S 起始主题之上构建主题的结果。我们选择这种方法，因为它允许我们比从头开始构建更快地开始主题开发。

我们当前的daily_cooking_custom_customize_register()函数已经包含了以下行：

$wp_customize->get_setting( 'blogname' )->transport = 'postMessage';
$wp_customize->get_setting( 'blogdescription' )->transport = 'postMessage';

这段代码利用了 WordPress 主题默认可用的某些自定义化器能力。具体来说，这两个功能使我们能够修改标题和博客描述。

现在是时候向自定义设置添加一些新内容了。首先，添加一个新的部分非常简单。让我们首先在我们的主 daily_cooking_custom_customize_register() 函数中包含以下函数调用：

$wp_customize->add_section();

函数可以接受两个参数——第一个是您新部分的标识符，另一个是附加选项的数组。以下是我们将要做什么：

$wp_customize->add_section( 'menu_bar_colors' , array(
  'title' => 'Menu Bar Colors', 
  'priority' => 30) );

这创建了一个新的部分，标题为 菜单栏颜色，标识为 menu_bar_colors。现在，让我们添加一个新的设置。设置提供了一种与 WordPress 通信的方式，并让它知道我们正在使用用户可以修改的值。可以通过 $wp_customize->add_setting() 函数调用添加新设置。我们可以这样处理（正如你所见，我添加的不是一个新的，而是两个新的 设置）：

$wp_customize->add_setting( 'menu_bar_color1' , array(
  'default' => '#69CACA') );
$wp_customize->add_setting( 'menu_bar_color2' , array(
  'default' => '#279090') );

一旦设置到位，拼图的最后部分是一些新的控件。控件将两者联系起来；它们让 WordPress 知道哪些部分与哪些设置一起工作。这是通过 $wp_customize->add_control() 函数调用完成的，如下所示：

$wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'menu_bar_color1', array(
  'label' => 'Menu Bar Color 1', 
  'section' => 'menu_bar_colors', 
  'settings' => 'menu_bar_color1') ) );
$wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'menu_bar_color2', array(
  'label' => 'Menu Bar Color 2', 
  'section' => 'menu_bar_colors', 
  'settings' => 'menu_bar_color2') ) );

如你所见，我们的每个设置都得到了自己的 控件。在这个阶段，当你保存文件并从 WordPress 控制面板（外观 | 自定义）转到自定义设置时，你会在侧边栏中看到新的部分。在里面，你也会看到所有元素都是可操作的。尽管，它们对主题的外观影响不大。我们将在下一部分处理这个问题。请看以下截图：

我们现在需要做的第一件事是根据用户在自定义设置中设置的值来修改主题的 CSS。为了实现这一点，让我们在 customizer.php 文件的末尾添加以下代码：

function daily_cooking_customizer_menu_css()
{
  ?>
  <style type="text/css">
  .site-header .site-branding { background: <?php echo  
    get_theme_mod('menu_bar_color1', '#69CACA'); ?>; }
  .main-navigation ul li { border-bottom: 1px solid <?php echo 
    get_theme_mod('menu_bar_color1', '#69CACA'); ?>; }
  .site-header { background: <?php echo 
    get_theme_mod('menu_bar_color2', 
    '#279090'); ?>; }
  </style>
  <?php
}
add_action( 'wp_head', 'daily_cooking_customizer_menu_css');

这个新功能连接到 wp_head 并修改网站的 CSS。其中最重要的指令是那三个内联 PHP echo 块。以下是一个例子：

echo get_theme_mod('menu_bar_color1', '#69CACA');

get_theme_mod() 函数允许你获取当前主题的设置，并在第一个参数（第二个是默认值）中指定你需要的特定设置的名称。当你现在保存文件时，新的颜色选择选项应该完全启用。参考以下截图：

在这里，我们只是触及了自定义设置中可能性的表面，但它仍然给了你一个很好的概述，并且也证明了自定义设置实际上是一个非常适合开发者工作的环境。始终尝试尽可能多地将您主题的设置放入自定义设置模块；最终用户会为此感谢你！

如果你想了解更多关于如何使用自定义设置以及发现其其他功能（例如，例如，使用 JS 文件进行动态实时预览），那么不要犹豫，访问以下资源之一：

codex.wordpress.org/Theme_Customization_API 和 developer.wordpress.org/themes/customize-api/.

创建子主题

如果你已经找到了一个你喜欢的现有主题或主题框架，并且只想对其进行一些调整以完美地满足你的需求，你可以在其基础上创建一个子主题。子主题以父主题为起点，不改变主题本身，只更改你想要更改的部分。

实际上，使用子主题是修改任何主题的推荐方式。基本原则很简单——如果你想要更改任何关于库存主题（无论是源代码、图形还是模板文件）的内容，请通过一个新的子主题进行更改。

用简单的话来说，子主题继承了父主题的功能和特性。创建子主题的最大价值在于，你可以引入你想要的任何功能，而不会改变父主题的结构。我知道这听起来像是一些额外的工作，因为如果你只想更改几行代码，那么直接在主题内进行更改总是更快。然而，采取更长的子主题路径有其好处，例如以下这些：

• 主要好处是，如果你直接修改原始主题，所有修改都会在更新主题的瞬间消失。然而，如果你使用子主题，你可以充分利用原始主题作者发布的任何更新。让我再次强调：除非你使用子主题，否则在执行主题更新后保留你的修改是不可能的。

• 你可以清楚地看到你对主题所做的修改。基本上，通过子主题实施的所有新内容都必须放置在一个新文件中，所以即使你在一段时间后回来审查你的子主题，你仍然可以轻松地识别出你的每一项工作。

• 最后的益处——实际上，可能还有很多——就是通过子主题引入的任何修改都非常容易恢复。简而言之，如果有什么严重的问题导致你必须快速修复你的网站，那么你可以简单地删除负责的文件。如果你直接修改原始主题，逐个文件进行修改无疑会花费更多时间，并且会使任何快速恢复变得非常困难。

让我们快速了解一下如何创建一个子主题。

创建新的主题目录

为了使事情更容易理解，我们将以本章中创建的主题为基础，为其构建一个子主题。起点非常简单。在 wp-content/themes/ 中创建一个新的目录，并将其命名为 daily-cooking-child。

创建样式表

在这个目录中，你需要从样式表（style.css）开始。样式表需要通常的标题，以及以下新行：

/*
Theme Name: Daily Cooking Child Theme
Description: Child theme for the Daily Cooking Custom theme.
Theme URI: http://nio.tips/
Author: Karol K
Author URI: http://karol.cc/
Template: daily-cooking-custom
*/

上述代码中的关键行是Template: daily-cooking-custom。这告诉 WordPress，你的新主题是daily-cooking-custom的子主题。只是为了强调，这一行确实非常重要。然后，为了使你的子主题从父主题的 CSS 开始，在注释之后添加以下代码：

@import url("../daily-cooking-custom/style.css");

如果你不用上一行，你的子主题将从一个空样式表开始其存在。在大多数情况下，这不是一个理想的情况。

使用你的子主题

就这样！你的新主题现在出现在外观页面，如下面的截图所示：

当然，这个主题在这个阶段可能并不是非常有用，但它确实存在，你可以将其用作进一步修改的基础。默认情况下，它将使用主主题的所有样式、模板文件、函数以及所有其他内容。如果你激活它，它将使你的网站看起来就像你正在使用主主题一样。

如果你想要更改任何内容，请在你的子主题目录中进行更改。如果你创建一个新的模板文件（例如，single.php、index.php和archive.php），你将覆盖主主题的原始模板文件。然而，functions.php文件的工作方式略有不同。如果你创建一个新的functions.php文件，它将在主主题的原始functions.php文件之前执行。实际上，你的新文件将在原始文件之前加载。如果你想要覆盖原始functions.php文件中的特定函数，只需创建一个具有相同名称的函数。你还可以创建在父主题中不存在的完全新的函数。

就像我说的一样，你在子主题内部创建的每个其他模板文件（例如，page.php和single.php）都将覆盖其同名文件，所以这是包含一个新设计或一些新功能的完美方法。除了替换现有的模板文件外，你还可以添加父主题中不存在的新的模板文件（包括自定义页面模板）。

最后，一旦你花点时间尝试不同的事情，检查你的网站对你包含在子主题中的元素的反应，整个子主题的话题其实非常容易掌握。

学习更多

WordPress Codex 有一个页面专门介绍子主题，请参阅codex.wordpress.org/Child_Themes。

分享你的主题

如果你想要将你的模板变成其他人可以使用的产品，你只需要采取以下步骤：

1. 确保你有权重新分发你包含在主题中的图像、图标、照片等等。

2. 从你的主题目录中删除所有不必要的文件。确保你没有备份版本或任何文件的旧副本。如果你删除了任何文件，请务必测试你的主题以确保你没有意外删除重要的内容。

3. 确保在style.css文件顶部的注释完整且准确。

4. 创建一个Readme.txt文件。这是一个很好的地方，让未来的用户知道你的主题与哪个版本的 WordPress 兼容，以及它是否有任何特殊功能或要求。

5. 将目录压缩并发布你的主题 ZIP 文件到你的网站上供人们下载，或者直接提交到 WordPress 主题目录wordpress.org/themes/。但请记住，那里的审查过程可能需要一段时间。所以，在你看到你的主题上线之前，要做好 3-6 个月的等待准备。

尽管前面的步骤看起来像是一个标准的逐步过程，但实际上并非如此。说实话，如果你的主题想要被允许进入目录，它必须是非常高质量的。每个主题都会经过人工审查，这通常会导致一些主题未能通过。在这种情况下，你只需要按照要求进行修改，重新提交你的作品，并继续尝试，直到你成功进入。

然后，还有关于许可的问题。默认情况下，WordPress 遵循GNU 通用公共许可证（GPL）。简单来说，这意味着 WordPress（平台）是免费的，并且在其之上构建的任何衍生作品都必须在 GPL 下注册——这包括主题。简而言之，你可以在 WordPress、各种主题或插件中找到的每一行 PHP 代码都是 GPL（这包括付费主题和插件）。当涉及到艺术作品和 CSS 时，GPL 可能不适用。如果你想了解更多关于 GPL 许可的信息，最好的办法是直接访问官方文档wordpress.org/news/2009/07/themes-are-gpl-too/。

现在，除了官方目录外，你还可以通过其他渠道分享你的主题。首先，你必须决定你是否想让你的主题免费提供。如果是这样的话，你可以联系一些关于 WordPress 和 WordPress 设计的流行博客，并简单地告诉他们你有一个想要分享的主题。大多数时候（如果主题看起来吸引人），他们不会有问题通知他们的社区，有一个酷炫的新免费主题。

如果你想让你的主题成为付费主题，你可以前往 ThemeForest（themeforest.net/）并尝试提交你的主题。唯一的挑战是，你的主题必须真的是高质量的。

我不会强迫你立即与社区分享你的主题，但一旦你积累了一些专业知识，并且构建出真正酷炫和有用的主题，你真的应该与人沟通并分享你的作品。最后，如果你对在社区中产生影响感兴趣，考虑启动一个专门针对此目的的网站。这个网站将成为你可以发布演示版本、提供一些文档、提供支持论坛以及其他事项以提供优质用户体验的地方。

所有主题文件（包括子主题）的最终版本都包含在本章的代码包中，位于名为final的子目录内。

摘要

你现在已经跨越到了 WordPress 主题世界的另一边——你已经学会了如何制作自己的主题。只需基本的 HTML 和 CSS 代码，你就可以创建一个设计并将其转变为一个完全功能的 WordPress 主题。

在本章中，我们探讨了如何将你的 HTML 构建转换为基本主题，创建 WordPress 模板以影响你网站上各种视图的显示，创建应用于你网站内页面的自定义模板，使你的新主题具备小工具兼容性，创建子主题，使主题与 WordPress 自定义设置兼容，以及与 WordPress 社区中的每个人分享你的主题。

在下一章中，我们将讨论社交媒体集成、播客和 HTTPS（安全超文本传输协议）。这些信息将使你能够扩展你的博客习惯，让你的作品在网络上更加多样化并且更加引人注目。

第十章：社交媒体整合、播客和 HTTPS

在过去的几年里，社交媒体的重要性有了很大的增长。基本上，如果你至少没有在几个最受欢迎的社交网络上建立你的个人资料，那么你几乎可以认为你根本不存在，对吧？好吧，无论你是否同意这一点，这对你网站来说确实是真的。换句话说，如果你希望吸引任何类型的观众，并设法让他们继续回到你的网站，你绝对必须（必须！）将其与社交媒体整合。

幸运的是，WordPress 允许你以相对容易理解的方式做到这一点。尽管社交媒体整合本身并不是一个内置功能，但它仍然可以通过不同的插件或其他机制来实现。在本章中，你将了解所有这些功能。我们将涵盖如何在你的网站上启用简单的社交媒体分享按钮，如何与社交媒体 API 和整合工作，以及如何自动将你的博客内容发布到社交媒体。

但是等等，这还不是全部！我们还将涵盖播客（对于一些网站所有者来说，这是他们在线存在的重要元素），以及 WordPress 领域的一个相对较新的话题——HTTPS（安全超文本传输协议），它主要是通过在浏览器-网站通信中增加一个额外的加密层来使你的网站更加安全。在这里值得指出的一点是，现在谷歌期望所有网站都启用 HTTPS 加密。如果你的网站未能遵守这一规定，谷歌可能会决定降低你的搜索引擎排名，从而使你的网站相对于竞争对手来说更不显眼。

简而言之，本章我们将探讨以下主题：

• 整合社交媒体

• 播客

• HTTPS——是什么，为什么，以及如何？

整合社交媒体

我们在第五章中简要提到了社交媒体整合的话题，即“插件——它们是什么以及为什么你需要它们”，当时我们讨论了值得在你的 WordPress 网站上拥有的插件。现在，让我们花点时间来扩展这一点，并列出更多你可以使你的网站变得社交媒体友好以及你为什么要这样做的原因。

让我们从“为什么”开始。在这个时代，社交媒体是许多网站流量增长的主要驱动力之一。即使你只想与朋友和家人分享你的内容，或者你有关于你网站的严肃商业计划，你也至少需要有一定程度的社交媒体整合。

即使你只安装了简单的社交媒体分享按钮，你实际上是在鼓励你的访客将你的内容传递给他们的追随者，从而扩大你的影响力，使你的内容更加流行。

使你的博客变得社交媒体友好

有几种方法可以使你的网站变得社交媒体友好。最常见的方法如下：

• 设置社交媒体分享按钮，允许您的访客将您的内容分享给他们的朋友和关注者

• 设置社交媒体 API 集成，使您的内容在社交媒体上（从设计角度）看起来更好

• 设置自动内容分发到社交媒体

• 设置社交媒体指标跟踪

让我们逐一讨论这些。

设置社交媒体分享按钮

这是我们讨论插件时在第五章，插件 – 它们是什么以及为什么您需要它们中提到的事情。现在市面上有数百种社交媒体插件可供选择，允许您在网站上显示一组基本的社交媒体按钮。我们建议您使用的插件名为简单社交媒体分享按钮（这个插件可在wordpress.org/plugins/simple-social-buttons/找到）。它的主要优势是允许您显示所有最受欢迎的社交媒体网络的按钮，您还可以选择您希望这些按钮显示的位置和方式。

您可以在第五章，插件 – 它们是什么以及为什么您需要它们中找到完整的描述，以及如何设置一切的教程。

设置社交媒体 API 集成

要使您的内容在社交媒体上看起来更有吸引力，下一步值得采取的是将其与多个社交媒体 API 集成；特别是 Twitter 的 API。Twitter 的 API 究竟是什么以及它是如何工作的，对我们在这里讨论的 WordPress 并不非常相关。所以，让我们只关注将您的网站与这个 API 集成的结果。

以下截图展示了提及网站的常规推文通常的样子（请注意整体设计，而不是文本内容本身）：

这里是一条不同的推文，提到了一个启用了 Twitter（Twitter Cards）API 的网站的文章：

这看起来好多了。幸运的是，拥有这种级别的 Twitter 集成相当简单。您需要的只是一个名为 JM Twitter Cards 的插件（这个插件可在wordpress.org/plugins/jm-twitter-cards/找到）。安装并激活它后，您将指导完成设置一切并批准您的网站与 Twitter（这是一个强制步骤）的过程。

设置自动内容分发到社交媒体

自动在社交媒体上分发您的内容背后的想法是，您不必每次发布新帖子时都手动记住这样做。您不必手动复制粘贴新帖子的 URL 地址到每个社交媒体平台，而是可以自动完成。

这可以通过多种方式完成，但让我们讨论两种最实用的方式：Jetpack 和 Revive Old Posts 插件。

Jetpack 插件

Jetpack 插件可在 wordpress.org/plugins/jetpack/ 获取。我们在第五章 Plugins – What They Are and Why You Need Them 中讨论了 Jetpack 插件及其许多模块。您可以通过导航到 wp-admin 中的 Jetpack | 设置部分，然后转到共享标签来找到这些模块之一：

在这里，您将能够启用名为“自动将您的帖子分享到社交网络”的功能（这在先前的截图中可见）。

在完成上述操作后，点击出现的新的链接，标签为“连接您的社交媒体账户”。这将允许您与可用的社交媒体平台集成，如下面的截图所示：

在通过每个服务授权插件后，您的网站将能够自动将每篇新帖子发布到社交媒体。

Revive Old Posts 插件

Revive Old Posts 插件可在 wordpress.org/plugins/tweet-old-post/ 获取。虽然 Jetpack 插件会将您网站上的最新帖子分发到您的各种社交媒体账户，但 Revive Old Posts 插件会以相同的方式处理您的存档帖子，最终赋予它们新的生命——因此得名，Revive Old Posts。

在下载并激活此插件后，转到 wp-admin 中的 Revive Old Posts 部分。然后，切换到账户标签。在这里，您可以通过添加您的社交媒体账户并授权它们来启用插件。插件将引导您完成启用所有功能的步骤。这些单独的步骤取决于您想要启用的社交媒体平台，并且随着时间的推移会频繁更改，但您始终可以依赖 Revive Old Posts 与最新的要求保持一致：

接下来，转到常规设置标签，处理您希望插件如何与您的社交媒体账户一起工作的间隔时间和其他细节，如下面的截图所示。完成设置后，只需点击保存按钮即可：

到此为止，该插件将自动运行并将随机存档帖子分发到您的社交媒体账户。

注意，如果你不想激怒你的追随者并让他们取消关注你，最好不要过于频繁地分享东西。出于这个原因，我建议每天不要发帖超过一次。

设置社交媒体指标跟踪

我们社交媒体整合谜题的最后一个要素是设置某种跟踪机制，它会告诉我们我们的内容在社交媒体上的受欢迎程度（以分享次数来衡量）。

当然，你可以通过访问每篇帖子并单独检查它们的分享次数来手动完成这项工作。然而，有一个更快的方法，它涉及到另一个插件。这个插件叫做 Social Metrics Tracker，你可以在wordpress.org/plugins/social-metrics-tracker/下载它。

简而言之，这个插件从多个平台收集社交媒体分享数据，并以一个可读的仪表板视图显示给你。安装并激活插件后，你需要给它几分钟时间爬取你的社交媒体账户并获取数据。在那之后不久，你将能够通过访问wp-admin中的社交媒体指标部分来访问插件的仪表板：

对于某些网络主机和配置，这个插件可能会消耗服务器资源过多。如果发生这种情况，考虑只在偶尔检查结果时激活它，然后再将其停用。即使每周只这样做一次，也能很好地了解你的内容在社交媒体上的表现。

这就结束了我们关于如何将你的 WordPress 网站与社交媒体整合的简要指南。我必须承认，我们只是触及了表面，还有更多的事情可以做。几乎每周都有新的社交媒体插件发布，描述每一个都可能填满一本书。话虽如此，这里描述的方法已经足够让你的 WordPress 网站变得适合社交媒体，并能够有效地与你的朋友、家人和观众分享你的内容。

播客

在过去几年中，播客变得非常流行。目前，网络上已有成千上万的播客可供选择，涉及任何可以想象的主题或细分市场。基本上，播客就像一个广播节目或节目，但完全在互联网上运行。然而，在幕后，播客仅仅是一个音频录音。它可以按集数或系列进行，这取决于你的偏好和你想要的方式。播客的主要思想是人们可以订阅它们，每当有新剧集可用时，他们都会收到通知。基本上，你的订阅者，而不是在他们的电脑上阅读你的帖子，可以在任何时间通过耳机收听你的内容。

将播客添加到您的 WordPress 博客中相当简单。从技术角度来看，播客的订阅机制由真正简单的聚合（RSS）源处理。RSS 是一种网络技术，允许您以 XML 格式结构化地交付（或消费）内容。RSS 源通常按最新信息排序。WordPress 默认处理 RSS 源的方式是启用您最新帖子的源，以及最新评论的源。任何想保持您内容更新的人都可以使用流行的源聚合器并连接到您网站的 RSS 源。例如，Feedly (feedly.com)是一个流行的解决方案。

在 WordPress 中处理播客分发也是通过使用 RSS 源来实现的。当生成您博客的 RSS 源时，WordPress 会自动添加所有必要的标签，如果该帖子中链接了音频文件。这些标签会被播客客户端/工具（如 iTunes）读取。因此，您只需要创建一个帖子，WordPress 就会为您处理其余的事情。

创建播客

对于基本的播客制作，您只需要采取以下两个步骤：

• 录制自己

• 制作帖子

让我们详细看看这些步骤。

录制自己

通过使用任何商业或免费软件，您可以录制您的声音、对话、音乐或任何您想播客的内容，然后将其保存为 MP3 文件。您也可能发现您需要稍后进行一些编辑。

考虑使用的一些优秀软件的例子如下：

• 我推荐使用Audacity，这是一个免费、跨平台的音频录制和编辑器。您可以从sourceforge.net/projects/audacity/下载 Audacity。您可能需要做一些额外的调整才能让 MP3 部分工作，所以请注意该点的附加说明。如果您不想学习音频压缩和均衡的基本知识，您也可以使用均衡工具，例如Levelator，您可以在www.conversationsnetwork.org/levelator/找到它。尽管它自 2012 年底以来没有更新，但如果您想简单调整音频文件的音量，它仍然可以很好地工作。

• 或者，您可以使用OBS Studio，您可以在obsproject.com/download找到它。这是另一个跨平台解决方案，它是开源的，一些用户认为它在市场上优于其他工具。

• 如果您正在使用 macOS 并且想要一些免费软件，请看看Garage Band。它随操作系统一起提供，所以它已经安装在了您的电脑上。

• 如果您想检查一些称为数字音频工作站（DAWs）的先进音频软件，这些软件由专业播客制作者和音乐家使用，那么请考虑Sonar X2、Studio One、Logic或ProTools。

要了解更多关于音频录制和制作的基础知识，以及如何让你的播客听起来更专业，请自由查看www.hongkiat.com/blog/audio-production-for-podcasters/的深入教程。

发布帖子

现在你已经创建了一个 MP3 文件，并且它已经存放在你的电脑上，你可以准备创建一个 WordPress 帖子，这个帖子将成为你播客第一集的归宿。请查看以下步骤：

1. 在wp-admin中，像平常一样导航到帖子 | 添加新帖子。如果你想为这一集提供描述，可以在帖子中输入一些初始文本。此外，在此阶段，将一个新的类别“播客”添加到你的博客中。

2. 为了让你了解如何包括媒体文件的基本知识，让我们将你的媒体文件上传到 WordPress 媒体库。在本章的后面部分，我会解释为什么这并不总是最有效的方法。然而，现在我们的目的是学习。首先，在页面上添加一个名为“音频”的新块。然后，从你的桌面选择一个音频文件并上传，如图所示：

1. 上传完成后，你将在帖子本身中看到你的音频文件（记住，音频文件比图像大，所以上传总是需要更长的时间），如图所示：

1. 进行任何其他更改或添加，然后发布帖子。

就这样！现在你的网站 RSS 订阅源可以被播客客户端用来获取你的播客。你可以立即使用自己的播客客户端进行订阅。如果你使用的是 iTunes，请导航到高级 | 订阅播客，并将你刚刚设置的新播客类别的 RSS 订阅源 URL 粘贴进去（例如，http://yoursite.com/category/podcast/feed/）。此时，你（以及你的访客）可以享受你刚刚创建的新播客了。

这就是你可以将播客添加到自己的 iTunes 中的方法。如果你想使播客通过 iTunes 对公众可搜索，你需要通过提交流程，如itunespartner.apple.com/en/podcasts/overview中所述。

播客插件

你刚刚了解到，将播客添加到 WordPress 网站是非常简单的。然而，如果你想添加更多功能，你可能需要使用播客插件。一些额外的功能可能包括以下内容：

• 自动生成订阅源和可配置的 RSS 订阅源，以进一步优化播客客户端，如 iTunes、Google Play 或 Stitcher

• 你播客在 iTunes 中的预览

• 下载统计数据和跟踪你获得的听众数量

• 新的自定义帖子类型，以更专业的方式处理你的播客

• 从同一网站运行多个播客

• 用于显示您的播客剧集列表、单集和播放列表的短代码

• 简单的设置，以便在另一台服务器上托管您的剧集

在 WordPress 插件库中，有相当多的播客相关插件。以下是最受欢迎的三个：

• Blubrry 的 PowerPress 播客插件 (wordpress.org/plugins/powerpress/)

• Seriously Simple Podcasting (wordpress.org/plugins/seriously-simple-podcasting/)

• Podlove Podcast Publisher (wordpress.org/plugins/podlove-podcasting-plugin-for-wordpress/)

要深入了解如何使用 PowerPress 插件（这是前面列表中我最喜欢的一个）以及如何正确配置它，请观看 Pat Flynn 在www.youtube.com/watch?v=Ei67QMWD4MA#!提供的 30 分钟视频教程。在这个教程中，您将学习如何优化您的播客并正确设置它，以便它能够被 iTunes 收录并与社区分享。

有数百个类似的插件可供选择。您可以通过查看 WordPress.org 官方插件目录中所有标记为podcasting的插件（wordpress.org/plugins/tags/podcasting）来找到它们。别忘了阅读插件描述和用户评价，以决定哪一个可能最适合您。

使用免费服务托管音频文件

如我之前提到的，直接将播客上传到博客的旧式方法有其缺陷，这并不使其成为当今处理事务的最有效方式。首先，如果您想在主服务器（即您的网站托管的服务器）上托管媒体文件，您可能会迅速遇到严重的带宽问题，尤其是如果您的播客变得流行。此外，WordPress 中存在最大上传大小的问题。根据您的网络托管商，您可能无法上传大于 2 MB、8 MB 或 16 MB 的文件（您可以联系您的网络托管商的支持以澄清这一点）。这就是上传器中问题的样子：

因此，如果您预计会有大量订阅者，或者您计划生产如此大量的内容以至于您的服务器空间不足，您可以使用外部托管服务来托管您的音频文件，无论是付费还是免费。以下是一些可以考虑的选项：

• Libsyn：这家公司提供有效且价格合理的播客托管服务。请访问www.libsyn.com/。

• Blubrry: 这是一款出色的播客托管平台。他们提供的特别之处在于与 WordPress 的完美集成。他们甚至有自己的插件，我在本章前面提到过。请访问create.blubrry.com/resources/podcast-media-hosting/。

• PodBean：这家公司提供一定期限内的免费播客托管服务。请访问podbean.com/。

与提到的每家公司合作都有所不同。然而，你始终需要做的主要事情是将你的媒体文件上传到所选公司的服务器，而不是上传到 WordPress 的媒体库中。作为回报，你将获得一个直接指向你的播客文件的 URL，你可以根据需要使用它。例如，你可以使用前面提到的插件之一将 URL 插入到 WordPress 帖子中。

HTTPS – 它是什么，为什么，以及如何？

意想不到的是，HTTPS 的故事始于别处——它始于HTTP（超文本传输协议）。HTTP 是一种网络协议，通过它用户网络浏览器与试图访问的网站之间在线发送信息。HTTP 定义了这些数据的结构和发送方式。这个话题非常技术性，我们当然不需要为了本章讨论的目的而完全理解它。

总体来说，目前 HTTP 的实现方式并不允许非常安全的连接。大部分情况下，使用 HTTP，数据以纯文本形式传输，这意味着如果有人拦截通信，他们将能够看到所有传输的内容。现在，这可能在最初看起来不是什么大问题，但想象一下处理敏感信息时会发生什么。例如，当你在在线结账时提交信用卡信息，你真的不希望它被任何人拦截。不幸的是，HTTP 在这方面并没有提供任何保护。这就是 HTTPS 发挥作用的地方。

HTTPS 是什么？

HTTPS，代表超文本传输协议安全，基本上是 HTTP 的升级版。在底层，使其工作的主要机制大致相同；但与使用自己的层协议发送数据不同，HTTPS 使用额外的协议，称为安全套接字层（SSL）和传输层安全性（TLS）。SSL 加密正在发送的信息，这意味着即使有人拦截它，他们也无法解码它。没有加密/解密密钥，数据的真正含义是不可见的。

那么，您如何知道一个网站是否具有 HTTPS？找出这一点非常简单。基本上，您的网络浏览器会告诉您。当您访问一个已启用 HTTPS（并且正确集成）的网站时，您会在网站地址旁边看到一个绿色的锁形图标。此外，您还应该在地址栏中看到https://。以下截图显示了 PayPal 的一个示例：

HTTPS 为何对现代 WordPress 站点很重要

虽然 HTTPS 本身不是必需的，但它仍然是迈向更安全网络的一大步。支持 HTTPS 的每个网站都更加安全，尤其是在处理任何形式的用户输入时。很自然地，人们对于提交他们的个人信息并不高兴，尤其是如果他们不确定这些信息是否会被妥善处理。如今，我们不断听到有关黑客攻击和安全漏洞的消息，甚至在一些最受尊敬的网站上也如此。考虑到这一点，公众每年对数据安全和隐私的关注都在增加。

话虽如此，现代 WordPress 站点需要完全接受这一理念。在您的网站上启用 HTTPS 实际上没有任何缺点，而且实现这个过程也不太困难。此外，2014 年，谷歌宣布 HTTPS 正式成为谷歌搜索的排名因素。这意味着，如果您将 HTTPS 集成到网站中，您有更好的机会让您的网站获得排名，从而被潜在访客发现。

如何设置 HTTPS

在 WordPress 上设置 HTTPS 是一个两步的过程，如下所示：

• 首先，您需要获得分配给您的 SSL 证书，然后您可以在网站上使用它

• 其次，您需要将此 SSL 与您的 WordPress 站点集成

让我们从获取 SSL 证书本身开始。问题是，这些证书通常带有价格标签。一个好的证书可能每年花费您几美元到 600 美元不等。这可能听起来不太吸引人，但幸运的是，对于每个人来说，也有好的免费 SSL 选项。特别是有一个叫做Let's Encrypt (letsencrypt.org/)的选项。Let's Encrypt 是一个免费、自动化和开放的证书颁发机构（CA）。它被发现普及了 SSL 证书，并使它们对所有网站都变得可负担，从而增加了全球拥有加密连接的网站数量。

您如何开始使用 Let's Encrypt 取决于您的 WordPress 网站托管的主机。通常，至少对于大多数主机来说，您可以直接从您的托管控制面板启用 Let's Encrypt 证书。展示如何完成的精确步骤会很困难，因为每个主机都有自己的控制面板，以及他们自己的方式来让您启用 Let's Encrypt 证书。因此，第一步是实际上联系您的托管服务提供商，并请他们帮助您启用证书。

在此之前，您可以查阅 Let's Encrypt 的官方文档，并确保您的托管服务提供商确实支持 Let's Encrypt 证书。这些文档可以在community.letsencrypt.org/t/web-hosting-who-support-lets-encrypt/6920找到。

在您完成主机流程后，这个过程不应该太复杂，您就可以在 WordPress 仪表板中完成集成。为了使您的网站完全集成，您将需要一个额外的插件。这个插件叫做 Really Simple SSL (wordpress.org/plugins/really-simple-ssl/)，它将为您做两件主要事情：

• 它将更新您网站的 URL 为 HTTPS，并覆盖 WordPress 数据库中的先前设置

• 它将在您的非 HTTPS URL 上添加一个永久的 301 重定向，以便所有访问者以及搜索引擎都将被转发到您内容的新 HTTPS 版本（如帖子页面）

插件非常简单易用。您需要做的只是安装并激活它，然后您可以在设置 | SSL 中进入插件的设置。一旦进入，只需点击主页面上的“继续，激活 SSL！”按钮，如下面的截图所示：

插件将在后台施展其魔法，一旦完成，它将使您从管理面板注销。这是正常的，所以您不需要担心。当您尝试重新登录时，您会注意到您已被重定向到 HTTPS 版本的管理面板。为了确保一切正常工作，您可以尝试访问您的网站http://YOURSITE.com，看看是否自动重定向到https://YOURSITE.com。在这个阶段，您的 WordPress 网站已经完全集成了 HTTPS！

摘要

本章有很多内容。首先，我们专注于社交媒体集成——这是所有现代网站的核心。接下来，是播客主题，以及如何开始的简要指南（如何配置您的源，使用哪些插件等等）。最后，我们讨论了 HTTPS 和 SSL 证书——它们是什么，它们对您网站安全（以及您的访客个人信息的保护）的重要性，以及如何启用它们。

在下一章中，我们将讨论开发您自己的插件和小部件的主题，包括基础知识以及如何掌握它们。我们还将向您介绍 RESTful API。

第十一章：开发插件、小工具以及 REST API 简介

插件是添加或扩展 WordPress 内置功能的一种方式。在第五章插件——它们是什么以及为什么你需要它们中，你学习了如何安装它们。来自在线 WordPress 社区的插件有成千上万的有用插件（截至写作时，wordpress.org/plugins/上的官方计数器显示超过 55,000 个插件），它们都执行不同种类的功能。在早期章节中，我们安装了拦截垃圾邮件、备份你的网站以及提供基本 SEO 功能的插件。你还可以获取管理你的播客、跟踪你的统计数据、将你的内容翻译成其他语言的插件等等。

然而，有时你会发现你所需要的插件根本不存在。幸运的是，为 WordPress 编写一个你可以在自己的网站上使用并愿意与更大社区分享的插件相当简单。你所需要的只是一些基本的超文本预处理器（PHP）知识，你就可以编写任何你想要的插件。

本章分为四个主要部分，如下所示：

• 在第一部分，我们将通过一个易于遵循的、分步的过程创建两个插件。

• 在第二部分，我们将使用内置的 WordPress 小工具类创建一个小工具。

• 在第三部分，你将学习什么是短代码以及如何使用它们。

• 在第四部分，我们将讨论 REST API 的主题。

插件

在本节中，我们将通过一个简单的分步过程创建一个插件。我们首先将看到基本要求是什么，然后尝试并测试插件，然后简要讨论涉及的 PHP 代码。话虽如此，在进入本章之前，你应该已经具备基本的 PHP 背景知识。

从零开始构建插件

首先，我们在这里是为了学习 WordPress，所以在这个特定的情况下，我们确实会从头开始构建。这始终是深入了解特定技术工作原理的最佳方法。

然而，一旦你开始定期使用 WordPress，并管理自己的或他人的网站，我建议你在决定自己编写新插件之前，总是先寻找已经存在的插件。如我之前提到的，仅官方目录中就有大约 55,000 个插件，更不用说网上所有可用的付费插件了。简而言之，如果你需要某种功能，很可能已经有一个插件可以满足你的需求，所以你可以直接出去获取它。

为什么这是推荐的方法？如果我是对的，你选择使用 WordPress 是因为你想要尽可能少地付出努力，使你的网站尽可能功能强大。沿着这条思路，使用现有的插件比构建一个插件需要付出更少的努力。此外，许多现有的插件已经被成千上万的其他人使用，并且有庞大的社区支持它们。因此，选择高质量的插件是一条更安全的道路。

我觉得我应该清楚地强调这一点，因为经验告诉我，许多年轻的 WordPress 开发者倾向于强迫他们的同伴从头开始创建东西，尽管有其他更好的解决方案可用。

此外，请记住，所有基于 WordPress 的衍生作品都可在GNU 通用公共许可证（GPL）下获得。因此，没有任何阻止你从现有的插件开始，在此基础上进行改进，使其变得更好，然后将你的版本重新分享给世界的事情。这样，我们都能赢，而且没有重复的工作。

然而，在我们能够做到这一点之前，我们确实必须通过从头到尾构建我们自己的东西来学习这门手艺。那么，继续前进吧！

插件代码要求

正如对主题有要求一样，对插件也有要求。至少，你的插件必须满足以下条件：

• 它必须放在wp-content/plugins目录中（在 WordPress 根目录内）

• 它必须有一个具有独特名称的 PHP 文件（即，一个在主wp-content/plugins目录中未被任何其他插件使用的名称）

• 文件顶部必须有一个特殊结构的注释

  （有关更多信息，请参阅codex.wordpress.org/File_Header）

然后，当然，你必须有一些函数或处理代码；但 WordPress 会识别任何满足这些要求的文件作为插件。

如果你的插件很简单，那么你只需将一个独特的 PHP 文件直接放在你的wp-content/plugins目录中，这样它就可以紧挨着 WordPress 自带默认的 Hello Dolly 插件。然而，一个更好的做法是创建一个子目录（再次，使用一个独特的名称）并将你的 PHP 文件放在那里。这使得wp-content/plugins目录看起来更有组织。此外，你永远不知道你的插件何时会需要一些额外的文件（与从头开始重新结构插件相比，简单地向现有的plugin目录添加新文件总是更容易）。

基本插件 – 添加链接图标

作为演示，我们将创建一个简单的插件，该插件可以向 WordPress 中的文档链接添加图标。例如，如果你创建一篇新文章并在其中添加一个指向 MP3 文件的链接，它看起来就像以下截图所示：

一旦这个插件完成，链接看起来就像以下截图所示：

为了完成这个任务，我们必须做以下几步：

1. 提供将使用的图标的图片

2. 有一个 PHP 函数可以识别文档链接并为它们添加一个特殊的 CSS 类

3. 有一个样式表可以创建用于显示图标的 CSS 类

4. 告诉 WordPress，每次它打印帖子的内容（即使用the_content()函数）时，它必须首先运行 PHP 函数

5. 告诉 WordPress 在<head>标签中包含新的样式

随着我们继续前进，请记住这个清单。一旦所有这五个要求都得到满足，插件就会完成。那么，让我们开始吧！

插件文件的命名和组织

每个插件都应该有一个独特的名称，这样它就不会与 WordPress 宇宙中的任何其他插件冲突。在为你的插件和 PHP 文件选择名称时，请确保选择一个独特的名称。你甚至可能想要在 Google 上搜索你选择的名称，以确保没有人已经在使用它。

除了主要的插件文件本身之外，你的插件可以包含任何数量的其他文件和子目录。如果情况需要，你甚至可以使用媒体文件，如音频和视频，与你的插件一起使用。当然，额外的 CSS 或 JS 文件（甚至完整的库）也是允许的。

在这种情况下，由于我的插件将由多个文件组成（一个 PHP 文件、一个样式表和一些图像文件），我将创建一个目录来存放我的插件。我将把插件命名为“添加文档类型样式新”，并将其放置在名为add_doctype_styles_new的目录中。PHP 文件doctype_styles_new.php将存放在这个目录中。我还收集了一些文档类型图标（由www.freepik.com/通过www.flaticon.com/提供）。

我为插件创建的目录现在看起来如下所示：

如果你构建的内容将包含更多文件，最好在插件目录内创建目录，如images、css和js。

现在我已经把图片放在了我的目录里，我已经处理了插件必须满足的要求清单中的第一个要求。

如果你的插件有任何不寻常的安装或配置选项，你可能还希望在目录中包含一个readme.txt文件来解释这些内容。这个README文件将对你自己来说是一个提醒，同时也是对将来可能使用你的插件的其他人的指导性文件。如果你计划将你的插件提交到 WordPress 插件目录，你将需要创建一个README文件。要获取此类文件的模板，请访问wordpress.org/plugins/developers/。

如前所述，您的插件必须以一个特殊的注释开始，告诉 WordPress 如何在插件页面上向用户描述插件。现在我已经创建了我的目录和一个空的 PHP 文件，我将插入这个特殊的注释。它必须按照以下结构（这确实是基础，并在codex.wordpress.org/File_Header中更详细地解释）：

<?php 
/* 
Plugin Name: Add Document Type Styles New 
Plugin URI: http://nio.tips/
Description: Detects URLs in your posts and pages and displays nice document type icons next to them. Includes support for PDF, DOC, MP3, and ZIP. 
Version: 1.1 
Author: Karol K 
Author URI: http://karol.cc/ 
Text Domain: add_doctype_styles_new 
License: GNU General Public License v2 or later 
*/

在您的插件中包含关于许可的信息也是一个很好的信息。大多数插件使用 GPL。这个许可本质上意味着任何人都可以使用、复制和增强您的代码，并且他们不允许阻止其他人重新分发它。我还在我的插件 PHP 文件中添加了关于 GPL 的注释。请记住，您在任何 WordPress 插件中遇到的 PHP 代码默认都是 GPL。然而，图形文件、CSS、JavaScript 和其他元素可能有不同的许可，所以在复制他人的作品并将其作为您自己的作品的一部分时要小心。您可以在www.gnu.org/copyleft/gpl.html上了解更多关于许可的信息。

这就是关于介绍性代码的所有内容。现在，我们可以添加实质内容了！

编写插件的核心功能

任何插件的精髓都是你带来的独特 PHP 代码。这是使插件成为其自身的部分。由于这个插件非常简单，它中间只有几行代码。

插件必须满足的第二个要求是拥有一个 PHP 函数，用于识别文档链接并为它们添加一个特殊类。以下函数正是这样做的。请注意，为了确保我的代码是独特的，我在两个函数前都加上了doctype_styles_new前缀：

function doctype_styles_new_regex($text) { 
  $text = preg_replace('/href=([\'|"][[:alnum:]|
     [:punct:]]*)\.(pdf|doc|mp3|zip)([\'|"])/', 'href=\\1.\\2\\3 
     class="link \\2"', $text); 
  return $text; 
}

当函数接收到一些$text时，它将搜索任何链接到 PDF、DOC、MP3 或 ZIP 文件的 HTML 锚标签，并将其替换为该锚点的类。然后，函数返回修改后的$text。

插件必须满足的第三个要求是拥有一个创建显示图标类的样式表。以下函数获取我们的样式表：

function doctype_styles_new_styles() { 
  wp_register_style('doctypes_styles', plugins_url
     ('doctype_styles_new.css', __FILE__)); 
  wp_enqueue_style('doctypes_styles'); 
}

如您所见，这个函数使用了我们在第九章开发您自己的主题中注册自定义主题样式表时使用的相同的队列机制。以下是前一个函数获取的 CSS 文件（在doctype_styles_new.css内部）：

.link { 
  background-repeat: no-repeat; 
  background-position: left center;  
  padding: 0 0 0 18px; 
} 
.pdf { background-image: url(icon-pdf.png); } 
.doc { background-image: url(icon-doc.png); } 
.mp3 { background-image: url(icon-mp3.png); } 
.zip { background-image: url(icon-zip.png); }

的确，一个非常简单的文件，只包含一些样式和图标，用于区分我们的文档链接！

向插件添加钩子

我们通过使用 WordPress 钩子来确保代码在应该运行时实际运行。插件钩子的工作方式如下：在 WordPress 运行的过程中，它们会检查是否有插件注册了在该时间运行的函数。如果有，这些函数就会被执行。这些函数修改了 WordPress 的默认行为。

有两种类型的钩子，如下所示：

• 动作：动作是 WordPress 在执行过程中或在特定事件发生时触发的钩子。您的插件可以指定在此时执行一个或多个 PHP 函数，使用的是Action API。

• 过滤器：过滤器是 WordPress 在将文本添加到数据库或发送到浏览器屏幕之前修改各种类型文本时触发的钩子。您的插件可以指定在此时执行一个或多个 PHP 函数来修改特定类型的文本，使用的是Filter API。

这意味着您可以告诉 WordPress 在它运行任何内置函数的同时运行您的插件函数。在我们的例子中，我们希望我们的插件第一个函数doctype_styles_new_regex()作为一个过滤器与 WordPress 的the_content()函数（这是插件必须满足的第四个要求）一起运行。

现在，将以下代码添加到插件的底部：

add_filter('the_content', 'doctype_styles_new_regex');

这使用了add_filter钩子，告诉 WordPress 在运行the_content()函数时注册一个名为doctype_styles_new_regex()的函数。顺便说一句，如果您想将多个函数添加为内容的过滤器，可以向add_filter()函数添加一个第三个参数。这个第三个参数将是一个表示加载优先级的数字（默认值是 10，最高优先级是 1，最低优先级没有特定的限制——您甚至可以分配值如 100 或 999），WordPress 将按升序顺序运行您的函数。

我们插件必须满足的要求列表中剩下的就是第五个要求——即告诉 WordPress 在<head>标签中包含新的样式。这实际上是通过以下钩子完成的，使用add_action()与wp_enqueue_scripts处理程序：

add_action('wp_enqueue_scripts', 'doctype_styles_new_styles');

这是完整的插件 PHP 文件：

<?php 
/* 
Plugin Name: Add Document Type Styles New 
Plugin URI: http://nio.tips/
Description: Detects URLs in your posts and pages 
and displays nice document type icons next to them. 
Includes support for PDF, DOC, MP3 and ZIP. 
Version: 1.1 
Author: Karol K 
Author URI: http://karol.cc/ 
Text Domain: add_doctype_styles_new 
License: GNU General Public License v2 or later
*/ 

// this function does the magic 
function doctype_styles_new_regex($text) { 
  $text = preg_replace('/href=([\'|"][[:alnum:]|
     [:punct:]]*)\.(pdf|doc|mp3|zip)([\'|"])/', 
     'href=\\1.\\2\\3 class="link \\2"', $text); 
  return $text; 
} 

// this functions adds the stylesheet to the head 
function doctype_styles_new_styles() { 
    wp_register_style('doctypes_styles',      
    plugins_url('doctype_styles_new.css', __FILE__)); 
    wp_enqueue_style('doctypes_styles'); 
} 

// HOOKS ============= 

add_filter('the_content', 'doctype_styles_new_regex', 9); 
add_action('wp_enqueue_scripts', 'doctype_styles_new_styles');

确保在<?php之前没有空白空间。如果有任何空格，PHP 代码将会出错，并抱怨已经发送了头部信息。这是开发者在使用 WordPress 插件初期经常会犯的一个常见错误。同时，不使用 PHP 文件末尾的关闭标签(?>)也是一个一般的好主意。这样可以避免一些不幸的执行错误。

确保您保存并关闭此 PHP 文件。现在您可以按照以下两种方式之一操作：

• 使用您的 FTP 客户端，将add_doctype_styles_new/上传到您的

  wp-content/plugins/目录

• 将您的目录压缩成add_doctype_styles_new.zip，并使用wp-admin中的插件上传器将此插件添加到您的 WordPress 安装中

本版本的插件包含在本章的代码包中，位于名为phase 1的子目录内。我们的插件文件在最终版本完成之前将经历几个阶段。

插件安装后，它将出现在插件页面上，如下截图所示：

现在，您可以激活它并尝试使用它。

尝试插件

如果您查看本章开头创建的相同帖子，您将看到插件在起作用。这是相同的截图：

您还可以尝试添加一个包含指向 PDF、ZIP 或 DOC 文件链接的新帖子。然后，当您查看帖子时，您会看到我们的插件添加了更多图标。

现在您已经了解了一个使用钩子来利用现有 WordPress 功能的基本插件，让我们通过给用户一些控制权来增强这个插件。

添加管理页面函数的钩子

一些插件会在 wp-admin 中添加一个页面，您或用户可以在此编辑插件选项。我们已经在 W3 Total Cache、Yoast SEO 等插件中看到过这种情况。现在，让我们修改我们的插件，让用户能够控制哪些文档类型被支持。以下截图显示了完成后的新管理页面：

首先，停用我们刚刚编写的插件。我们将对其进行修改，然后重新激活它。以下列表详细说明了我们将执行以修改插件以实现新页面可能的步骤：

1. 添加创建管理页面并保存用户输入的新选项的函数

2. 修改 doctype_styles_new_regex() 函数，使其检索用户的输入

3. 添加管理页面函数

让我们开始吧！

添加管理页面函数

我们将要创建的管理页面将向 wp-admin 添加一个选项。这使用数据库中 WordPress options 表的现有空间，因此不需要进行数据库修改。这个新选项的名称必须是唯一的。我将把这个新选项命名为 doctype_styles_new_supportedtypes。

我们需要向插件中添加六个函数，以便在 wp-admin 中添加一个管理页面。让我们逐一查看这些函数：

1. 第一个函数在插件激活时添加新的 doctype_styles_new_supportedtypes 选项，并设置默认值如下：

      function set_supportedtypes_options() { 
          add_option("doctype_styles_new_supportedtypes",
             "pdf,doc,mp3,zip"); 
      }

1. 第二个函数在插件停用时移除新的选项，如下所示：

      function unset_supportedtypes_options () { 
        delete_option("doctype_styles_new_supportedtypes"); 
      }

1. 让我们看看新的第三个函数，如下所示：

      function modify_menu_for_supportedtypes() { 
        add_submenu_page( 
        'options-general.php',    //The new options page will be added as 
                                  //a submenu to the Settings menu.  
        'Document Type Styles',   //Page <title> 
        'Document Type Styles',   //Menu title 
        'manage_options',         //Capability 
        'add_doctype_styles_new', //Slug 
        'supportedtypes_options'  //Function to call 
        );   
      }

此函数使用 add_submenu_page() 函数调用在 wp-admin 的设置菜单中添加一个新项目。这需要六个参数，分别是：选项页面应放置的位置、页面标题、菜单链接文本、可以访问链接的最高级别用户、要打开的文件（在本例中为无），以及要调用的函数，supportedtypes_options()。

1. supportedtypes_options() 函数实际上是我们要添加的第四个新函数：

      function supportedtypes_options() { 
        echo '<div class="wrap"><h2>Supported Document 
           Types</h2>'; 
        if (isset($_POST['submit'])) { 
          update_supportedtypes_options(); 
        } 
        print_supportedtypes_form(); 
        echo '</div>'; 
      }

这个函数实际上显示了我们的新页面。它打印一个标题并检查是否有人点击了submit按钮；如果点击了submit按钮，supportedtypes_options()函数将更新选项然后打印表单。

1. 我们必须添加的新的第五个函数负责在点击submit按钮时更新选项，如下所示：

      function update_supportedtypes_options() { 
        $updated = false; 
        if ($_POST['doctype_styles_new_supportedtypes']) {  
          $safe_val = addslashes(strip_tags($_POST
             ['doctype_styles_new_supportedtypes']));     
             update_option('doctype_styles_new_supportedtypes', 
             $safe_val);  
          $updated = true; 
        } 

        if ($updated) { 
          echo '<div id="message" class="updated fade">'; 
          echo '<p>Supported types successfully updated!</p>'; 
          echo '</div>'; 
        } else { 
          echo '<div id="message" class="error fade">'; 
          echo '<p>Unable to update supported types!</p>'; 
          echo '</div>'; 
        } 
      }

1. 我们需要添加的最后一个函数，即新的第六个函数，打印用户将看到的表单。确保在关闭标签（EOF;）前后没有空格，如下所示：

      function print_supportedtypes_form() { 
        $val_doctype_styles_new_supportedtypes = 
           stripslashes(get_option('
           doctype_styles_new_supportedtypes')); 
        echo <<<EOF 
      <p>Document types supported by the Add Document Type Styles New plugin are listed       as follows.<br />To add a new type to be linked, take the following steps, in this order: 
      <ol> 
        <li>Upload the icon file for the new doctype to <i>wp-
           content/plugins/add_doctype_styles_new/</i></li>  
        <li>Add a line for the new doctype to the stylesheet at 
           <i>wp-content/plugins/add_doctype_styles_new/
           doctype_styles_new.css</i></li>  
        <li>Add the extension of the new doctype to the following list, keeping with the comma-separated format.</li> 
      </ol> 
      </p> 
      <form method="post"> 
        <input type="text" name=
           "doctype_styles_new_supportedtypes" size="50" 
           value="$val_doctype_styles_new_supportedtypes" />  
           <input type="submit" name="submit" value="Save Changes" 
           /> 
      </form> 
      EOF; 
      }

这六个函数一起负责在菜单中添加链接，添加此链接的管理页面，并更新新的选项。

修改doctype_styles_new_regex()函数

现在用户能够通过添加他们想要的文档类型来编辑支持的文档类型列表，我们应该有一种方法告诉doctype_styles_new_regex()函数使用用户的列表而不是内置列表。要做到这一点，我们需要在我们的doctype_styles_new_regex()函数中使用get_option('doctype_styles_new_supportedtypes')。get_option()函数将检索用户在我们刚刚创建的新选项中保存的值。修改您的doctype_styles_new_regex()函数，使其看起来如下所示：

function ahs_doctypes_regex($text) { 
  $types = get_option('doctype_styles_new_supportedtypes'); 
  $types = preg_replace('/,\s*/', '|', $types); 

  $text = preg_replace('/href=([\'|"][[:alnum:]|
     [:punct:]]*)\.('.$types.')([\'|"])/i', 'href=\\1.\\2\\3 
     class="link \\2"', $text); 

  return $text; 
}

添加钩子

我们已经添加了我们的管理页面函数，但现在我们必须告诉 WordPress 使用它们。要做到这一点，我们只需要添加以下三个新钩子：

add_action('admin_menu', 'modify_menu_for_supportedtypes'); 
register_activation_hook(__FILE__, "set_supportedtypes_options"); 
register_deactivation_hook(__FILE__, 
   "unset_supportedtypes_options");

第一个钩子告诉 WordPress 在创建admin_menu()菜单时添加我们的链接。接下来的两个钩子告诉 WordPress 在插件激活或停用时调用激活和停用函数。

这个插件的版本可以在本章的代码包中找到，位于名为final的子目录中。这是我们插件的最终版本。

尝试插件

我们已经添加了所有的新功能。现在是时候保存文件并看看会发生什么了。您可以继续并重新激活插件。现在，当您查看设置菜单时，您将看到已添加了一个新的链接，如下面的截图所示：

点击新的链接查看管理页面，如下面的截图所示：

如果您遵循管理页面上的前三个步骤（上传文件图标，将新样式添加到样式表中，并将扩展名添加到选项中），则新的文档类型将被支持。

已经有几种方法可以改进这个插件。以下是一些方法：

• 而不是强迫用户使用 FTP 上传他们新的图标，插件可以允许用户通过设置页面直接上传图标。

• 插件可以在设置页面上显示支持的文档类型的图标，这样用户就可以看到它们的外观。

• 插件可以检查确保在选项字段中的每个文档类型都有一个现有的图标，否则，它将显示错误。

也许你想亲自尝试这些更改！

测试你的插件

我们已经测试了我们新的插件，所以现在可能是时候说一两句关于测试你的插件并确保它们不会给普通用户带来任何问题的了。

我们的插件非常简单；它所做的唯一一件事是处理任何帖子或页面内容中找到的每个链接，并在其旁边添加一个自定义图标。然而，即使这样的简单插件也可能成为潜在的安全漏洞点。例如，用户唯一可以输入的地方是wp-admin（处理支持文件类型的字段）中的插件部分。现在，有人可能会使用这个字段输入一段特定的 PHP 代码而不是标准的文件类型；例如，旨在服务器端执行特定操作的代码，这可能导致严重的安全漏洞。这就是为什么我们的update_supportedtypes_options()函数有以下两行：

$safe_val = addslashes(strip_tags($_POST
   ['doctype_styles_new_supportedtypes'])); 
update_option('doctype_styles_new_supportedtypes', $safe_val);

多亏了它们，用户输入的所有内容都将通过strip_tags()移除所有的 PHP 和 HTML 标签，然后需要引号的所有字符将由addslashes()处理。使用这样的函数是一种以防万一的做法，但它往往最终会得到回报。

除了将我们的工作与一些常见的黑客攻击手段进行对比测试，如代码注入或 SQL 注入，我们还需要处理我们所能想到的所有非传统用途。例如，如果有人输入了一个非标准文件类型的值会发生什么？或者，如果 CSS 文件突然丢失会发生什么？这些问题只是良好测试会回答的一些问题。

测试插件的另一种好方法是将其交给几位可信赖的用户，并征求他们的反馈。对于完全不了解你插件的人来说，他们通常会比你，即插件的作者，做得更好。

当然，这里简短的章节只是触及了插件测试和代码测试的一般表面，所以我鼓励你自己更仔细地研究。网上和在你最近的书店里有很多很好的资源。

具有数据库访问权限的插件——捕获搜索词

现在，我们将把文档类型插件放在一边，创建一个新的，它将使用数据库的活跃功能。让我们创建一个简单的插件，用于存储访客搜索的所有单词（当使用博客的搜索功能时）。

总体来说，这个插件非常基础，不需要像我们之前工作的插件那样拥有自己的目录。这就是为什么整个插件都将在一个文件中完成：capture_searches_new.php。我将这个插件命名为“捕获搜索词新”。

此插件的数据库表结构如下。表名为 wp_searchedwords：

Field	Type	Null	Key	Default	Extra
Id	INT	NOT NULL	PRI	-	auto_increment
Word	VARCHAR(255)	-	-	NULL	-
created	DATETIME	NOT NULL	-	Today 00:00:01	-

现在，让我们编写插件代码。

尽管我说表名为 wp_searchedwords，但这并不总是如此。这完全取决于为你的网站设置的表前缀（默认前缀确实是 wp_）。在这里，为了方便，我仍然将表称为 wp_searchedwords。

使插件能够与数据库通信

此插件的第一部分应该在插件激活时运行。这将是一个初始化函数。其任务之一是创建或更新数据库表（如果之前尚未创建，则将创建表）：

function searchedwords_init($content) { 
  global $wpdb; 
  $sw_table_name = $wpdb->prefix.'searchedwords'; 

  //creating the table (if it doesn't exist) or updating it if 
  // necessary 
  if(isset($_GET['activate']) && 'true' == $_GET['activate']) { 
    $sql = 'CREATE TABLE `'.$sw_table_name.'` ( 
      id INT NOT NULL AUTO_INCREMENT,  
      word VARCHAR(255),  
      created DATETIME NOT NULL DEFAULT \''.date('Y-m-d').' 
         00:00:01\',  
      PRIMARY KEY  (id) 
    )'; 

    require_once(ABSPATH.'wp-admin/includes/upgrade.php'); 
    dbDelta($sql); 
  } 

  // in case a search has just been performed, store the searched 
  // word 
  if (!empty($_GET['s'])) { 
    $current_searched_words = explode(" ",urldecode($_GET['s'])); 
    foreach ($current_searched_words as $word) { 
      $wpdb->query($wpdb->prepare("INSERT into `$sw_table_name` 
         VALUES(null,'%s','".date('Y-m-d H:i:s')."')", $word)); 
    } 
  } 
}

此函数通过各种函数调用连接到数据库，例如 dbDelta()、$wpdb->query() 和 $wpdb->prepare()。dbDelta() 函数负责创建表或更新它（在需要的时候做任何需要的事情；你可以在 codex.wordpress.org/Creating_Tables_with_Plugins 上了解更多）。除此之外，当处理 WordPress 数据库时，你可以利用任何存在的数据库相关 PHP 函数。或者，你可以使用 WordPress 的类成员函数：$wpdb->get_results()。我们在这里使用的函数还会在搜索刚刚执行后，将搜索词存储在数据库表中。这是通过 $wpdb->query() 和 $wpdb->prepare() 函数完成的。

添加管理页面函数

我们现在需要一个看起来熟悉的函数，该函数将管理页面添加到 wp-admin 中。在这种情况下，我们使用 add_management_page() 而不是 add_submenu_page()，因为这个插件更像是一个工具，而不是需要设置的东西：

function modify_menu_for_searchedwords() { 
  $page = add_management_page( 
    "Capture Searched Words",  
    "Capture Searched Words",  
    'manage_options',  
    'capture_searches_new',  
    'searchedwords_page' 
  ); 
}

对于此插件，我们不会加载任何自定义样式或 CSS 文件。这里的目的是仅仅展示如何进行数据库连接，所以我们将保持其他一切超简单和最小化。因此，我们现在需要做的只是编写一个函数，该函数从数据库检索信息并在新管理页面上显示（同样，一切通过 $wpdb 对象完成——它是由 WordPress 定义的一个类，其中包含一组你可以用来与数据库交互的函数）：

function searchedwords_page() { 
  global $wpdb; 
  $sw_table_name = $wpdb->prefix.'searchedwords'; 

$searched_words = $wpdb->get_results("SELECT COUNT(word) AS 
   occurrence, word FROM `$sw_table_name` GROUP BY word ORDER BY 
   occurrence DESC"); 
  ?> 
<div class="wrap" style="max-width: 600px;"> 
<h2>Searched Words</h2> 
<table class="wp-list-table widefat"> 
<thead> 
  <tr> 
    <th scope="col">Search Words</th> 
    <th scope="col"># of Searches</th> 
  </tr> 
</thead> 
<tbody> 
  <?php 
  if($searched_words !== NULL) { 
    foreach($searched_words as $searched_word) { 
      echo '<tr valign="top"><td>'.$searched_word-
         >word.'</td><td>'.$searched_word->occurrence.'</td></tr>'; 
    } 
    $searched_perfomed = true; 
  } 
  else { 
    echo '<tr valign="top"><td colspan="2"><strong>No searches 
       have been performed yet</strong></td></tr>'; 
  } 
  ?> 
</tbody> 
</table> 
</div> 
  <?php 
}

就这样。之前的插件有更多功能，因为数据是从用户那里捕获并保存的。这里则不需要。

最后，我们只需要添加两个钩子，如下所示：

add_filter('init', 'searchedwords_init'); 
add_action('admin_menu', 'modify_menu_for_searchedwords');

第一个钩子告诉 WordPress 在插件激活时或执行搜索时运行初始化函数。第二个钩子修改 admin_menu 以添加到新管理页面的链接。

本章节的代码包中提供了这个插件的这个版本，位于名为final的子目录中。这是插件的第一版也是最终版。

尝试插件

与上一个插件一样，你现在可以通过 FTP 将插件上传到wp-content/plugins，或者将其转换为 ZIP 文件，然后使用上传器添加到wp-admin。

安装后，激活它。然后，查看工具下的菜单，你会看到一个指向新管理页面的链接，如下面的截图所示：

当你点击“捕获搜索词”时，你会看到一个新页面，这是插件创建的，如下面的截图所示：

正如你所见，我事先进行了一些搜索，以便在这个新页面上展示一些内容。你可以通过在你的侧边栏中放置搜索字段小部件（如下面的截图所示）并尝试不同的搜索词和短语来做到这一点。插件将收集所有这些内容，并在wp-admin中的其部分显示搜索次数最多的内容：

为基于块的编辑器构建插件

如你所知，WordPress 中有一个新的内容编辑器，这是在平台 5.0 版本中引入的。本质上，它废除了之前的单一编辑窗口，相反，允许用户使用单个内容块，一个接一个地放置。当所有这些块组合在一起时，就构成了最终的博客文章。这对用户来说很好，但对于插件开发者来说意味着什么呢？一些事情！

首先，为基于块的编辑器构建插件与我们在本章中构建的标准插件非常不同。虽然你可以仅凭对 PHP 和 HTML 的基本知识构建那些经典插件，但为基于块的编辑器构建则要复杂得多。这涉及到设置和掌握额外的网络技术。你需要像npm、Node.js和webpack这样的东西，更不用说你还必须熟悉 JavaScript。教所有这些内容足以写一本书。所以，而不是这样做，我将向你指出一些外部资源，你可以从这里开始你的基于块的编辑器冒险。然而，在我这样做之前，让我们简要总结一下为编辑器构建的一般想法和可能实现的内容。

新编辑器接受两种主要类型的元素，如下所示：

• 块状元素

• 侧边栏部分

换句话说，作为一个插件开发者，你可以创建新的块以包含在编辑器中，或者创建新的侧边栏条目以自定义插件功能的相关细节，或者两者都做。

我相信你现在一定知道什么是块了，让我给你展示一个在新编辑器中良好侧边栏使用的例子。它来自 Yoast SEO 插件(wordpress.org/plugins/wordpress-seo/;我们已在第五章中讨论过)，如果用户在他们的网站上启用了这个插件，并且他们继续撰写一篇新的博客文章，他们将在编辑器的右上角看到这个新的侧边栏部分，如下面的截图所示：

它允许用户调整他们文章的 SEO 参数。值得注意的一点是插件块如何与编辑器用户界面的其余部分良好集成。这种无缝集成是构建基于块的编辑器插件的整体目标。

如果你想要构建一个启用新块的插件，它们也需要使用与 WordPress 内置的默认块相同的界面约定。以下是一个做这件事的插件示例。它被称为 Otter blocks(wordpress.org/plugins/otter-blocks/)。

当你安装并激活它时，你会获得一套全新的块，最好的部分是它们与默认块完美融合。例如，包含的一个块是共享图标块。以下截图显示了它的样子：

如你所见，它具有与其他所有块相同的控件和类似选项。当然，这个插件是一个相当复杂的创作，由一个开发团队构建，你当然不必让你的第一个块插件有同样令人印象深刻。

话虽如此，你可能特别注意到与基于块的编辑器相关的一点；那就是，如果你的插件不需要创建任何新的块或侧边栏元素呢？在这种情况下，你根本不需要麻烦自己使用编辑器。我们在这章中迄今为止创建的两个插件根本不使用编辑器，所以让你的插件与编辑器兼容绝对不是必须的。

要开始使用基于块的编辑器的冒险，请阅读这篇两部分的指南，了解如何为块编辑器适配你的插件：第一部分可以在www.codeinwp.com/blog/adapt-your-plugin-for-gutenberg-block-api/找到，第二部分可在www.codeinwp.com/blog/make-plugin-compatible-with-gutenberg-sidebar-api/找到。

此外，你可以尝试免费的 Gutenberg 模板插件(github.com/HardeepAsrani/gutenberg-boilerplate)，它提供了一个最小化的块编辑器开发设置和示例，全部包含在一个包中。包含一个示例块和一个示例侧边栏。你可以在创建自己的块准备插件时基于这些元素进行构建。

学习更多

WordPress 中有数百个钩子可用——本书中难以全部涵盖。你可以通过上网了解更多关于它们的信息。从这些在线参考网站开始：

• 插件 API文章包含了关于编写插件和使用钩子的非常详细的信息，网址为codex.wordpress.org/Plugin_API。

• 要查看完整的动作钩子列表，请访问codex.wordpress.org/Plugin_API/Action_Reference。

• 要查看完整的过滤器钩子列表，请访问codex.wordpress.org/Plugin_API/Filter_Reference。

• 你可能还想退一步查看 WordPress Codex 中的通用插件资源页面，网址为codex.wordpress.org/Plugin_Resources。

• 另一个你可能觉得非常有用的页面是针对开发者的新代码参考：developer.wordpress.org/reference/。

• 如果你想要为新的基于块的编辑器构建插件，一个关键的资源是Gutenberg 手册，可在wordpress.org/gutenberg/handbook/找到。

• 如果你想要将你的插件提交到 WordPress 插件仓库，你需要采取与准备主题时类似的步骤，并且你还需要连接到 WordPress SVN 仓库。有关如何将插件提交到 WordPress 插件仓库的更多信息，请参阅developer.wordpress.org/plugins/wordpress-org/。

小工具

编写小工具与编写插件有一些相似之处。在某些方面，它甚至更容易，因为你可以利用小工具类来实现一些功能。在其他方面，它也可能更耗时，因为每个小工具都必须包含大量的强制代码。

自定义标签云小工具

在本节中，我们将看到如何编写一个显示自定义标签云的小工具，然后我们可以将其放置在侧边栏中。还将有可能更改小工具的标题，尽管这是一个标签云小工具，我们仍然能够将标签切换为类别，并以类似标签云的风格显示它们。最终形式的小工具将类似于以下截图：

为了比较，这里展示的是标准标签云小部件（WordPress 中的原生小部件）的样子：

让我们开始吧！

为我们的小部件命名

在这种情况下，我们将创建一个独立的小部件插件。所以，就像任何其他插件一样，它需要一个独特的名称，并在 wp-content/plugins 目录中有一个独特的出现。

我鼓励你在创建新的小部件或插件时，随时在网络上搜索，以确保没有其他东西使用相同的名称。除此之外，使用命名空间作为每个文件名（和函数名）的前缀。例如，我的命名空间是 kk_。

我将命名新的插件文件（包含小部件）为 kk_tag_cloud_widget.php，并将其放入 wp-content/plugins 目录下的 kk_tag_cloud_widget 目录中。

这个主要的 PHP 文件开始就像任何其他插件一样，以下是一个声明：

<?php 
/* 
Plugin Name: Karol K's Tag Cloud Widget 
Description: Displays a nice tag cloud. 
Plugin URI: http://nio.tips/ 
Version: 1.1 
Author: Karol K 
Author URI: http://karol.cc/ 
License: GNU General Public License v2 or later 
*/

小部件结构

当你使用小部件类构建小部件时，你的小部件需要以下结构：

class UNIQUE_WIDGET_NAME extends WP_Widget { 

  public function __construct() { 
    $widget_ops = array(); 
    $control_ops = array(); 
    parent::__construct('base id', 'name', $widget_ops, 
       $control_ops); 
  } 

  public function widget($args, $instance) { 
    // used when the sidebar calls the widget 
  } 

  public function form($instance) { 
    // prints the form on the widgets page 
  } 

  public function update($new_instance, $old_instance) { 
    // used when the user saves his/her widget options 
  } 
} 

// initiate the widget 

// register the widget

我为这个项目创建的唯一小部件名称是 KK_Widget_Tag_Cloud。现在，让我们逐个回顾前面的函数，并了解它们的作用。

小部件初始化函数

让我们从小部件初始化函数开始。在我们添加任何内容之前，它看起来如下所示：

public function __construct() { 
  $widget_ops = array(); 
  $control_ops = array(); 
  parent::__construct('base-id', 'name', $widget_ops, 
     $control_ops); 
}

在这个函数中，它是类的构造函数，我们初始化 WP_Widget 类期望的各种东西。前两个变量，你可以给它们任何你想要的名称，只是设置两个数组变量的便捷方式，这是第三行代码期望的。

让我们来看看这三行代码，如下所示：

• $widget_ops 变量是你可以设置类名的地方，这个类名是给 div 小部件本身的，还有描述，这个描述在 wp-admin 的小部件页面上显示。

• $control_ops 变量是你可以设置 wp-admin 的小部件页面上控制框的选项的地方，例如小部件的宽度和高度，以及用于内部项目和名称及 ID 的前缀。对于我的基本小部件，我不会使用这个变量（因为它不是必需的）。

• 当你调用父类的构造函数 WP_Widget() 时，你需要告诉它小部件的唯一 ID、小部件的显示标题，并传递你创建的两个数组。

对于这个小部件，我的代码现在看起来如下所示：

public function __construct() { 
  parent::__construct( 
    'kk-tag-cloud', 
    'KK Tag Cloud', 
    array( 
      'description' => 'Your most used tags in cloud format; same 
         height; custom background' 
    ) 
  ); 
}

小部件表单函数

小部件表单函数必须命名为 form()。如果你想让小部件类知道它的目的，你不得重命名它。你还需要有一个参数，我称之为 $instance，这个类也期望它。这是当前小部件设置存储的地方。这个函数需要包含创建用户在添加小部件到侧边栏时将看到的表单的所有功能。让我们看看一些简化的代码，然后探索它在做什么，如下所示：

public function form($instance) { 
  $instance = wp_parse_args((array) $instance, 
  array('template' => '')); 
  $current_taxonomy = $this->_get_current_taxonomy($instance); 
  ?> 
  <p> 
    <label for="<?php echo $this->get_field_id('title'); 
       ?>">Title</label>    
    <input type="text" class="widefat" id="<?php echo $this-
       >get_field_id('title'); ?>" name="<?php echo $this-
       >get_field_name('title'); ?>" value="<?php if  
       (isset($instance['title'])) 
       {echo esc_attr($instance['title']);} 
   ?>" /> 
  </p> 
  <p> 
    <label for="<?php echo $this->get_field_id('taxonomy'); 
       ?>">Taxonomy</label>   
    <select class="widefat" id="<?php echo $this-
       >get_field_id('taxonomy'); ?>" name="<?php echo $this-
       >get_field_name('taxonomy'); ?>"> 
    <?php foreach(get_object_taxonomies('post') as $taxonomy) : 
      $tax = get_taxonomy($taxonomy); 
      if(!$tax->show_tagcloud || empty($tax->labels->name)) 
        continue; 
      ?> 
      <option value="<?php echo esc_attr($taxonomy) ?>"
      <?php selected($taxonomy, $current_taxonomy); ?>>
      <?php echo $tax->labels->name; ?></option> 
    <?php endforeach; ?> 
    </select> 
  </p> 
  <?php 
}

首先，你使用一个名为 wp_parse_args() 的 WordPress 函数，该函数创建一个 $instance 数组，你的表单将使用它。里面的内容取决于你设置的默认值和用户已经保存的设置。然后，你创建表单字段。注意，对于每个表单字段，我使用了内置的函数，这些函数将创建唯一的名称和 ID，并输入现有值，如下所示：

• $this->get-field_id() 根据小部件实例创建一个唯一的 ID（记住，你可以创建这个小部件的多个实例）。

• $this->get_field_name() 根据小部件实例创建一个唯一的名称。

• $instance 数组是找到小部件当前值的地方，无论它们是默认值还是用户保存的数据。

里面的所有其他代码都是常规的 PHP 和 HTML。注意，如果你允许用户设置标题，请将此字段命名为 title，WordPress 将在最小化时在表单上显示它。这个表单将创建如下所示：

小部件保存函数

当用户点击小部件表单上的保存按钮时，WordPress 会使用 AJAX 来运行你的保存函数。你需要确保保存用户输入的所有内容，在这个例子中，我们就是这样做的，但如果你觉得适合你的小部件（例如，数据库交互、转换、计算等），你可以在这里添加其他功能。这个函数的最终代码如下：

public function update($new_instance, $old_instance) { 
  $instance['title'] = $new_instance['title']; 
  $instance['taxonomy'] = stripslashes($new_instance['taxonomy']); 
  return $instance; 
}

确保这个函数名为 update()，并准备好接受两个实例，一个包含旧数据，一个包含刚刚提交的数据。你可以编写代码来检查 $new_instance 是否有问题，因此，如果新的实例无效，则返回 $old_instance。你返回的 $instance 数据将显示在更新小部件表单中。

小部件打印函数

在你的小部件类中，第三个主要函数是在侧边栏需要实际向访问网站的人展示小部件时被调用的。它需要检索任何相关的已保存用户数据，并向网站访客打印信息。在这种情况下，我们的最终打印函数如下所示：

public function widget($args, $instance) { 
  extract($args); 
  $current_taxonomy = $this->_get_current_taxonomy($instance); 
  if(!empty($instance['title'])) { 
    $title = $instance['title']; 
  } 
  else { 
    if('post_tag' == $current_taxonomy) { 
      $title = 'Tags'; 
    } 
    else { 
      $tax = get_taxonomy($current_taxonomy); 
      $title = $tax->labels->name; 
    } 
  } 
  $title = apply_filters('widget_title', $title, $instance, $this-
     >id_base); 
  $before_widget = '<div class="widget-container kk_widget_tag_cloud">'; 
  $after_widget = '</div>'; 
  $before_title = '<h1 class="widget-title">'; 
  $after_title = '</h1>'; 

  echo $before_widget; 
  if ( $title )  echo $before_title . $title . $after_title;  
  echo '<div class="kk_tagcloud">'; 
  wp_tag_cloud(apply_filters('widget_tag_cloud_args', 
     array('taxonomy' => $current_taxonomy))); 
  echo "</div>\n"; 
  echo $after_widget; 
}

前面的函数调用了一个额外的辅助函数，该函数负责获取当前分类法。虽然它非常简单，代码如下：

function _get_current_taxonomy($instance) { 
  if ( !empty($instance['taxonomy']) && 
     taxonomy_exists($instance['taxonomy']) ) 
    return $instance['taxonomy']; 
  return 'post_tag'; 
}

在主函数中，我首先提取实例中的数据，这些数据包含网站管理员在填写小部件表单时保存的信息。然后，小部件查看所选的分类法（标签或类别），并以简单的单行列表显示所有单个项目。

自定义小部件样式

我们的小部件有自己的样式表，需要包含在当前主题的head部分，就像任何其他样式表一样。

文件名为 kk_tag_cloud_widget.css，包含以下内容：

.kk_widget_tag_cloud .kk_tagcloud { 
    line-height: 1.5em; 
} 

.kk_widget_tag_cloud .kk_tagcloud a { 
    display: inline-block; 
    margin: 3px 2px; 
    padding: 0 11px; 
    border-radius: 3px; 
    -webkit-border-radius: 3px; 
    background: #eee; 
    color: #279090; 
    font-size: 12px !important; 
    line-height: 30px; 
    text-transform: uppercase; 
} 

.kk_widget_tag_cloud .kk_tagcloud a:hover { 
    color: #f2f2f2; 
    background: #404040; 
}

没有什么花哨的，只是一组确保小工具看起来很棒的类。我们唯一需要对这个样式表做的事情是通过标准的 WordPress 钩子将其排队。在你的插件主文件中放置以下代码：

function kk_tag_cloud_widget_styles_load() { 
  wp_register_style('kk_tag_cloud_widget_styles', 
     plugins_url('kk_tag_cloud_widget.css', __FILE__)); 
  wp_enqueue_style('kk_tag_cloud_widget_styles'); 
} 
add_action('wp_enqueue_scripts', 
   'kk_tag_cloud_widget_styles_load');

启动和连接小工具

小工具功能到此结束！现在，你只需要添加一小段代码，将小工具与 WordPress 的其他部分连接起来，如下所示：

function KK_Widget_Tag_Cloud_Reg() { 
  register_widget('KK_Widget_Tag_Cloud'); 
} 
add_action('widgets_init', 'KK_Widget_Tag_Cloud_Reg');

这告诉 WordPress，当它启动小工具时，必须确保注册我们新的小工具。

此版本的小工具包含在本章的代码包中，位于名为phase 1的子目录内。在我们将其称为最终版本之前，我们还会添加一个新功能。

尝试使用小工具

你的小工具已经准备好了！现在让我们尝试一下我们创建的这个小工具：

1. 保存所有更改，并将你的小工具上传到wp-content/plugins目录。

2. 前往插件部分，你会看到你的小工具正等待被激活，就像往常一样。

3. 点击激活按钮后，你可以导航到外观 | 小工具。你会看到小工具等待被添加到侧边栏，如下面的截图所示：

1. 将小工具拖到侧边栏，然后点击小箭头进行编辑。你会看到选项滑下来，如下面的截图所示：

1. 你可以输入一个标题或留空使用默认标题，并选择你想要显示的分类。

2. 然后，就像处理任何小工具一样，点击保存。

3. 当你回到网站的首页并重新加载时，新的标签云将立即显示，如下面的截图所示：

学习更多

你可以通过以下在线参考网站了解更多关于小工具的信息：

• WordPress 的小工具 API位于codex.wordpress.org/Widgets_API。

• WordPress 在codex.wordpress.org/WordPress_Widgets列出了许多小工具。

• 如果你想要在你的网站上安装更多的小工具，请访问插件仓库的小工具部分wordpress.org/plugins/tags/widget。

将小工具捆绑到现有插件中

如果你正在编写插件并且想要与插件一起提供小工具，你不需要创建一个单独的小工具插件。只需将所有的小工具代码——类似于我们在前面的部分中创建的——包含到你的插件 PHP 文件中。当用户激活插件时，小工具将自动显示在wp-admin的小工具页面上。不需要单独的文件！

短代码

短代码是一种方便的方式，可以让非技术人士，例如网站编辑，在页面和帖子中包含动态内容，而无需实际使用任何 PHP、复杂的 HTML 结构或自定义 JavaScript。换句话说，短代码是方便的可重用代码片段，但它们不需要任何实际的编码经验或知识。

短代码及其工作方式

短代码的工作方式是告诉 WordPress 查看方括号[]内的文本，并通过运行 PHP 函数来评估它。这个 PHP 函数可以存在于主题的functions.php文件中，或插件文件中，或小工具文件中。让我们创建一个简单的短代码并将其包含在我们的最新小工具插件中。

短代码的类型

根据定义，短代码是一个相当简单的概念，但我们仍然可以区分三种主要类型，如下所示：

• 单标签短代码：这些短代码只需要一个标签即可执行，例如，[my_first_shortcode/]。

• 双标签短代码：这些短代码通过打开和关闭标签来执行，例如，[my_2nd_shortcode]some text here[/my_2nd_shortcode]（注意关闭标签有一个额外的/）。如你所见，标签内也有一些内容。这些内容可以通过短代码函数进行处理。

• 带属性的短代码：这些短代码可以有一个或两个标签，还可以使用一些属性来自定义输出，例如，[my_3rd_shortcode name="Karol" twitter="carlosinho"]some text here[/my_3rd_shortcode]。

创建一个简单的短代码

让我们创建一个简单的短代码，这样我们就可以在任何给定帖子或页面中使用我们的小工具输出。这将是一个带有额外属性的标签短代码，我们将使用它来指示输出是否应该使用我们的自定义 CSS 或 WordPress 的本地样式进行格式化：

1. 让我们从在kk_tag_cloud_widget.php文件的底部创建一个新函数开始，然后我们将逐行进行操作，如下所示：

function kk_tag_cloud_handler($atts, $content=null) { 
  extract(shortcode_atts(array( 
    'use_css' => '1', 
    'taxonomy' => 'post_tag' 
    ), $atts)); 

  $tax = 'post_tag'; 
  if(taxonomy_exists($taxonomy)) $tax = $taxonomy; 

  $result = ''; 

  if ('0' != $use_css) { 
    $result .= '<div class="kk_widget_tag_cloud"><div 
       class="kk_tagcloud">'; 
  } 
  if (null != $content) { 
    $result .= addslashes(strip_tags($content)).' '; 
  } 
  $result .= wp_tag_cloud(apply_filters( 
    'widget_tag_cloud_args',  
    array('taxonomy' => $tax, 'echo' => false) 
    )); 
  if ('0' != $use_css) { 
    $result .= '</div></div>'; 
  } 

  return $result; 
}

首先，请注意，这个函数不echo或print任何内容。它只是返回一个字符串。如果你让你的函数打印，它将不会在网站上看起来正确。

在我们的函数中，第一行处理短代码接收的自定义属性（在这种情况下，只是use_css参数，用于指示是否应该使用样式，以及taxonomy参数，用于指示短代码中应显示的分类法）。WordPress 会自动传递$atts参数，我们只需要使用extract()函数将用户提交的属性转换为函数中可用的变量。传递给extract()函数的数组中的值设置了默认值，以防用户没有选择任何选项。一般来说，你可以为短代码用户提供无限多的选项。

下一行提取分类标识符并尝试将其转换为有效的分类。如果用户的输入无效，将使用默认的post_tag分类。函数的最后部分根据use_css属性的当前状态处理显示。目前来说这相当基础！还有可能包含自定义文本作为短代码的主要内容。在某些情况下这可能很有用。

1. 我们现在需要告诉 WordPress 这个功能是一个短代码，我们通过钩子来实现。务必选择一个独特的名称。我已选择kk_tag_cloud作为这个短代码的名称，所以钩子看起来如下所示：

add_shortcode('kk_tag_cloud', 'kk_tag_cloud_handler');

1. 要在我们的内容中使用这个短代码，我们只需编辑任何给定的帖子或页面，并插入如下所示的行：

[kk_tag_cloud taxonomy="category"] Select the category you'd like 
   to read next:[/kk_tag_cloud]

1. 这种使用方式会产生以下效果：

1. 我们还可以使用如下所示的短代码：

[kk_tag_cloud use_css="0" taxonomy="category"]Select the category 
   you'd like to read next:[/kk_tag_cloud]

1. 这将禁用自定义样式并产生以下效果：

1. 要显示默认格式的标签云（显示标签并使用自定义样式表），我们只需执行以下短代码即可：

[kk_tag_cloud][/kk_tag_cloud]

效果如下所示截图：

关于短代码可以做什么和不能做什么的限制非常少。

这个小部件的版本可以在本章的代码包中找到，位于名为final的子目录中。这是我们小部件的最终版本。

WordPress REST API

WordPress REST API 是 WordPress 平台上的一个相对较新的功能。在它被添加到核心之前，REST API 作为一个独立的机制通过一个单独的插件提供。你可以获取所有内容，也可以从项目的官方网站v2.wp-api.org/学习如何与之交互。

然而，REST API 在 WordPress 4.7 版本中被包含在了 WordPress 核心包中。这意味着你不再需要任何额外的插件或工具来使其工作。基本上，只要你在 WordPress 的最新版本上，REST API 就已经默认安装并启用。这是一个好消息！但让我们更深入地了解一下。

什么是 REST API？

在底层，REST API——官方称为 WordPress REST API——只是另一层技术，允许你与你的 WordPress 站点以及其他人的站点进行交互。主要来说，REST API 允许你将 WordPress 站点的表示层与其在后台运行机制分开。换句话说，通过特定的 REST API 调用，你可以在不进入站点的wp-admin或甚至通过网页浏览器访问它的情况下，对 WordPress 站点的内容执行操作。

为什么使用 WordPress REST API？

REST API 的引入为使用 WordPress 网站提供了许多新的可能性，包括你可以做什么以及你可以用它做什么。例如，通过 REST API，你可以远程与 WordPress 内容进行交互，添加新内容，删除内容，或执行任何其他操作。仅举一个主要可能性，这使得为你的网站创建移动应用变得容易，并且应用可以通过 REST API 与网站进行通信。换句话说，如果你想通过除了直接访问网站之外的其他方式与 WordPress 网站进行通信，那么你可以使用 REST API 来实现这一点。

如何开始使用 REST API

我们在这里只是触及了表面，本章中提供的描述绝对不是详尽的。REST API 是一项相当先进的技术，它让你可以做很多事情——有时是通过相当复杂的代码结构。因此，我们在这里想要实现的唯一目标是帮助你入门，通过提供一个基础，你可以在此基础上进一步探索，当你学习 REST API 的其他地方时。如果你真正想精通 REST API，一个很好的起点是官方开发者手册developer.wordpress.org/rest-api/。话虽如此，以下是如何开始使用 REST API 的基础知识。

REST API 允许你通过发送请求和通过 WordPress HTTP API 接收响应的方式与任何 WordPress 网站进行交互。为了发出一个有效的请求，你需要引用以下内容：REST API 的基本 URL 路径、路由和端点。

所有 WordPress 网站的基本 URL 路径都是类似的：http://YOURWEBSITE.com /wp-json/wp/v2/。

路径定义了你想要与之通信的网站内容的精确部分。例如，你可以使用posts/来与网站的帖子进行通信。在这种情况下，完整的 URL 将是http://YOURWEBSITE.com/wp-json/wp/v2/posts/。

端点是 REST API 中可用的特定功能。例如，如果你将路由扩展到通过 ID 定位特定帖子，例如http://YOURWEBSITE.com /wp-json/wp/v2/posts/123，那么这允许你调用以下三个端点之一：

• GET 返回帖子数据

• PUT 更新帖子数据并返回更新后的帖子数据

• DELETE 删除帖子并返回已删除的帖子数据

除了默认的端点之外，你还可以根据自己的需求创建自己的端点，以便通过 REST API 对你的内容进行操作。然而，这可能是一个更深入的 REST API 手册的主题。为了本书的目的，我们只进行一个简单的演示，并创建一个插件，该插件将通过 REST API 与外部 WordPress 网站进行通信。

创建使用 REST API 的插件

你已经在本章中学习了如何创建基本的 WordPress 插件，所以现在，让我们将这个知识与 REST API 的新增功能结合起来。我们正在构建的插件将简单地根据短代码显示另一博客的帖子列表。

让我们来看看这个插件的完整代码——所有这些都包含在一个名为kk_rest_demo.php的单个文件中，如下所示：

function kk_rest_handler($atts, $content=null) {
  extract(shortcode_atts(array( 
    'website_domain' => 'newinternetorder.com', 
    'how_many' => '3' 
  ), $atts)); 

  $response = wp_remote_get( 'http://' . $website_domain . '/wp-
  json/wp/v2/posts/' );

  if( is_wp_error( $response ) ) { 
    $error_string = $response->get_error_message(); 
    return 'Error occurred: <em>' . $error_string . '</em>'; 
  }

  $posts = json_decode( wp_remote_retrieve_body( $response ) );

  if( empty( $posts ) ) { return 'No posts found'; } 
  else { 
    $result = '<ul>'; 
    $post_count = 0; 
    foreach( $posts as $post ) { 
      $post_count++; 
      if ($post_count <= $how_many) { 
        $result .= '<li><a href="' . $post->link. '">'
        . $post->title->rendered . '</a></li>'; 
      } 
    } 
    $result .= '</ul>'; 
    return $result; 
  }
}
add_shortcode('kk_rest', 'kk_rest_handler');

第一个函数调用extract()是我们从之前的短代码插件/小部件中了解到的。它提取了分配给短代码的属性。在我们的情况下，短代码与两个可选属性一起工作，如下所示：

• website_domain：这表示插件应该与之通信的 WordPress 网站的域名（默认为newinternetorder.com）。

• how_many：这表示应该检索多少篇帖子（默认为3）。

下一个函数调用是主要 REST API 通信发生的地方。这个调用引用了一个给定的路由，并使用 GET 端点（默认）检索博客帖子，如下所示：

$response = wp_remote_get( 'http://' . $website_domain . '/wp-json/wp/v2/posts/' );

之后，我们只需检查是否有错误，如果有，就停止函数。下一个函数调用解码响应，并允许我们稍后逐个引用单个帖子，如下所示：

$posts = json_decode( wp_remote_retrieve_body( $response ) );

最后的foreach循环和if语句遍历每一篇帖子并检索它们的标题和 URL，这些信息随后被添加到一个标准的 HTML 无序列表，并通过短代码返回。在这个时候，一旦我在我的测试网站上激活了这个插件，我就可以创建一篇新帖子，并将以下短代码添加到其中：

[kk_rest website_domain="newinternetorder.com" how_many="2"]
[/kk_rest]

这告诉插件与newinternetorder.com通信并检索最新的两篇帖子。以下截图显示了前端上这个结果：

当然，我们在这里构建的插件非常简单，它并没有确保提供的域名有效或任何其他安全相关的事情。然而，这个演示的目的只是为了向你展示与 REST API 一起工作的最简单方法，没有其他。再次强烈建议你查看一些官方资源，例如developer.wordpress.org/rest-api/上的REST API 手册。

这个版本的插件包含在本章的代码包中，位于名为final的子目录内。

摘要

在本章中，你学习了创建基本插件和小部件所需的所有知识。现在你知道了如何构建插件的 PHP 文件结构，在哪里放置你的函数，以及如何使用钩子。你还学习了如何添加管理页面，使插件和小部件能够访问数据库，以及如何创建短代码。

在所有这些之上，你还学习了如何使用 REST API 并与其他 WordPress 网站进行基本通信。凭借你现有的 PHP 和 HTML 知识，你有了开始编写任何你想要的插件和/或小部件的工具。

在下一章中，我们将带你从头开始创建一个完整的非博客网站的过程。

第三部分：非博客网站

本节是您 WordPress 之旅的最后一站。在这里，您将了解到将 WordPress 作为非博客网站的核心支柱是多么容易。

本节将涵盖以下章节：

• 第十二章，创建非博客网站，第一部分 – 基础知识

• 第十三章，创建非博客网站，第二部分 – 电子商务网站和自定义内容元素

第十二章：创建非博客网站第一部分 - 基础

正如您在阅读这本书时所看到的，WordPress 完全配备了支持博客的功能，包括处理帖子、分类、按时间顺序显示等博客特有的特定要求。然而，为博客提供动力并不是 WordPress 的唯一目的。不再是了。事实上，现在有数百万个网站正在运行 WordPress，但其中博客并不是网站的主要焦点。我自己也构建了许多这样的网站。

为了给您一个大致的概念，以下是一些使用 WordPress 可以构建和发布的流行非博客类型网站的列表（我们将在本章和下一章中更详细地介绍其中的一些）：

• 静态网站：这类网站只有少数静态子页面，通常不经常更新；此外，主要内容也不是按时间顺序组织，就像博客文章一样。

• 企业或商业网站：这类网站与上一类相似，但通常规模更大，子页面数量也更多；此外，对于大多数商业网站，其设计看起来非常正式，色调也较为低调。

• 单页网站：这类网站只有一页内容；主要用于名片类型的网站，或者用于那些没有很多内容在网站上展示的企业。尽管整个网站只由一页组成，但设计通常很吸引人，有很多动态过渡效果和视差滚动背景。

• 电子商务商店：这些网站任何人都可以浏览多种产品，然后使用购物车进行购买。除了购物车功能外，还有在线支付集成，通常还有一个后端库存管理系统。

• 会员网站：这类网站的一些内容仅对那些注册了会员并（通常）为此特权支付了少量费用的用户开放；这些仅限会员的区域可以包含网站所有者认为合适的任何类型的内容——WordPress 在这方面没有任何限制。

• 视频博客：这就像一个标准博客，只是博主发布的是视频帖子，而不是基于文本的帖子。

• 照片博客：这些博客就像视频博客一样，只是围绕照片展开；它们是摄影师、平面设计师和其他类似职业人士非常常见的一种博客类型。

• 产品网站：简而言之，这是一种与电子商务商店非常相似的网站类型，只是这次我们通常只处理销售的单个产品。它是一种非常流行的网站类型，适用于各种网络、iOS 和 Android 应用程序。

• 社交网络：就像 Facebook 一样，只是这些是在 WordPress 上运行的。

• 细分市场商业网站：这类网站的例子包括当地餐厅网站、酒店网站、咖啡店网站、个人作品集网站、艺术画廊网站等等。

再次强调，如果我要简要地解释一般非博客网站是什么，我会说它是一种博客不是网站所有者使用的主要功能的任何类型的网站。当然，非博客网站构成了整个互联网的绝大多数。然而，由于我们在这里讨论的是 WordPress，许多人仍然认为它只是一种博客系统，我想向您保证这已经不再是事实。如今，WordPress 几乎可以用于任何事情。

在本章和下一章中，我们将探讨我们刚才提到的某些网站类型，并展示如何使用 WordPress 有效地构建它们。我们还将使用在前几章中获得的知识，因此最好您熟悉到目前为止所发生的一切，然后再阅读以下页面中的信息。

下面是我们将要深入探讨的网站类型：

• 静态网站

• 企业或商业网站

• 单页网站

• 电子商务商店

• 视频博客和照片博客

• 社交网络

此外，还有一些新的功能特性，我们在前面的章节中没有探讨过，这是我们将会关注的重点。这些包括以下内容：

• 创建具有自定义分类法的自定义文章类型

• 在wp-admin中更改自定义文章类型显示

让我们开始吧！

必须完成的任务

尽管可以使用 WordPress 构建许多不同类型的网站，但有一些步骤对所有网站都是强制性的。

例如，无论您想推出哪种类型的网站，您都必须首先正确安装 WordPress。这正是我们在第二章“WordPress 入门”中讨论的内容。实际上，这一点并没有什么不同。安装过程是相同的，所有步骤都是相同的，最终结果也是相同的——您将得到一个干净、空白的 WordPress 安装。此外，在安装特定主题和插件时，请确保遵循我们在第五章“插件——它们是什么以及为什么您需要它们”和第七章“选择和安装主题”中讨论的相同指南。

最后但同样重要的是，为了确保您的网站安全并且具有良好的用户管理结构，您必须牢记围绕用户账户和编辑工作流程（发布新内容）的所有最佳实践。

基本上，在构建非博客网站时，唯一不同的元素是选择主题和选择网站插件的流程。此外，如果您想将其提升到下一个层次，您将不得不手动实现各种功能，或者由专业人士为您定制解决方案。

幸运的是，这个过程本身并不比使用标准博客更困难。所以，一旦你在 WordPress 上积累了一些经验，你就能快速完成它。

静态网站

让我们从静态网站开始，因为它们是最简单的非博客网站类型，也是最容易创建的（这不应该令人惊讶）。

静态网站最好的部分是构建它们不需要任何特定的主题或插件。秘密在于开发者的心态。本质上，为了有效地完成这项工作，你需要做的只有以下几件事：

1. 利用 WordPress 中的页面功能

2. 调整默认的主页以创建更静态的体验

流程

首先，让我们解决一个常见的误解。静态网站的目的并不是将内容硬编码到 HTML 或 PHP 文件中。真正的目的是放弃内容的标准时间顺序组织（放弃博客功能）并专注于构建一个页面独立存在的网站，彼此之间相互独立。因此，最终我们仍然可以通过wp-admin轻松编辑一切，唯一的区别是我们没有使用标准的 WordPress 帖子来做任何事情。相反，我们专注于 WordPress 页面。

在设置一个优秀的静态页面的过程中，你必须做以下几件事：

1. 选择一个符合你的目标和针对你特定项目的吸引人的 WordPress 主题（我们在第七章，选择和安装主题）中讨论过）；这是所有类型非博客网站的一个强制性步骤。简单地说，并不是每个主题都适合所有类型的网站。所以，每次选择一个特定的主题时，请记住你打算如何使用这个网站——这将使你作为开发者的工作更容易，一旦网站上线，也会使网站对未来的访客来说更好。

2. 创建一个包含你想要将它们作为网站一部分的所有静态页面的列表。例如，对于一个本地的宠物美容服务，页面可以包括画廊、优惠和定价、客户评价、联系页面和地图。

3. 在wp-admin中创建每个页面（通过页面 | 添加新页面）。

4. 创建一个额外的页面，命名为 HOME，并调整它以提供良好的主页体验。例如，首先关注初访客可能会认为在主页上有用的元素。一个好的主页应该回答问题：这个网站是关于什么的？

5. 创建易于理解的菜单，使导航变得轻松愉快。

步骤 1 到 3 相当直接，所以我们只需关注最后两个步骤。

构建你的主页

默认情况下，WordPress 会将主要博客列表（按时间顺序排列的帖子列表）用作主页。在我们的情况下，这不是我们想要的，因为没有帖子。我们将要做的是创建一个自定义页面，然后将其用作静态主页（主页）。

我们在第四章详细讨论了如何做这件事，页面、媒体和导入/导出内容。因此，让我们在这里只关注一个基本的概述，但请随时回到第四章，页面、媒体和导入/导出内容，以获取更实用的教程。

要创建一个新的主页，请转到“页面”|“添加新页面”，并像处理任何其他页面一样进行操作。你可以将其命名为“HOME”，以便清楚地表明其用途。你在这个页面上放置的内容由你自己决定。本质上，主页应该是任何第一次访问给定网站的访客的一个很好的起点。例如，你可以选择一个简短的介绍信息，列出你网站上的一些热门文章，使用 Contact Form 7 插件提供的联系表单，以及一个由Google Maps提供的交互式地图。你可以使用 WordPress 中的新块编辑器放置所有这些元素。

一旦你的页面准备就绪，你唯一要做的就是将其指定为主页。这可以在“设置”|“阅读”中进行，如第四章讨论的，页面、媒体和导入/导出内容。

如果你想要让你的主页更加精美，你可以创建一个自定义页面模板（在第九章描述，开发你自己的主题），这将允许你包含你可能需要的任何设计元素，以及丰富的自定义功能。同样，这完全取决于项目。

创建易于理解的菜单

静态网站拼图中的最后一个元素是一个合适的菜单（或多个菜单）。因为我们的主页就像你可以在 WordPress 中创建的任何其他页面一样，它将出现在默认页面菜单（页面小工具）中，这并不是最优化的情况。

因此，每次与静态网站一起工作时，请确保只使用在“外观”|“菜单”中创建的自定义菜单。这让你可以完全控制在页眉、侧边栏以及网站上的任何其他位置显示的内容。

企业或商业网站

当我们审视企业或商业网站的主要目的时，很明显它们的构建与静态网站非常相似。唯一的区别是它们要大得多（有更多页面和更多内容），并且设计看起来更加正式。此外，大多数企业喜欢发布一些偶尔的公告，因此也需要类似博客的功能（但它仍然不会是网站上的主要元素）。

从本质上讲，使用 WordPress 创建一个高质量的企业的关键是选择（或构建）正确的主题。如果你在网上做一点快速的研究，你会发现大多数企业网站（至少是好的那些）几乎没有任何设计。使它们脱颖而出的东西是他们非常微妙的品牌（通过某种颜色方案或巧妙的标志使用），以及出色的导航布局。

这意味着用 WordPress 构建一个优秀的企业的最简单方法是做以下几步：

• 选择一个简洁的主题，具有良好的内容组织和几乎没有任何设计花哨的功能

• 包含特定的品牌元素并选择正确的颜色方案

• 通过自定义菜单构建一个用户友好的导航结构

• 构建一个自定义的主页

• 添加一个视觉元素，如主页滑块，使网站看起来更生动（可选）

让我们逐个检查这个列表。

选择一个简洁的主题

这是我们之前章节中讨论过的话题，所以让我只指向一些你可以快速获取 WordPress 主题的顶级地方。它们如下：

• 官方目录(wordpress.org/themes/)

• ThemeIsle (themeisle.com/)

• Elegant Themes (www.elegantthemes.com/)

• ThemeForest (themeforest.net/category/wordpress)

需要注意的是，直接浏览主题目录中的与企业相关的部分。例如，在 ThemeForest 上，直接访问themeforest.net/category/wordpress/corporate。这将使选择过程更快。

请记住，如果你在寻找免费的主题，你应该始终从官方目录中获取（我们在第七章中讨论过，选择和安装主题）。

在一个高质量的企业主题中要寻找的功能包括以下：

• 一种简约的设计，让你可以包含品牌元素

• 一种简单的方法来添加标志和其他图形

• 自定义页眉功能

• 支持网站图标（Favicon）

• 响应式布局（这意味着它在台式电脑和手机上都具有相同的吸引力）

• 可定制的侧边栏

• 可定制的布局（例如，全宽，1 侧边栏，2 侧边栏等）

• 多作者支持（通常有很多人同时负责一个企业网站）

• 内置颜色方案可供选择

• 准备好 SEO

• 为主页、联系页面、常见问题解答、优惠、画廊、团队、客户评价、404 错误、作品集等提供自定义页面模板

• 兼容多种浏览器

你的主题不需要做所有这些事情，但这个列表应该是一个很好的基准，用来确定你即将选择的主题在运行企业网站方面的适用性。

品牌元素

从商业角度来看，品牌是可识别网站最重要的参数。因此，请确保公司的标志和企业形象与主题的色彩方案相匹配。此外，正如我在上一节中提到的，一个好的主题应该允许你从预定义的色彩方案中选择。

最后，将标志转换为 favicon 并将其上传到网站上（这可以通过主题内置的 favicon 功能或通过插件完成，例如在wordpress.org/plugins/all-in-one-favicon/可用的 All In One Favicon 插件）。这将使网站在书签菜单中具有额外的可见性（如果访问者选择将其添加到书签的话）。

良好的导航

在构建企业网站时，这可能是最困难的部分，主要是因为我们永远无法确定网站最终将包含多少内容。总有可能我们的导航对于少数几页内容来说太多，而对于数百页内容来说又太少。然而，有一些良好的实践你可以遵循：

• 专注于在页脚提供广泛的菜单。这将确保每位访问者都能在滚动到页面底部时找到他们想要的东西。这可以通过页脚小工具区域轻松实现，每个好的企业主题都应该为你提供。以下截图展示了三星的一个示例：

• 创建一个顶部菜单，只包含几个最重要的页面。有时，只需要四个链接就足够了。例如，以下截图展示了 Home Chef 是如何做到这一点的：

• 创建一个侧边栏菜单，链接到网站的重要区域，例如特定类别、产品、公告或其他普通访问者可能感兴趣的内容。

• 使用面包屑导航：面包屑是展示访问者相对于主页路径的小链接。大多数主题默认提供此功能。最好将它们放置在标题下方。这样，读者可以轻松地回到更通用的页面。以下截图展示了这一点的示例：

• 显示一个可见的搜索字段。许多访问企业网站的人都在寻找特定的信息，所以他们自然会立即开始寻找搜索字段。使他们的生活更轻松是一个非常不错的想法。搜索字段的一个很好的位置是在页眉和主要侧边栏（侧边栏菜单）中，以便有良好的可见性。

定制主页

就像静态网站一样，默认的博客列表很少能成为企业网站的好首页。采用自定义首页始终是更好的策略，并且为我们提供了一个更优化的方式来展示公司、其目标和专业领域。要创建这样的首页，您可以安全地遵循本章前面给出的说明，当时我们正在讨论静态网站。

现在，就像我说的，将默认博客列表作为首页在这里不是一个好的方法。然而，我们仍然应该至少提供与网站博客部分的一些集成。两个最合理的解决方案是，要么在首页的一个可见位置链接到博客列表页面，要么在首页的一个可用小工具区域中包含一个简化的列表作为小工具。

后者可以通过 WordPress 默认提供的“近期文章”小工具来完成（我们在第五章，插件 – 它们是什么以及为什么你需要它们）中介绍了小工具及其使用方法。前者可以按照以下步骤完成：

1. 创建一个新页面（页面 | 添加新页面）并命名为新闻。页面不必包含任何内容。它只需要有一个独特的名称。我建议使用新闻，因为它清楚地表明了正在发生的事情。

2. 导航到设置 | 阅读并设置您的新页面为默认帖子页面，如下面的截图所示：

1. 正如您所看到的，还有一个旧的首页，目前被设置为前台首页；我们将保持它这样。

2. 在顶部菜单（最好是）中放置新博客部分（新闻）的链接。您可以在外观 | 菜单中完成此操作。

3. 现在，如果您导航到您的新新闻页面（例如使用http://yoursite.com/news），您将看到默认的博客列表，公司（或网站的拥有者）可以使用它来发布各种公告，或者他们认为合适的内容。

滑块（可选）

值得讨论的最后一个元素是首页滑块。尽管大多数企业网站不涉及图形，但这个单一的视觉元素经常被添加。动画滑块可以使任何网站看起来更加生动，对访客更具吸引力。对于企业网站，滑块可以展示活动照片、个人公告、产品优惠或联系详情，以及许多其他内容。

一些主题从一开始就内置了滑块功能。如果没有，您始终可以获取一个插件来处理这项工作。唯一的缺点是大多数滑块插件都不是免费的。在免费插件中，我可以指出以下两个，如下所示：

• Master 滑块：wordpress.org/plugins/master-slider/

• Nivo 滑块：wordpress.org/plugins/nivo-slider-lite/

通常，滑块并不是企业网站必须的元素，但它们可能会改善用户体验，所以它们可能值得一试。

一页网站

一页网站是网络世界中的相对较新发明。几年前，网站管理员并不热衷于只用一个页面来构建整个网站。这看起来像是没有足够努力提升网站的存在感。然而，如今，情况已经改变。这不再受到贬低。事实上，单页网站已成为新趋势。

在某种程度上，单页或单一页面网站类似于静态网站。您主要与 WordPress 页面而不是其博客功能一起工作，一旦设置了该页面，它可能会保持较长时间不变——也就是说，它会保持静态。然而，在单页网站上，您只需与一个页面而不是多个页面一起工作。

只为了给您一个关于单页网站外观的一般概述，请访问karol.cc/。这是我的个人网站，我使用它来推广我的自由写作服务，以下截图可以查看：

如您所见，该网站仅由一个页面——主页组成。然而，这个页面上的每个区块都从视觉上与前一个和后一个区块分开。这种视觉分离是单页网站最重要的方面之一。因此，就像许多类型的网站一样，创建一个真正看起来很棒的单一页面网站，就是选择正确的主题——这是您的目标受众会喜欢并欣赏的。在 WordPress 上构建一个出色的单一页面网站的最简单方法就是做以下几步：

• 选择一个明确宣传为单页主题且设计简洁、主页内容区块看起来很棒的主题

• 包含特定的品牌元素并选择合适的配色方案

• 确保准备一些高质量图片，您可以在背景中使用它们

让我们逐个检查这个列表。

选择单页主题

就像大多数其他类别一样，单页主题现在在网上的主题商店中非常受欢迎。寻找它们的最佳地点包括，再次，官方目录(wordpress.org/themes/)、ThemeIsle(themeisle.com/)和 ThemeForest(themeforest.net/category/wordpress)。然而，并非所有这些都提供针对单页主题的专用类别，因此您可能需要使用搜索选项来找到有趣的内容。搜索诸如“单页”或“一页”之类的术语应该会给出很好的结果。

在优质单页主题中要寻找的功能如下：

• 一种让您能够包含品牌元素的最小化设计

• 添加标志和其他图形的简单方法

• 定制页眉功能

• 一个视差滚动选项（背景图像看起来比前景移动得更慢）

• 一个响应式布局（这意味着它在台式电脑和手机上都会同样吸引人）

• 内置配色方案可供选择

• SEO 优化就绪

• 兼容所有浏览器

你的主题包含越多的这些先前的特性，就越好。如果缺少任何东西，你总能找到一个插件来填补空白。毕竟，有插件可以解决所有问题，记得吗？

品牌元素

对于单一页面网站来说，品牌元素尤其重要，因为按照定义，你在线上可利用的空间并不多，所以从这个意义上说，如果网站上只有一页，你需要确保它尽可能与你的品牌和身份相匹配。因此，一个好的主题应该允许你将元素，如自己的标志、社交媒体链接和自定义图形，放置在页眉、页脚和背景等位置。幸运的是，这类特性在现代 WordPress 主题中被认为是标准配置，所以你可能根本不必担心这一点。

高质量图片

单一页面主题的一个主要缺陷是它们通常非常依赖良好的视觉和高质量图片。设计通常是简单且非常简约的，它们的吸引力基于网站背景中使用的图片。不幸的是，找到这样的图片完全取决于你。主题很少附带独特的图片，你将能够在你的网站上使用。

如何获取这些图片？你可以在像www.istockphoto.com/这样的地方购买，这是一个解决方案。但你也可以在像unsplash.com/这样的地方免费获得很多优秀的图片。最后一个解决方案当然是拍摄你自己的照片并在你的网站上使用它们。

作为例子，我将从 WordPress 目录中当前最受欢迎的单一页面主题之一——Hestia（可在wordpress.org/themes/hestia/找到），对其进行一些基本的调整，以展示单一页面主题是如何工作的。

在下载并激活主题（这是标准流程；参见第七章，选择和安装主题，了解如何操作）后，你可以直接前往 WordPress 定制器，在“外观”|“定制”中。你将看到一个大的定制面板。利用它，我可以更改网站上的主要标题、按钮、单个块的外观，以及整个网站背景图片，如下面的屏幕截图所示：

经过一番调整，我最终得到了一个看起来很棒的单一页面网站。您可以在下面的屏幕截图中看到我的最终页眉是什么样的：

当谈到使用 WordPress 启动一个漂亮的单页网站时，基本上就是这样了。这里最引人注目的是，实际上做这件事是多么容易。想象一下，从头开始创建这样东西需要多少时间，或者设置它需要多少成本。WordPress 现在提供的可能性真的是令人难以置信。

摘要

在本章中，我们涵盖了大量的优秀内容。我们首先列出了一些流行的非博客网站类型，您可以使用 WordPress 成功构建这些网站。然后，我们逐一分析了这些网站，并讨论了为了确保最终产品质量需要关注的特定元素。

下一章是我们创建非博客网站指南的第二部分。在这一章中，我们将探讨一些更以用户为中心的网站类型，例如电子商务商店、照片和视频博客，以及最终构建您自己的社交网络。

第十三章：创建非博客网站第二部分 - 电子商务网站和自定义内容元素

在上一章中，你看到了不同类型的非博客网站。本章是这一主题的延续，所以让我们做两件事。首先，让我们回顾一些 WordPress 的更时尚用途，并关注达到出色最终结果的逐步过程。然后，让我们讨论一些你可以在 WordPress 中创建的自定义内容元素，例如自定义文章类型、自定义分类和稍微自定义管理显示的过程。在本章中，我们将研究以下主题：

• 电子商务商店

• 视频博客和照片博客

• 社交网络

• 介绍自定义文章类型

电子商务商店

通常，电子商务商店是任何人都可以浏览多种产品，然后使用购物车进行购买的网站。此外，大多数电子商务商店提供某种在线支付集成，这使得每个访客都可以快速地进行和完成购买。此外，有时甚至还有一个后端库存管理系统（一种在线仓库），这使得后端业务管理更加容易，并与网站集成。

WordPress 是否是电子商务商店的好平台？

电子商务的最好之处在于，你实际上可以使用 WordPress 启动一个功能齐全的在线商店。在我看来，这简直令人难以置信！作为一名前网站开发者，我实际上记得从头开始构建这样一个商店是多么昂贵和耗时。而现在，你只需安装 WordPress，获取合适的主题，下载专门的电子商务插件，就可以开始了！这是一个如何利用技术以现代方式经营业务的绝佳例子。

好的，介绍就到这里。让我们专注于构建一个优质电子商务商店的实际过程。首先，WordPress 上的电子商务商店的特点是它们极其依赖于插件，换句话说。我的意思是，如果你想启动这样一个网站，你需要获取一个主要的电子商务插件，这个插件将负责你在商店中可用的所有操作集合。简而言之，这个插件将运行你的商店。因此，选择正确的插件非常重要，我相信你明白这一点。

获取一个好的电子商务插件

市面上有大量的付费插件。它们提供了大量的功能，并与几乎任何在线支付处理方法集成。但，实际上相当令人惊讶的是，最受欢迎的插件 100%免费。它被称为WooCommerce，并已成为在 WordPress 上运行电子商务商店的事实上的标准。

WooCommerce（可在 woocommerce.com/ 或 wordpress.org/plugins/woocommerce/ 获取）设计精美，并提供真正卓越的功能范围，我将在稍后详细介绍。我喜欢 WooCommerce 插件的主要原因之一是它可以与任何主题集成。我确实是指任何主题。然而，对于现实生活中的商业网站（而不仅仅是即将构建的测试网站），我仍然认为你应该使用一个针对电子商务优化的主题。再次提醒，你可以自由访问流行的主题商店，以获取高质量的产品。我在 第七章，选择和安装主题中列出了一些。

简而言之，一个好的电子商务主题应该实现以下目标：

• 设计清晰

• 以引人注目的方式展示中心内容块（这是产品将要展示的地方）

• 允许你调整你想要显示的侧边栏数量

• 响应式设计（即在任何设备上均可查看）

• 拥有一个良好的导航结构，可以容纳数百甚至数千个子页面（通常是产品页面）

• 处理多语言内容

• 提供一定程度的社交媒体集成（允许用户在 Twitter 或 Facebook 上分享产品链接）

简要总结一下这个介绍，为了在 WordPress 上运行电子商务商店，你需要将 WooCommerce 插件与一个外观漂亮的、针对电子商务网站优化的 WordPress 主题搭配使用。

插件安装和初始设置

现在我们已经选择了插件，请按照以下步骤进行安装和设置：

1. 要获取 WooCommerce，你可以访问 wordpress.org/plugins/woocommerce/，或者在你访问“插件”|“添加新插件”时直接从 wp-admin 面板安装它。

2. 只需在主搜索框中输入 WooCommerce。很可能是列表中的第一个插件就是你想要的。

3. 点击“立即安装”，当过程完成后，激活插件。以下截图显示了之后你会看到的内容：

1. WooCommerce 会展示屏幕设置向导的主页面。它最棒的地方在于，整个过程都是一步一步引导你的。

设置主要商店页面

在你需要做的第一件事中，是创建一些必要的页面，使你的网站能够转变为一个完整的电子商务商店。幸运的是，WooCommerce 会为你处理这些——你只需要点击继续按钮。你将获得以下页面：

• 商店：你的主要商店页面——这是你的产品将要出现的地方

• 购物车：商店的购物车区域

• 结账：顾客可以最终确定订单的区域

• 我的账户：注册顾客的资料页面

你的商店位置

下一步是设置您的商店位置。这相当简单，因为你只需要选择您的商店所在地以及它将使用的货币。此外，如果您将要收取销售税，您也可以在那里设置，如下面的截图所示：

运输和支付

WooCommerce 向导中的下一个屏幕是设置您的运输细节，包括重量和尺寸单位。之后，您可以设置商店将使用的支付方式。您在那里选择的内容取决于您的商店类型和您打算销售的商品类型。以下截图显示了可用的选项：

通常，您至少会想启用 PayPal。

调整您的商店设计

在此过程中的下一步，一个非常重要的步骤，是选择您商店的设计。在这里开始的最佳方式之一是选择官方的 WooCommerce 主题，称为 Storefront。此主题可以通过在 WooCommerce 向导中点击右侧进行安装，如下面的截图所示：

一旦安装了 Storefront，设置过程就完成了，商店完全可用，也就是说，您可以开始添加您的第一个产品。

添加产品

当涉及到产品时，WooCommerce 遵循 WordPress 标准的内容组织方法。这意味着您可以像管理任何其他内容（页面或帖子）一样管理产品。您只需执行以下步骤：

1. 前往“产品”|“添加新商品”并填写商品字段。请注意，商品也有它们自己的类别和标签，如下面的截图所示：

1. 一旦添加了一些产品，下面的截图显示了您的wp-admin面板中的“产品”|“所有产品”部分将看起来是什么样子：

1. 下面的截图显示了商店的主页，展示了所有可供客户购买的产品：

1. 当您查看单个产品时，它们看起来也非常不错。以下截图是一个示例：

统计 – 订单、优惠券和报告

在这里讨论插件最后的一个元素是管理后端 – 订单、优惠券和报告。

订单可以在 WooCommerce | 订单中找到。您可以像管理任何其他 WordPress 内容一样管理它们。不过，有一些额外的字段和参数，所以可能会有一个轻微的学习曲线。但仍然是一个非常友好且易于使用的环境。以下截图显示了订单的示例：

要查看和创建新的优惠券代码，请导航到 WooCommerce | 优惠券。优惠券是吸引新顾客到您商店的好方法。每个人都喜欢便宜货，不是吗？或者，您可以将优惠券代码作为促销手段公开在互联网上。

最后，要查看报告，请导航到 WooCommerce | 报告。这里有一个很好的图形表示您商店发生的情况。您可以查看销售额、使用的优惠券、客户活动和当前库存。目前，我的商店没有太多活动，所以图表看起来如下：

要了解更多关于管理订单和优惠券的信息，请查看 WooCommerce 文档中的这些官方页面：

• docs.woocommerce.com/document/managing-orders/

• docs.woocommerce.com/document/coupon-management/

关于使用 WooCommerce 在 WordPress 上启动一个漂亮的电子商务商店的话题就到这里。最引人注目的是，实际上做起来有多容易。想象一下，从头开始创建具有类似功能的东西需要多少时间。或者，更好的是，设置它所需的成本。如今，WordPress 和各种插件提供的可能性真的是令人难以置信。我相信，在几年前，没有人会相信启动一个高质量的电子商务商店可以这么容易。

最后一点，WooCommerce 并非总是完全免费。如果您想安装附加功能，官方扩展的价格在 29 美元到 99 美元之间。因此，对于一些特定的实际应用，可能需要投资。

我们在这里只是触及了表面，WooCommerce 还有很多功能。这是一款真正令人印象深刻的软件，在提供可靠的电子商务功能方面绝对出色，可以将您原本标准的 WordPress 网站转变为专业的电子商务商店。如果您想了解如何从头开始使用 WooCommerce 建立商店，获取信息的最佳地方可能是docs.woocommerce.com/documentation/plugins/woocommerce/getting-started/的官方文档部分。

视频博客和照片博客

一起探讨这两种 WordPress 网站类型，因为它们各自的目标通常非常相似（尽管它们的设计可能仍然略有不同）。简而言之，视频博客是一种作者主要发布视频，而不是传统基于文本的帖子。另一方面，照片博客基本上是同一件事，唯一的区别在于它围绕照片展开。

现在，当你可以使用标准的 WordPress 安装和传统的博客优化主题时，为什么还要麻烦自己为视频博客或照片博客进行定制设置呢？说实话，你确实可以选择标准设置，你的视频/照片博客将大致上相当不错。但是，如果你投入一些额外的工作（不多）来构建专门针对多媒体博客的东西，你的网站可以在可用性和内容展示方面相对于竞争对手获得很大的优势。

例如，让我们关注以下可以添加到视频博客中的有趣功能：

• 建立在网格布局上的博客主页，具有大缩略图，这样每个访客都可以立即看到视频的快照

• 在主列表中以简洁的块形式展示的视频，包含缩略图和少量文本，以说服人们点击视频

• 宽的主博客列表，左侧（或右侧）仅有一个窄侧边栏

• 集成的社交媒体功能（包括 YouTube 订阅按钮）

• 从视频最初托管平台获取的社交媒体评论

• 在博客（或外部服务器）上托管视频的自定义后端

• 可分享的嵌入代码，这样你的访客可以轻松嵌入视频

• 用于替换原生 YouTube 或 Vimeo 播放器的自定义播放器

在照片博客上，您可以拥有以下有趣的功能：

• 特色的主页，展示一张主要照片（每日一图）

• 主页上的自动照片滑块

• 用于查看全尺寸照片的灯箱功能

• 宽的主博客列表，集成了社交媒体功能

• 社交媒体评论

• 用于托管照片的自定义后端

• 可分享的嵌入代码

• 自定义照片控制（如保存、查看全尺寸、分享等）

如您所见，这些功能中的大多数都可以在视频博客和照片博客上同样良好地工作。像往常一样，您可以通过获取高质量的主题或使用一些第三方插件来获得其中大部分。让我们来探讨这两种方法。

探索视频和照片网站的模板

作为非常受欢迎的博客类型，视频博客和照片博客在互联网上都有非常广泛的主题可供选择。但是，要小心！在 Google 上搜索主题可能会让你陷入麻烦。好吧，也许不是真正的麻烦，但如果最终从某个随机网站下载了一个主题，你无法保证它是一个安全的解决方案，也没有恶意或加密代码。一个更好的方法要么是访问官方目录，要么是访问一些认可的主题商店。

首先，以下主题可供选择：

• Shapely，可在wordpress.org/themes/shapely/找到

• TheMotion Lite，可在wordpress.org/themes/themotion-lite/找到

• RokoPhoto Lite，可在wordpress.org/themes/rokophoto-lite/找到

• Activello，可在wordpress.org/themes/activello/找到

这些都是免费的，但你也可以获得一个高级主题。然而，这需要投资，所以只有在你致力于创建一个真正高质量的多媒体博客时才这样做。

获取视频和照片博客插件

正如我所说，除了视频和照片优化的主题外，你还可以获得许多使你的网站更具功能的插件。好消息是我们将只关注免费插件：

• Optimole (wordpress.org/plugins/optimole-wp/)：这个插件在网站的前端不显示任何特定的输出，因为它实际上在后台自动优化你的图片。这是一个节省带宽的好插件，尤其是如果你发布了很多图片。安装过程相当标准。一旦插件被激活，并且你提供了免费的 API 密钥，它就会在后台自动工作，无需监督。

• Simple Lightbox (wordpress.org/plugins/simple-lightbox/)：这个插件提供了非常漂亮的灯箱功能。这个插件最好的地方是它极其容易使用。你只需要激活它，它就会立即开始处理你在博客上显示的图片。插件会拦截图片点击，并在一个漂亮的灯箱中显示图片文件，而不是单独加载它们（在空白页上）。

• Envira Gallery (wordpress.org/plugins/envira-gallery-lite/)：这是 WordPress 最受欢迎的画廊插件之一。它允许你创建响应式（针对桌面和移动设备优化）的图片和视频画廊。它的好处是你可以通过拖放来构建你的画廊。

• 10Web Instagram Feed (wordpress.org/plugins/wd-instagram-feed/)：Instagram 现在是任何摄影师或视频制作者在网上的重要组成部分。这个插件为你提供了快速集成到大家最喜欢的照片平台。使用它来展示你的 Instagram 动态作为小工具。

总结一下多媒体博客的主题，我必须指出，在主题和插件开发者中，这是一个非常拥挤的领域。这里提到的插件将为您提供一个良好的起点，但保持对市场新动态的关注（即，酷炫的新插件和主题），实际上是将您的照片或视频博客保持在竞争前沿的最佳方式。话虽如此，测试每一个新插件并不是推荐的方法。然而，时不时地，您可能会发现一个真正的宝藏，这将帮助您将博客提升到新的水平。

社交网络

最后，是时候讨论与使用 WordPress 构建各种类型网站相关的一个最令人惊讶的话题了。事实证明，该平台非常适合运行一个功能齐全的社交网络。换句话说，如果您想拥有自己的 Facebook，至少在功能上是可以的。

说到功能，简而言之，使用 WordPress 构建的社交网络可以提供以下功能：

• 支持任意数量的用户账户

• 为用户提供类似 Facebook 的发布方法（一个墙或活动流）

• 论坛

• 博客和微型博客

• 朋友

• 群组

• 私信

• 评论

• 照片和视频内容

话虽如此，构建并运行一个结构良好的社交网络，利用所有可用功能，将需要一些严肃的工作。这超出了本书的范围。因此，在这里，我们只关注基本设置过程和入门。如果您计划推出一个真正的社交网络并将其推向世界，您可能需要获取更多信息，无论是通过访问官方在线文档，还是获取更多关于该主题的出版物。

实际上，在 WordPress 上进行的社交网络是通过一个特定的插件——BuddyPress来实现的，尽管仅仅称它为一个插件是极大的低估。BuddyPress 是一个独立的在线发布环境，它与 WordPress 集成。与其他插件不同，它不仅仅在这里和那里显示一些自定义内容。它实际上改变了您 WordPress 站点的整体外观（结构），使其看起来和运行起来就像一个社交网络。

让我们一步一步来，从安装开始。

安装社交网络

这里没有太多花哨的东西，要安装一个社交网络，您只需执行以下步骤：

1. 前往buddypress.org/，下载主插件并将其上传到您的 WordPress 站点，或者从wp-admin面板（插件 | 添加新插件）中搜索名为BuddyPress的插件。

2. 插件的安装过程本身相当标准，这意味着在您的服务器上安装后，您只需点击激活按钮。

3. 当过程完成后，访问设置部分下的“设置 | BuddyPress”。首先，选择您想在新的社交网络中使用的组件。出于测试目的，我只启用了所有组件，如下面的截图所示：

1. 在此设置页面的第二个标签页，标题为“选项”，您可以在其中调整一些其他标准设置，例如顶部工具栏的存在、各种配置文件设置和分组设置。

2. 最后，第三个标签页“页面”，让您可以分配将容纳您社交网络一些标准区域的页面，例如活动流、用户组和成员资料。

您可以在此处创建新页面或使用 BuddyPress 在安装期间已创建的页面。

设计您的社交网络

在当前形式下，BuddyPress 可以与任何 WordPress 主题一起使用。没错，如果您不想有优化的社交网络设计，您不必这么做。BuddyPress 将设法在其当前主题的主要内容块或您可用的小工具区域中显示其内容。

然而，像往常一样，如果您想使您的社交网络看起来更专业，那么您可能需要四处寻找专门针对社交网络优化的东西。在我看来，当您在寻找这样的主题时，最好的经验法则是将它们与最大的社交网络——Facebook 进行比较。尽管有些人不喜欢 Facebook 提供的设计，但它仍然是周围最成功的社交网络，所以他们显然做对了某件事。因此，将其作为某种基准是非常好的主意。

如果您想找到一个不错的 BuddyPress 兼容主题列表，WordPress 目录再次伸出援手。当您访问wordpress.org/themes/search/buddypress/时，您将找到一个经过 BuddyPress 测试并优化为社交网络的主题过滤列表。

一旦您找到了一个看起来不错的主题，您可以直接开始使用您的新社交网络，而无需再关注设置。然而，如果您真的想了解这个平台及其构建方式，我建议您查看官方文档，这是最好的 BuddyPress 资源之一（codex.buddypress.org/）。这也是您可以学习所有关于 BuddyPress 开发、创建自己的主题或甚至 BuddyPress 扩展插件的所有细节的地方。

扩展功能

BuddyPress 是以一种提供基本社交网络功能和网站组织方式的方式构建的。如果你想扩展你的社交媒体网站并添加一些新功能，你可以安装多个 BuddyPress 插件。你可以在wordpress.org/plugins/search/buddypress/找到它们。基本上，它们就像其他 WordPress 插件一样（安装过程相同），但它们不像其他 WordPress 插件那样向 WordPress 本身提供新功能，而是更多地关注 BuddyPress。

BuddyPress 中还有更多等待你去探索，我实际上鼓励你自己进行一些研究和学习，尤其是如果你计划在某个时候推出一个社交网络的话。但就目前而言，我认为我们已经涵盖了这个话题，至少当我们谈到用 WordPress 介绍社交网络并开始使用最好的社交网络插件时。

介绍自定义文章类型

在构建当前章节和上一章节中描述的一些网站时，你可能会遇到所谓的自定义文章类型。或者，你甚至可能决定为了你个人的项目而自己创建它们。但让我们从头开始。在 WordPress 中最常见的两种内容类型是 文章 和 页面。然而，如果我们觉得情况/项目需要的话，我们可以利用自定义文章类型的功能和其广泛的通用性来创建任意数量的新文章类型。

自定义文章类型的需求可能出现在许多场景中。例如，当一位作家正在构建个人作品集网站时，他们可能需要一个名为 book 的自定义文章类型来以吸引人的方式展示他们的出版物，而不是仅仅使用标准文章。这正是我们将在本章的这一部分所做的事情。所以，准备好学习如何通过构建一个新的自定义文章类型来了解自定义文章类型的工作原理。

为了这个目的，我们将回到我们的主要烹饪博客主题——Daily Cooking Custom。在其默认形式中，它没有特色任何自定义文章类型，这是一个好事，因为我们有一个空白画布可以工作。要指定你希望在主题中有一个自定义文章类型，你可以在主题的 functions.php 文件中添加一些代码。这就是我们将要做的。然而，请记住，如果你不想将自定义文章类型与特定主题绑定，你也可以将其附加到插件或小工具上。

注册一个新的文章类型

要注册一个新的文章类型，你只需要在你的主题的 functions.php 文件中添加一些简单的代码。将新类型的创建与主题的 init 函数关联起来是一个好的实践，这样它就会在启动过程中在正确的时刻被调用。以下是一个初始的、空的、自定义文章类型的代码：

function book_init() { 
  register_post_type('book'); 
} 
add_action('init', 'book_init');

register_post_type()函数将其第二个参数接受为一个数组，在该数组中，您可以指定对象是否公开或应该参与 URL 重写，它在其编辑页面上支持哪些元素，等等。让我们设置一个包含所有参数的数组，然后将它传递给函数，如下面的代码所示：

function book_init() { 
  $args = array( 
    'description' => 'A custom post type that holds my books', 
    'public' => true, 
    'rewrite' => array('slug' => 'books'), 
    'has_archive' => true, 
    'supports' => array('title', 'editor', 'author', 'excerpt', 
    'custom-fields', 'thumbnail'),
    'show_in_rest' => true  
  );
  register_post_type('book', $args);  
  flush_rewrite_rules(); 
} 
add_action('init', 'book_init');

我选择了以下每个参数，因为它们对于book自定义帖子类型是有意义的：

• description：这个参数相当直观。

• public：这意味着帖子类型是公开的，就像帖子页面一样——而不是在幕后隐藏。它将获得用户界面，可以在导航菜单中显示，等等。

• rewrite：这指定了帖子类型可以在漂亮的永久链接的重写规则中使用。

• has_archive：这启用了帖子类型存档（一个经典的索引页面，就像我们为标准帖子所拥有的那样）。

• supports：这是一个数组，当用户创建或编辑项目时，他们会看到这些功能。对于书籍，我们包括六个项目。

• show_in_rest：这使我们的新自定义帖子类型能够与 WordPress 5 中引入的块编辑器一起工作。

最后一个函数调用flush_rewrite_rules()将允许我们在稍后显示书籍的标准存档列表（就像标准帖子列表一样，但针对我们的自定义帖子类型）。

这些只是您可以传递的一些参数。关于其他参数的详细信息，请参阅 codex 中的codex.wordpress.org/Function_Reference/register_post_type。

现在我们已经设置了基本帖子类型，让我们添加一些标签。

添加标签

您可以为您的自定义帖子类型添加标签，这样 WordPress 在谈论它时就会知道说什么。首先，让我们简单地创建一个包含所有标签的数组。将此作为book_init()函数中的第一件事，如下面的代码所示：

$labels = array( 
  'name' => 'Books', 
  'singular_name' => 'Book', 
  'add_new' => 'Add New', 
  'add_new_item' => 'Add New Book', 
  'edit_item' => 'Edit Book', 
  'new_item' => 'New Book', 
  'view_item' => 'View Book', 
  'search_items' => 'Search Books', 
  'not_found' =>  'No books found', 
  'not_found_in_trash' => 'No books found in Trash' 
);

然后，在$args数组中添加一行代码，告诉它使用标签，如下面的代码片段所示：

$args = array( 
  'labels' => $labels, 
  'description' => 'A custom post type that holds my books', 
/* the rest of the function remains the same */

下一步是添加消息，这是 WordPress 在用户使用书籍功能时告诉用户的内容。

添加消息

当用户更新、预览或对书籍进行任何操作时，您希望他们看到准确的消息。我们只需要创建一个消息数组并将它们钩接到 WordPress 上，如下面的代码所示：

function book_updated_messages( $messages ) { 
  $messages['book'] = array( 
    '', /* Unused. Messages start at index 1\. */  
    sprintf('Book updated. <a href="%s">View book</a>', 
    esc_url(get_permalink($post_ID))),  
    'Custom field updated.',  
    'Custom field deleted.',  
    'Book updated.',  
    (isset($_GET['revision']) ? 
    sprintf('Book restored to revision from %s', 
    wp_post_revision_title((int)$_GET['revision'], false)) : false), 
    print('Book published. <a href="%s">View book</a>', 
    esc_url(get_permalink($post_ID))),  
    'Book saved.',  
    sprintf('Book submitted. <a target="_blank" href="%s">
    Preview book</a>', 
    esc_url(add_query_arg('preview', 'true', 
    get_permalink($post_ID)))), 
    sprintf('Book scheduled for: <strong>%1$s</strong>. 
    <a target="_blank" 
    href="%2$s">Preview book</a>', 
    date_i18n('M j, Y @ G:i', strtotime($post-
    >post_date)), esc_url(get_permalink($post_ID))), 
    sprintf('Book draft updated. <a target="_blank" href="%s">
    Preview book</a>', 
    esc_url(add_query_arg('preview', 'true', get_permalink($post_ID))))
  ); 
  return $messages; 
} 
add_filter('post_updated_messages', 'book_updated_messages');

此代码创建了一个名为book_updated_messages()的函数，它设置了一个消息数组并返回它。我们通过post_updated_messages过滤器调用它。

现在，我们的自定义帖子类型已经准备好使用了！前往你的wp-admin面板并重新加载它。你会看到在评论下出现了一个新的菜单。它被称为书籍。让我们添加一本书，如下面的截图所示：

注意，我给它添加了一个名为book_author的自定义字段，我还上传了书籍封面作为特色图片。现在，当你访问主书籍页面时，你会看到书籍被列出。如果你点击书籍标题下的“查看”链接，你会看到书籍使用single.php主题模板显示，这不会是最适合读者的体验。因此，让我们创建一些新的模板文件来展示我们的书籍。

创建书籍模板文件

WordPress 需要知道如何显示你的新帖子类型。你必须为单个书籍创建一个模板，并为书籍列表创建一个模板。执行以下步骤来完成此操作：

1. 首先，我们将创建一个single.php的书籍版本。它必须命名为single-POST_TYPE_NAME.php，在我们的例子中是single-book.php。

2. 以page.php作为起点（因为它已经是最接近我们想要的书籍页面外观的），我们将添加自定义字段book_author和特色图片的显示。

3. 因此，让我们首先复制我们的page.php文件，将其重命名为single-book.php。同时，让我们复制content-page.php并将其命名为content-book.php。

4. 接下来，是包含所有元素的时候了。以下是这两个文件的外观。首先，single-book.php看起来如下：

<?php 
/** 
 * The template for displaying a single book. 
 * 
 * @package Daily Cooking Custom 
 */ 
?><?php get_header(); ?> 

<div id="primary" class="content-area"> 
  <main id="main" class="site-main" role="main"> 
    <?php while (have_posts()) : the_post(); ?> 

      <?php get_template_part('content', 'book'); ?> 

    <?php endwhile; // end of the loop. ?> 

  </main><!-- #main --> 
</div><!-- #primary --> 

<?php get_sidebar(); ?> 
<?php get_footer(); ?>

对此文件所做的唯一更改是get_template_part()函数调用。

1. 接下来，content-book.php文件看起来如下：

<?php 
/** 
 * The template used for displaying book content 
 * 
 * @package Daily Cooking Custom 
 */ 
?> 

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> 
  <header class="entry-header"> 
    <?php the_title('<h1 class="entry-title">', '</h1>'); ?> 
  </header> 

  <div class="entry-content"> 
    <?php if(has_post_thumbnail()) : ?> 
      <div class="post-image alignleft">
      <?php echo get_the_post_thumbnail($post->ID, 'medium', 
      array('style' => 'border: 1px solid black;')); ?></div> 
    <?php endif; ?> 
    <?php the_content(); ?> 
  </div> 

  <footer class="entry-footer"> 
  </footer> 
</article><!-- #post-## -->

1. 现在，让我们将我们的自定义字段book_author显示在特色图片下方。我们可以通过在特色图片代码和主要内容代码之间添加一行新代码来实现，如下面的代码片段所示：

<?php if(has_post_thumbnail()) : ?> 
  <div class="post-image alignleft">
  <?php echo get_the_post_thumbnail($post->ID, 'medium', 
  array('style' => 'border: 1px solid black;')); ?></div> 
<?php endif; ?> 
<?php echo '<p><em>by '.get_post_meta($post->ID, 'book_author', true).
'</em></p>'; ?> 
<?php the_content(); ?>

1. 在这一点上，当你访问单个书籍页面时，会显示作者的名字，并且书籍封面会自动显示，如下面的截图所示：

1. 我们接下来的任务是创建一个页面，用于展示书籍列表，就像index.php对帖子所做的处理一样。默认情况下，WordPress 使用archive.php文件来展示每个新自定义帖子类型的列表。

我们可以通过创建一个新的模板文件并将其命名为archive-book.php来自定义它。更准确地说，每个控制任何新自定义帖子类型存档的模板文件都必须命名为archive-POST_TYPE.php。创建此类文件的最简单方法是将标准的archive.php文件或index.php文件复制一份，并将其重命名为archive-book.php。然后，我们可以从那里开始修改文件以符合我们的要求。所以，我打算在这里使用我的index.php作为模板，并对其进行一些调整。

1. 目前，我的新archive-book.php文件没有提供任何自定义显示书籍的方式。它的样子如下所示：

<?php 
/** 
 * The listing of books. 
 * 
 * @package Daily Cooking Custom 
 */ 
?><?php get_header(); ?> 

  <div id="primary" class="content-area"> 
    <main id="main" class="site-main" role="main"> 

    <?php if (have_posts()) : ?> 

      <?php /* Start the Loop */ ?> 
      <?php while (have_posts()) : the_post(); ?> 
      <?php get_template_part('listing', 'book'); ?> 
      <?php endwhile; ?> 

      <?php daily_cooking_custom_paging_nav(); ?> 

    <?php else : ?> 

      <?php get_template_part('content', 'none'); ?> 

    <?php endif; ?> 

    </main><!-- #main --> 
  </div><!-- #primary --> 

<?php get_sidebar(); ?> 
<?php get_footer(); ?>

1. 如您所见，实际的显示是通过get_template_part('listing', 'book')函数调用完成的。为了使这一行工作，我们必须创建实际的列表文件。最简单的方法是复制content.php并稍作修改。首先，将其重命名为listing-book.php。

2. 立即删除不必要的部分，只留下那些可以使我们的书籍列表看起来很棒的部分。

3. 接下来，我还会包括缩略图显示。坦白说，我并不需要这样做，但我相信带有较小缩略图的书籍列表会看起来更好。

4. 最后，我还会显示每本书的作者。以下代码显示了完成后的文件将如何显示：

<?php 
/** 
 * @package Daily Cooking Custom 
 */ 
?> 
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> 
  <header class="entry-header"> 
    <?php the_title(sprintf('<h1 class="entry-title">"<a href="%s"  
    rel="bookmark">', esc_url(get_permalink())), '</a>"</h1>'); ?> 
  </header> 

  <div class="entry-content"> 
    <?php if(has_post_thumbnail()) : ?> 
      <div class="post-image alignleft"> 
        <?php echo '<a href="'.esc_url(get_permalink()).'" 
        >'.get_the_post_thumbnail($post->ID, 'thumbnail').'</a>'; ?> 
      </div> 
    <?php endif; ?> 

    <div class="entry clearfix"> 
      <p><em>by <?php echo get_post_meta($post->ID,
      'book_author', true); ?>
      </em></p> 
      <?php the_content(sprintf(__('Continue reading %s 
      <span class="meta-nav">&rarr;</span>', 'daily-cooking-custom'), 
      the_title('<span class="screen-reader-text">"', 
      '"</span>', false))); 
      ?> 
    </div> 
  </div> 

  <footer class="entry-footer"> 
  </footer> 
</article><!-- #post-## -->

1. 以下截图显示了最终效果（我添加了一本书只是为了演示目的）：

注册和使用自定义分类法

只是为了跟随之前给出的关于我们书籍自定义帖子类型的示例，现在让我们创建一个自定义分类法。为什么？您可能只是不想混合书籍类别和帖子类别，因此我们将创建一个名为“书籍类别”的自定义分类法。将以下代码添加到您的functions.php文件中：

function build_taxonomies() { 
  register_taxonomy( 
    'book_category', 
    'book', 
    array( 
      'hierarchical' => true, 
      'public' => true, 
      'show_in_rest' => true, 
      'label' => 'Book Category', 
      'query_var' => true, 
      'rewrite' => array('slug' => 'available-books') 
    ) 
  ); 
} 
add_action('init', 'build_taxonomies', 0);

与register_post_type()函数类似，register_taxonomy()函数允许您在 WordPress 中注册一个新的分类法。您可以在 codex 中查看您可以添加的所有参数的详细信息（codex.wordpress.org/Function_Reference/register_taxonomy）。现在，您可以看到我们将其称为book_category；它属于book对象类型，是分层的，您也可以查询它。它需要在带有自定义短语的 URL 重写中包含，即available-books。

接下来，我们需要使这个分类法对书籍可用。只需找到我们在注册书籍帖子类型时使用的$args数组（book_init()函数），并将taxonomies项添加到数组中，如下面的代码所示：

$args = array( 
  'labels' => $labels, 
  'description' => 'A custom post type that holds my books', 
  'public' => true, 
  'rewrite' => array('slug' => 'books'), 
  'has_archive' => true, 
  'taxonomies' => array('book_category'), 
  'supports' => array('title', 'editor', 'author', 'excerpt', 
  'custom-fields', 'thumbnail') 
);

当您返回到wp-admin面板并编辑一本书时，您会看到书籍类别已出现在右侧，如下面的截图所示：

在您添加了一些类别并将它们分配给书籍之后，让我们来看看如何在网站首页显示这些类别。首先，我们将它们添加到单本书籍的显示中。打开content-book.php文件，在循环中的适当位置添加以下代码（例如，您可以在the_content()函数调用之后添加）：

<div class="entry-content"> 
  <?php if(has_post_thumbnail()) : ?> 
    <div class="post-image alignleft">
    <?php echo get_the_post_thumbnail($post->ID, 'medium', 
    array('style' => 'border: 1px solid black;')); ?></div> 
  <?php endif; ?> 
  <?php echo '<p><em>by '.get_post_meta($post->ID, 
  'book_author', true).
  '</em></p>'; ?> 
  <?php the_content(); ?> 
  <?php echo get_the_term_list($post->ID, 'book_category', 
  '<em>Categories: ', ', ', '</em>'); ?> 
</div>

您正在使用get_the_term_list()函数，它接受以下参数：

• 帖子的 ID（$post->ID）

• 分类法的名称（book_category）

• 在列表之前打印（<em>类别：）

• 在列表中使用（,）分隔项目

• 在列表之后打印（</em>）

此外，现在您有了分类，您可以去“外观”|“菜单”，将那些分类链接添加到您的页眉菜单中，您还可以创建一个包含所有分类的自定义菜单并将其添加到侧边栏之一。

如果在创建自定义文章类型和自定义分类法的过程中，您认为不应该出现 404 错误，那么请转到“设置”|“永久链接”，只需保存更改而不实际更改任何内容。有时，WordPress 需要刷新永久链接才能使新链接正确工作。

自定义管理显示

要完全实现您的新书自定义文章类型，您可以在wp-admin面板中更改其显示方式。您不需要知道创建特定书籍的 WordPress 用户，但您希望看到书籍分类和缩略图。让我们回到functions.php。首先，我们将更改显示的列，如下面的代码所示：

function ahskk_custom_columns($defaults) { 
  global $wp_query, $pagenow; 
  if ($pagenow == 'edit.php') { 
    unset($defaults['author']); 
    unset($defaults['categories']); 
    unset($defaults['date']); 
    $defaults['book_category'] = 'Categories'; 
    $defaults['thumbnail'] = 'Image'; 
  } 
  return $defaults; 
} 
add_filter('manage_book_posts_columns', 'ahskk_custom_columns'); 
function ahskk_show_columns($name) { 
  global $post; 
  switch ($name) { 
    case 'book_category': 
      echo get_the_term_list($post->ID, 'book_category', '', ', ', ''); 
      break; 
    case 'thumbnail': 
      if (has_post_thumbnail($post->ID)) 
        echo get_the_post_thumbnail($post->ID, array('40', '40')); 
      break; 
  } 
} 
add_action('manage_book_posts_custom_column', 'ahskk_show_columns');

第一个函数表示“不显示作者、日期和分类，但显示书籍分类和缩略图”，第二个函数表示“对于书籍分类列，打印分类列表，对于缩略图列，打印get_post_thumbnail()函数。”

再次查看wp-admin面板中的“书籍”页面，现在看起来如下截图所示：

摘要

本章是我们使用 WordPress 的非博客网站之旅的第二部分。希望您喜欢这些材料。我们经历了设置电子商务网站、视频博客、照片博客和社交网络的全过程。在这个过程中，我们仔细研究了几个有趣的插件及其功能，以便让 WordPress 开发者们的生活更加轻松。最后，我们创建了一个自定义文章类型及其相应的自定义分类法。

我相信，到这一点，您已经具备了使用 WordPress 并用它来构建您下一个伟大网站的能力！WordPress 是一个顶级的内容管理系统（CMS），在过去的几年里已经得到了极大的成熟。WordPress 的管理面板设计得非常用户友好，并且一直在不断改进。WordPress 背后的代码非常健壮，是由一群热心的开发者共同创作的。此外，WordPress 的功能可以通过插件和主题的扩展来增强。

我希望您喜欢这本书中的信息，并且您已经开始着手构建您下一个（或者可能是第一个）WordPress 网站。请确保与 WordPress 开源社区保持联系！感谢您的阅读；您太棒了！