指南：WordPress 子主题开发

WordPress 开发人员开始使用子主题的原因有很多。它们使您有机会在另一个现有主题之上自定义独特的布局。这非常适合想要尝试构建自己的主题的初学者。

此外，许多高级设计会随着时间的推移发布新的更新。如果您正在对核心主题文件进行更改，则在执行更新时它们将被覆盖，但子主题是分开的并且整齐地隐藏起来。这意味着您可以构建现有的高级主题并在此过程中节省大量时间。

在本指南中，我想介绍构建 WordPress 子主题的基本概念以及为什么它是个好主意。

入门

儿童主题并不像看起来那么难。使用父主题的好处意味着您不需要从头开始编写所有 HTML/CSS。子主题将自动使用您包含的任何模板文件，例如sidebar.php或footer.php. 但如果它们丢失了，那么您的子主题将从其父主题中提取相同的文件。

此功能为自定义现有模板提供了极大的自由度。它还非常适合为特殊活动修饰网站周围的区域，例如为圣诞节或新年添加设计模式。

您需要的文件

您只需要一个 .css 样式表即可在 WordPress 中设置子主题。您还需要在/wp-content/themes文件夹中创建一个新目录来存放您的子主题。请注意，您不是在父主题中创建此文件夹，而是在同一主题目录中与它一起创建。

开发人员通常会将 functions.php 和 screenshot.png 包含在与新 CSS 文件相同的文件夹中。屏幕截图显示在您的 WordPress 管理面板中，功能主题文件可用于大量后端更改。

但现在我们应该关注主要的样式表。这通常命名为style.css并包含一个带有关键元信息的注释标题。这很重要，因为如果包含父目录名称，您的主题只会显示为子主题。下面是一个标题注释示例：

1个
2个
3个
4个
5个
6个
7
8个
9

/*
Theme Name:   Twenty Eleven Child
Theme URI:   http: //example.com/
Description:  Child theme for the Twenty Eleven design
Author:     Jake Rocheleau
Author URI:   http: //www.hongkiat.com/blog/
Template:    twentyeleven
Version:    0.1
*/

template的值应该是伴随的父主题的目录名称。除此之外，所有其他标签都应该是标准 WordPress 主题所熟悉的。

虽然将使用所有父 PHP 模板，但不会自动导入原始父级的 style.css 。如果您想处理原始样式，您必须将其包含在您孩子的 style.css 文档的顶部。下面是一个包含 WP Twenty Eleven 主题的示例。

@import url("../twentyeleven/style.css");

设置新样式

将 CSS 规则应用于您的主题与编辑原始主题一样简单。如果您知道需要定位哪些元素，那么请在您自己的子主题中使用相同的选择器。

我们可以通过对链接和段落进行一些非常简单的更改来进行演示。我使用了原始二十一主题中的代码来定位不同的元素。有时需要使用更具体的选择器来覆盖旧设计。

body {
  padding: 0 1.4em;
}
#page {
  margin: 1.667em auto;
  max-width: 900px;
}
 
a {
  color: #5281df;
  text-decoration: none;
  font-family: Calibri, Tahoma, Arial, sans-serif;
}
a:focus,
a:active,
a:hover {
  text-decoration: underline;
}

在这些更改中，我减小了整体尺寸并从边缘移除了一些填充物。所有这些选择器都可以在原始 .css 文档中找到。值得注意的是，我还更改了所有锚链接的一些属性，其中包括不同的字体堆栈和颜色选择。

重要的事情

CSS 有一个特殊的声明来标记优先于其他样式。语法显示为!important以感叹号开头并在 CSS 属性的末尾终止。如果您有来自父主题的级联样式覆盖您自己的自定义规则，则这是必要的。

1个
2个
3个
4个
5个

a {
  color: #5281df !important;
  text-decoration: none;
  font-family: Calibri, Tahoma, Arial, sans-serif;
}

上面我复制了我的原始更改并用一个重要的条款编辑了锚文本颜色。这将优先于具有相同选择器深度的所有其他样式。更多定义的元素（例如#access li:hover > a）通常会保留自己的样式，除非color仍然继承自我们的原始选择器。在这种情况下，我们的父主题不会在锚链接上设置 font-family 属性，因此我们不会遇到任何继承问题。

