WordPress 子主题

为了能对 WordPress 的主题自定义,有时候会对主题文件进行编辑;但如果遇到主题文件有升级,则修改的内容便会丢失。若想保持自己的修改不受主题升级影响,则可考虑使用 WordPress 的子主题功能。

创建子主题文件夹

第一步则是在 wp-content/themes 下创建子主题文件夹,为了方便,名称最好是在原主题文件夹名称后加上 -child,以 Twenty Twelve 主题为例,子主题文件夹最好是 twentytwelve-child,以下涉及到的文件都在子主题文件夹内。

创建样式表 style.css

接下来需要创建名为 style.css 的样式表文件,文件的开头需要有以下格式的内容,以便 WordPress 能正确识别这是一个子主题。

/*
Theme Name:     Twenty Twelve Child
Description:    Child theme for Twenty Twelve
Author:         Neo
Author URI:     https://www.whosneo.com/about/
Template:       twentytwelve
Version:        0.1.0
*/

其中,有几项是必不可少的:
Theme Name – 主题名称不可与其他主题相同
Template – 父主题的文件夹名称

其余的信息可以选择性的添加。虽然子主题可以只有一个 style.css 样式表文件,但是不能缺了 functions.php,否则便无法正确加载样式。

装载样式

最后一步便是装载父主题和子主题的样式了。

以前通用的做法是在 style.css 文件中使用 @import 引入父主题的样式,但现在已经不再推荐使用,因为这会增加样式加载时间,也有可能造成父主题样式重复加载。

装载主题推荐的方法就是在子主题的 functions.php 文件中增加一个 wp_enqueue_scripts 动作,并使用 wp_enqueue_style() 函数。如果不存在 functions.php 文件,则创建。同时不要忘了。所有的 php 代码都需要用 php 标签包围起来<?php 👻 ?>

<?php
add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );
function enqueue_parent_styles() {
    $theme = wp_get_theme();
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css', array(), $theme->parent()->get('Version') );
    wp_enqueue_style( 'child-style', get_stylesheet_uri(), array( 'parent-style' ), $theme->get('Version') );
}
?>

安装激活子主题

在后台管理 > 外观 > 主题 中,激活你的子主题即可。

添加模版文件

除了上面提到的 style.css  functions.php 文件之外,添加的其他任何文件都会覆盖父主题的同名文件。例如你想修改父主题的页脚,就可以复制 footer.php 文件到子主题文件夹中进行修改。修改完成后,刷新页面就可以看到修改效果了。