使用 WordPress 的子主题(Child Themes)功能快速制作自己的主题

在了解子主题功能之前,先来看一下你在使用 WordPress 的时候是否是这样:不会自己制作主题,只好从网上下载一个,这个主题整体风格比较适合,但是有些小地方不太好,自己只是有一点 CSS 基础,可以修改一些简单的样式。修改的时候,却发现主题文件这么多,里面掺杂各种 PHP、HTML 代码,让人不知道在哪里修改。

太好了,那么我们开始学习子主题吧,子主题就是来解决这个问题的。它可以基于某个主题,继承它的功能和样式,然后让你自己进行简单的代码编写就可以衍生出一个新的版本。你还可以对子主题增加样式、功能等等,不仅仅是修改父主题样式那么简单。

做一个子主题非常简单,只需要用 FTP 什么的新建一个目录,然后增加几个文件就可以。你只需要了解很简单的 HTML 和 CSS 知识就可以修改父主题的样式等,当然当父主题升级之后,子主题样式、功能不会被覆盖失效。所以从这个角度来说,如果你想修改一个主题,你应该用子主题这个功能,而不是直接修改原主题文件。

下面就来具体实践看一下,我们就以 Twenty Twelve 这个主题为例吧,其他的主题都是一样的。

子主题的目录结构

子主题也是一个主题,也跟其他主题一样,放在 wp-content/themes 目录下面的文件夹中,文件夹的名称可以随便定义,为了形象一点,在示例中,我们可以新建 twentytwelve-child 这样一个文件夹存放子主题。这样的话,我们的 themes 文件夹中,至少有两个文件夹:twentytwelve、twentytwelve-child ,因为子主题要基于父主题,所以主题目录肯定要有父主题。

在子主题中,一般有下面几个文件:

  • style.css (这个必须有)
  • functions.php (这个可以有)
  • 其他模板文件 (这个可以有)
  • 其他文件 (这个可以有)

使用子主题,可以继承父主题的所有功能,同时避免因为直接使用父主题在父主题升级时造成文件丢失的情况。

子主题的创建很简单:

1、首先在主题文件夹下(wp-content hemes)建立一个文件夹,用来存放子主题的所有文件,例如:twentytwelve-child。

2、在twentytwelve-child文件夹下新建一个style.css文件,该文件是必须的。将以下代码粘贴进去:

/*
Theme Name:     Twenty Twelve Child  (子主题名称,必须)
Theme URI:      http://www.**.com  (主题url)
Description:    Child theme for the Twenty Twelve theme  (主题描述)
Author:         **  (主题作者)
Author URI:     http://www.**.com  (作者uri)
Template:       twentytwelve  (父主题目录名称,必须)
Version:        1.0.0  (版本号)
*/

括号的字要去掉,此时就可以在后台-外观-主题中激活该子主题。

3、自定义css

子主题不会继承父主题的css样式,也就是说外观布局要重新定义,你可以在style.css文件中自定义,也可以使用@import直接调用父主题的样式,然后再进行修改,示例代码:

/*
Theme Name:     Twenty Twelve Child
Theme URI:      http://www.**.com
Description:    Child theme for the Twenty theme 
Author:         **
Author URI:     http://www.**.com
Template:       twenty
Version:        1.00
*/
 
@import url("../twenty/style.css");
 
a{
	color:green;
}

4、编辑functions.php文件

functions.php文件是用来保存主题的一系列功能函数,建立子主题后,父主题的功能函数会自动调用。如果你需要额外增加函数,则在twenty-child下新建一个functions.php文件,例:在底部添加版权文本

<?php
add_action( 'twenty_credits', 'my_credits' );
function my_credits(){
	echo '<span>©2013 **wp All rights reserved.</span> ';
}
?>

注意:functions.php文件中的代码不会替换父主题的,它是额外增加进去。

5、编辑其它文件

在子主题中,除functions.php文件外,其它文件都是完全替换父主题的同名文件。例如你要重新修改footer.php文件,则在twenty-child中新建该文件,将父主题该文件的代码粘贴进去再进行修改。

要点:

1、只需建立一个style.css文件就可以创建一个子主题;

2、使用hook API在functions.php中添加额外的主题功能;

3、要修改哪个文件就在子主题文件夹下建立它的同名文件。

4、父主题的升级不会影响到子主题的文件。