如果您无法坚持更改，请尝试在您的财产声明末尾弹出这些重要标记之一。这并不是对所有继承问题的完美解决方案，但它确实比您想象的更频繁地派上用场。

克隆函数.php

与主样式表不同，您的子主题将自动导入其父主题的功能。这意味着您无需复制任何 PHP 代码即可使其在您的新主题中保持活动状态。然而，如果您想重新定义一些函数，您可以构建另一个 functions.php 并在您的新代码中写入任何更改。

作为示例，我构建了一个函数，该函数在模板启动时解析一些 JavaScript 文件。这将删除所有旧版本的 jQuery 和 SWFObject 脚本，同时将最新版本添加到该wp_head区域。

// queue js files for load
function mytheme_js() 
{
 if (is_admin()) return;
 
 wp_deregister_script('jquery');
 wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js');
 wp_enqueue_script('jquery');
 
 wp_deregister_script('swfobject');
 wp_register_script('swfobject', 'http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js');
 wp_enqueue_script('swfobject');
}
add_action('init', mytheme_js);

我应该指出，如果您从父 functions.php 导入代码，那么您将不得不使用不同的函数名称。否则 PHP 将给出一个致命错误，你将不得不通过 FTP 连接到服务器来修复错误。

使用主题文件

最广泛的主题类别是构建自定义布局和页面类型。默认情况下，您的子主题将继承其父主题的所有文件。但是您可以选择创建新的子主题文件，WP 会将这些文件注册为“主要”模板。

例如archive.php和index.php分别用于显示帖子存档和主页屏幕。如果您想进行需要编辑 HTML 的更改，那么克隆父文件并在子主题目录中编辑它们会更安全。

自定义页面模板

在我们谈论模板文件的同时，我还想介绍一个许多人不熟悉的 WordPress 功能。您可以构建页面和帖子模板，在创建新内容时可以从管理面板中选择这些模板。即使父主题没有新的自定义模板文件，WordPress 仍会使用子主题代替page.php或single.php。

首先创建一个名为 page-offer.php 的新文件。这将是一个“特别优惠”促销页面，其主题不同于所有其他页面。在这里，您可以复制原始页面代码，甚至可以完全从头开始构建主题。我们需要让 WordPress 知道这个新模板的唯一代码是 PHP 中的评论设置。

1个
2个
3个
4个
5个
6个

<?php 
/** 
 * Template Name: Offer
 */
 
?>

此方法的另一种替代方法是构建以唯一 ID 号命名的自定义页面。因此，您可以创建一个文件，例如author-ID.php ，而不是为作者页面加载默认的archive.php ，其中 ID 是用户唯一的 WordPress ID 号。尽管此系统更费力，因为您需要为站点上的每位作者创建一个新的模板文件。

如果您可以将这两种技术与其他模板文件结合使用，它将变得更加有用。值得注意的是，类别和标签使用它们自己的主题文件效果很好。此外，如果您链接到内容中的附件，那么您将需要考虑每种 mime 类型的不同可能模板布局。我在下面包含了一个简单的 JPEG 图像附件的模板层次结构：

图片.php
jpeg文件
图片_jpeg.php
附件.php

其他资源

除了本指南中的所有提示外，我还想为主题开发人员分享一组重要链接。已经有很多很棒的文章和免费的儿童主题，您可以查看以更深入地研究这个主题。我在下面添加了这些资源的精彩集合：

结论

我希望在阅读本文后，构建 WordPress 子主题的过程对您来说更加清晰。我试图解释子主题如何从父主题继承 CSS 和 PHP 模板。此外，操作特定文件和创建您自己的独特主题也非常简单。

WordPress 3.0 版本为子主题提供了更多集成支持。现在是进入 WP 开发的大好时机。在您自己的网站上尝试这些技巧，看看您是否可以构建一个互补的子主题。此外，如果您过去构建过任何出色的儿童主题，我们很乐意检查它们。请在评论区告诉我们您的想法和建议。