WordPress 子主题相对容易设置和自定义。 但是在使用子主题时,您可能会遇到一些小的技术问题,具体取决于其配置。 让我们谈谈如何解决常见错误。
1.子主题没有覆盖父主题
您对子主题所做的任何更改都应“覆盖”其父主题的样式和功能。 我们在引号中说覆盖是因为入队功能使子主题的样式表在父主题之前加载。 如果您使用的是子主题,但没有看到您所做的更改反映在您的网站上,则其样式表没有按正确的顺序加载。
在大多数情况下,这是由于您的子主题如何继承父样式的问题。 通过 FTP 连接到您的网站并打开 wp-content/themes 目录中的子主题文件夹以解决问题。
查找里面的functions.php文件并打开它。 您应该在文件顶部看到以下入队函数:
<?phpadd_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );function enqueue_parent_styles() {wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );}?>
您需要验证函数中没有拼写错误。 此代码告诉 WordPress 导入子主题的 style.css 文件中指定的主题的样式。 如果代码看起来没问题,返回子主题的文件夹并打开它的 style.css 文件。
子主题的样式表应该包含一段代码,如下所示:
/*Theme Name: Twenty Twenty Two ChildTheme URI: http://example.com/twenty-twenty-two-child/Description: A child theme for the Twenty Twenty Two themeAuthor: John DoeAuthor URI: http://example.comTemplate: twentytwentytwoVersion: 1.0.0License: GNU General Public License v2 or laterLicense URI: http://www.gnu.org/licenses/gpl-2.0.htmlTags: child themeText Domain: twenty-twenty-two-child*/
我们关心的那部分代码是模板行。 它应该指示子父主题的文件夹名称。
如果 style.css 或 functions.php 文件中有错误,则子主题将无法按预期工作。 您仍然可以将自定义代码添加到任一文件,但不会加载到您的网站上。
2.子主题没有出现在主题区
创建子主题时,它应该在外观 → 主题选项卡中显示为单独的条目。 如果没有,通常意味着子主题的样式表有问题。
要检查子主题的样式表,请通过 FTP 连接到您的网站并导航到 wp-content/themes 文件夹。 在里面查找子主题的文件夹,打开它,然后选择 style.css 文件。
打开文件时,它应该包含如下所示的部分:
/*Theme Name: Twenty Twenty Two ChildTheme URI: http://example.com/twenty-twenty-two-child/Description: A child theme for the Twenty Twenty Two themeAuthor: John DoeAuthor URI: http://example.comTemplate: twentytwentytwoVersion: 1.0.0License: GNU General Public License v2 or laterLicense URI: http://www.gnu.org/licenses/gpl-2.0.htmlTags: child themeText Domain: twenty-twenty-two-child*/
该代码中的关键行如下:
/*Theme Name: Twenty Twenty Two ChildTheme URI: http://example.com/twenty-twenty-two-child/Description: A child theme for the Twenty Twenty Two themeAuthor: John DoeAuthor URI: http://example.comTemplate: twentytwentytwoVersion: 1.0.0*/
要使子主题正常工作,您需要包含每个参数并指定它们的值。 这些值可以是您想要的任何值,除了 Template 行。 该行需要包含父主题文件夹的名称(wp-content/themes
目录中的文件夹名称)。
确保您没有遗漏 style.css 文件中代码的任何行,并保存所有更改。
添加缺失的行和属性后,子主题应出现在外观 → 主题选项卡中。 请记住,它将是与父主题分开的条目。 它将显示您在styles.css
文件中指定的名称、描述和作者。
3.子主题入队功能不起作用
如果您的子主题没有继承父主题的样式,则您正在使用的“入队”功能可能存在问题。 enqueue 函数会导入您在为子主题创建 style.css 文件时选择的父主题的样式。
要检查入队功能,请通过 FTP 连接到您的网站并导航到wp-content/themes
目录。 找到子主题对应的文件夹,打开。
查找里面的functions.php文件并打开它。 您要查找的函数应如下所示:
<?phpadd_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );function enqueue_parent_styles() {wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );}?>
确保get_template_directory_uri
参数指向子主题的style.css
文件。 该文件应与functions.php
位于同一目录中,因此如果缺少一个,请在style.css
之前添加一个斜杠。
或者,验证其余代码是否没有拼写错误。 如果您想安全地播放它,请将该代码片段复制并粘贴到functions.php
文件中并删除其前身。 保存对文件的更改,您的子主题应该可以工作。
4.子主题没有加载最新的style.css更新
如果您对子主题的style.css
文件进行了更改,但它们没有显示在您的网站上,则可能是由于缓存问题。 在执行任何其他操作之前,请清除浏览器缓存。 如果错误仍然存在,您可能需要手动刷新站点的缓存或使用插件。
如果您不处理缓存问题,则父主题的style.css
文件可能会覆盖子主题的。 避免该问题的一种方法是将!important
属性值添加到未加载的 CSS 样式中。
下面是使用!important
的 CSS 行的外观:
p { background-color: red !important; }
也可能是子主题的style.css
文件没有正确引用父主题。 有关修复该问题的说明,您可以阅读我们的故障排除指南中的上一部分。