zh-cn: 子主题 -wordpress-Wood Chen

zh-cn:子主题

Languages: English • Themes 日本語 Français • 中文(简体) • (Add your language)

WordPress 子主题也是一个主题，它继承了另一个主题——父主题——的功能，并允许你对父主题的功能进行修改，或者添加新功能。本文将说明如何创建一个基本的子主题并解释您能用它来干什么。本文将使用 WordPress 3.0 的默认主题 Twenty Ten 作为父主题进行举例说明。

创建一个子主题是很简单的。创建一个目录，将格式编写正确的 style.css 文件放进去，一个子主题就做成了！只需要对 HTML 和 CSS 具有基本的了解，您就可以通过创建一个非常基本的子主题 来对一个父主题的样式和布局进行修改和扩展，而不需要对父主题的文件作任何修改。通过这样的方式，当父主题被更新的时候，您所做的修改就可以保存下来。

因为这个原因，我们强烈推荐您使用子主题的方式来对主题进行修改。

如果您对 PHP， WordPress Templates，和 WordPress Plugin API有个基本的理解，理论上来讲，您可以使用子主题对父主题的每一个方面进行扩展，而不需要对父主题的文件进行任何修改。

目录结构

子主题放在 wp-content/themes 目录下属于自己的目录里。下面的结构显示的就是子主题和它的父主题（Twenty Ten）在典型的 WordPress 目录结构中的位置：

public_htmlwp-contentthemes (主题存放的目录)twentyten (示例中父主题 Twenty Ten 的目录)twentyten-child (子主题存放的目录，可以任意命名)style.css (子主题中不可或缺的文件，文件名必需为 style.css)

这个文件夹里面可以少至只包含一个 style.css 文件，也可以包含多至一个完整 WordPress 主题所拥有的文件：

style.css (必需)
functions.php (可选)
Template files (可选)
Other files (可选)

让我们看看它们是如何起作用的。

必需的 style.css 文件

style.css 是一个子主题唯一必须的文件。它的头部提供的信息让 WordPress 辨认出子主题，并且重写父主题中的 style.css 文件。

对于任何 WordPress 主题，头部信息必须位于文件的顶端，唯一的区别就是子主题中的 Template:行是必须的，因为它让 WordPress 知道子主题的父主题是什么。

下面是一个 style.css 文件的头部信息的示例：

/*Theme Name:     Twenty Ten ChildTheme URI:      http: //example.com/Description:    Child theme for the Twenty Ten theme Author:         Your name hereAuthor URI:     http: //example.com/about/Template:       twentytenVersion:        0.1.0*/

复制代码

逐行的简单解释：

Theme Name. (必需) 子主题的名称。
Theme URI. (可选) 子主题的主页。
Description. (可选) 子主题的描述。比如：我的第一个子主题，真棒！
Author URI. (可选) 作者主页。
Author. (optional) 作者的名字。
Template. (必需) 父主题的目录名，区别大小写。 注意： 当你更改子主题名字时，要先换成别的主题。
Version. (可选) 子主题的版本。比如：0.1，1.0，等。

*/ 这个关闭标记的后面部分，就会按照一个常规的样式表文件一样生效，你可以把你想对 WordPress 应用的样式规则都写在它的后面。

要注意的是，子主题的样式表会替换父主题的样式表而生效。（事实上 WordPress 根本就不会载入父主题的样式表。）所以，如果你想简单地改变父主题中的一些样式和结构——而不是从头开始制作新主题——你必须明确的导入父主题的样式表，然后对它进行修改。下面的例子告诉你如何使用 @import 规则完成这个。

一个子主题的范例

这个例子中的父主题是 Twenty Ten，我们喜欢这个主题的几乎每个部分，除了网站标题的颜色，因为我想把它从黑色的改成绿色的。使用子主题的话，只用完成以下三个简单的步骤：

在 wp-content/themes 目录下创建一个新目录，并将它命名为 twentyten-child（或其他你喜欢的名称）。
将下面的代码保存在名为 style.css 的文件里，并将它放到新建的这个文件夹。
到 WordPress 的控制台>主题，然后激活你的新主题：Twenty Ten Child。

