WordPress 子主题完全指南

第一部分：什么是子主题？为什么要用它？（好处）

简单来说，**子主题**是一个依附于**父主题**（你当前使用的主题）存在的主题。它继承了父主题的所有功能和样式，但允许你进行修改而不影响父主题本身。

使用子主题的 4 大核心好处：

1. 无痛更新（最重要）：

- 场景：你直接修改了主题的源码（比如修改了 footer.php 去掉版权信息）。
- 后果：当主题作者发布新版本，你点击更新后，你的所有修改都会被覆盖丢失。
- 子主题优势：修改在子主题中进行，父主题更新时，子主题的文件不会受影响，你的修改得以永久保留。
2. 便于管理和组织：

- 你的所有自定义代码（CSS、PHP）都集中在一个文件夹里，而不是分散在父主题的各个角落，查错和管理非常方便。
3. 开发安全（容错率高）：

- 如果你在子主题里写错了代码导致网站崩溃，通常只需要通过 FTP 删除子主题里的那个文件，或者切回父主题，网站就能恢复。这比直接改坏核心文件要安全得多。
4. 提高开发效率：

- 你不需要从零开始写一个主题，只需要在现有的优秀主题基础上，修改你不满意的部分即可。

---

第二部分：如何创建子主题（两种方法）

方法一：使用插件创建（推荐新手使用）

这是最简单、最不容易出错的方法。

1. 安装插件：在 WordPress 后台，点击插件 > 安装插件，搜索 "Child Theme Configurator" 并安装启用。
2. 配置：

- 进入工具 > Child Themes。
- Step 1: 选择 "Create a new Child Theme"。
- Step 2: 选择你要基于哪个父主题创建（比如 Astra, Hello Elementor, Twenty Twenty-Four 等），点击 "Analyze"。
- Step 3 – 8: 大部分保持默认设置即可。
- Step 9: 点击 "Create New Child Theme" 按钮。
3. 启用：创建完成后，进入外观 > 主题，你会看到一个新的子主题，点击启用。

---

方法二：手动代码创建（推荐开发者/极客使用）

手动创建能让你更深入理解 WordPress 的运行机制。假设我们要为 WordPress 自带的 **Twenty Twenty-Four** 主题创建一个子主题。

**准备工作：** 需要通过 FTP 或者主机控制面板（如 cPanel/宝塔）的文件管理器访问网站目录。

步骤 1：创建文件夹

进入 /wp-content/themes/ 目录，创建一个新文件夹。

- 命名规范：父主题文件夹名-child
- 例如：twentytwentyfour-child

步骤 2：创建样式表 (style.css) 【必须】

在刚才创建的文件夹内，新建一个文件 style.css，并粘贴以下代码：

/*
 Theme Name:   Twenty Twenty-Four Child
 Theme URI:    http://example.com/twenty-twenty-four-child/
 Description:  Twenty Twenty-Four Child Theme
 Author:       Your Name
 Author URI:   http://example.com
 Template:     twentytwentyfour
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  twentytwentyfour-child
*/

- 关键点： Template: twentytwentyfour 这一行非常重要。它告诉 WordPress 这个子主题的父亲是谁。必须填写父主题的文件夹名称（区分大小写）。

步骤 3：创建函数文件 (functions.php) 【必须】

在同目录下新建 functions.php，用于正确引入父主题的样式。粘贴以下代码：

<?php
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
    // 引入父主题样式
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}
?>

- 注意：有些现代主题（如全站编辑FSE主题）可能不需要这一步也能自动加载样式，但加上是最稳妥的标准做法。

步骤 4：添加封面图 (screenshot.png) 【可选】

你可以复制父主题里的 screenshot.png 到子主题文件夹，或者自己做一个 1200×900 的图片放进去，这样在后台主题列表里好看一些。

步骤 5：启用子主题

回到 WordPress 后台 **外观 > 主题**，你会看到 "Twenty Twenty-Four Child"，点击**启用**。

---

第三部分：如何使用子主题（自定义修改）

启用子主题后，网站前台看起来应该和父主题一模一样。现在的关键是：**如何修改？**

1. 修改 CSS 样式（改颜色、字体、间距）

**方法：** 直接编辑子主题文件夹下的 style.css。

**示例：** 假设你想把所有标题变成红色。
在子主题的 style.css 头部注释下方添加：

/* 自定义样式开始 */
h1, h2, h3 {
    color: #ff0000 !important;
}

保存后刷新网页即可看到效果。这比在“外观-自定义-额外CSS”里写代码更好管理。

2. 修改 PHP 模板文件（改页面结构、HTML）

这是子主题最强大的功能。**覆盖原则**：WordPress 会先在子主题里找文件，找不到再去父主题找。

**示例：** 你想修改文章页面的底部版权信息（通常在 footer.php 中）。

1. 复制：从父主题文件夹中找到 footer.php。
2. 粘贴：把它复制到子主题文件夹中。
3. 编辑：编辑子主题里的 footer.php，修改里面的代码。
4. 结果： WordPress 会加载你修改过的这个文件，忽略父主题的那个。

*注意：不要复制所有文件，只复制你想修改的那个文件即可。*

3. 添加新功能（functions.php）

如果你需要添加 PHP 代码片段（例如：允许上传 SVG 图片、添加谷歌分析代码、注册新的小工具区域）。

**方法：** 直接编辑子主题的 functions.php。

**重要区别：**

- 模板文件（如 header.php）是覆盖（子主题取代父主题）。
- 功能文件（functions.php）是补充（子主题的代码会在父主题代码之前加载，两者共存）。

**示例：** 隐藏后台顶部的管理工具栏。
在子主题 functions.php 的 ?> 之前（如果有的话）添加：

add_filter('show_admin_bar', '__return_false');

---

总结

1. 只要你想修改主题的源码（PHP/CSS），请务必使用子主题。
2. 新手可以用 Child Theme Configurator 插件一键生成。
3. 修改样式写在子主题的 style.css 里。
4. 修改页面结构，把父主题对应的 .php 文件复制到子主题里再改。
5. 修改功能，把代码追加到子主题的 functions.php 里。