/*Theme Name: Twenty Ten ChildDescription: Child theme for the Twenty Ten theme Author: Your name hereTemplate: twentyten*/
@import url("../twentyten/style.css");
#site-title a {    color: #009900;}

复制代码

下面一步步解释上面代码的作用：

/* 开启子主题的头部信息。
Theme Name: 子主题名称的声明。
Description: 主题的描述（可选，也可被省略）。
Author: 作者名字的声明（可选，也可被省略）。
Template: 声明子主题的父主题，换言之，父主题所在的文件夹的名称，区分大小写。
*/子主题头部信息的关闭标记。
用 @import 规则将父主题的样式表调入
#site-title a 定义网站标题的颜色（绿色），覆盖父主题中相同的样式规则。

注意 @import 规则

需要注意的是，@import 规则之前没有其他的 CSS 样式规则，如果你将其他的规则置于它之上，那么它将无效，并且父主题的样式表不会被导入。

使用 functions.php

不像 style.css，子主题中的 functions.php 不会覆盖父主题中对应功能，而是将新的功能加入到父主题的 functions.php 中。（其实它会在父主题文件加载之前先载入。）

这样，子主题的 functions.php 提供了一个灵活稳定的方式来修改父主题的功能。如果你想在你的主题里加入一些 PHP 函数，最快的方式可能是打开 functions.php 文件然后加入进去。但那样并不灵活：下次你的主题升级更新了，你加入的新功能就会丢失掉。相反地，如果你使用子主题，将 functions.php 文件放进去，再将你想加入的功能写进这个文件里，那么这个功能同样会工作得很好，并且对于父主题以后的升级更新，子主题中加入的功能也不会受到影响。

functions.php 文件的结构非常简单：将 PHP 起始标签置于顶部，关闭标签置于底部，它们之间就写上你自己的 PHP 函数。你可以写得很多，也可以写得很少，反正按你所需。下面的示例是一个基本的 functions.php 文件的写法，作用是将 favicon 链接加入到 HTML 页面的 head 元素里面。


function favicon_link() {    echo '' . "\n";}add_action('wp_head', 'favicon_link');
?>

复制代码

给主题作者的提示。事实上子主题的 functions.php 首先加载意味着你的主题的用户功能可插入——即子主题是可替换的——通过有条件地进行声明。例如：

if (!function_exists('theme_special_nav')) {    function theme_special_nav() {        //  Do something.    }}

复制代码

注意，替换的过程是在父级主题中，使用 php 的 function_exits 进行判断。用这种方式，子主题可以替换父主题中的一个 PHP 函数，只需要简单地对它再次声明。

模板文件

模板文件在子主题中的表现和 style.css 一样，它们会覆盖父主题中的相同文件。子主题可以覆盖任何父主题模板中的文件，只需要创建同名文件就行。（注意：index.php 在 WordPress3.0 及以上版本才能被覆盖。）

同样，这项 WordPress 的功能允许你修改父主题的样式功能而不用去编辑父主题的文件，并且你的修改能让你在更新父主题后继续保留。

下面是一些使用模板文件的子主题的例子：

增加一个父主题没有提供的模板（例如：网站地图页面的模板，或者一单栏页面，它们在页面编辑，模板选择里是可用的）
增加一个比父模板更加具体的模板（见模板级别）。（例如：新加的 tag.php 模板用于按 tag 归档的文章来代替父主题中通常的 archive.php 模板。）
替换父主题中的一个模板.（例：使用你自己的 home.php 来覆盖父主题中的 home.php）

其他文件

除了 style.css，functions.php，index.php 和 home.php，子主题可以使用任何正式主题使用的类型的文件，只要文件被正确链接。打个比方，你可以使用在样式表里或者 Javascript 文件里链接的图标、图片，或者从 functions.php 文件中调用出来的额外 PHP 文件。

Resources

Theme Development
How to Modify WordPress Themes the Smart Way - four-part series on child themes
How to make a child theme for WordPress: A pictorial introduction for beginners - illustrated introduction to child themes
Introducing Thirty Ten - guide to creating a Twenty Ten Child Theme

目录CONTENT

zh-cn: 子主题 -wordpress

zh-cn:子主题

Contents

目录结构

必需的 style.css 文件

一个子主题的范例

注意 @import 规则

使用 functions.php

模板文件

其他文件

Resources

评论区