如何使用 Smart Design 子主题功能

WordPress 从 3.4 版本开始,引入了子主题的功能,方便有开发经验的用户进行主题自定义修改。

启用子主题的步骤

1. 成功安装并启用 Smart Design 主题
2. 下载后安装 Smart Design 子主题并启用
3. 对子主题内的 style.css 和 functions.php 文件进行编辑,修改主题样式和添加功能

使用备注

  • 子主题引用父主题的所有模板文件,因此具有父主题的所有样式和功能,对子主题的 style.css 文件添加相应的 css 可以覆盖父主题原有的样式,实现主题自定义修改,对子主题的 functions.php 添加功能函数也可以增加功能。
  • 由于用户是通过修改子主题的文件达到自定义的目的,因此父主题升级不会影响自定义的内容,这也是使用子主题的主要目的。
  • 子主题功能是 WordPress 3.4 中引入的,需要子主题功能请确保使用 WordPress 3.4 及以上版本
  • 在使用自定义 CSS 覆盖父主题样式时,请注意 CSS 优先级别,由于子主题使用涉及前端开发,建议有前端开发经验的用户使用。

举例

下面 Kayo 举例说明如何使用 Smart Design 子主题功能。

在 Smart Design 版头部分中,默认使用的背景颜色是红色“#952610”,相应的 CSS 语句为 #header .header-content {background: #952610; } ,若需要修改为颜色较浅的红色,可以在子主题的 style.css 中添加这样一条 CSS 语句:#header .header-content {background: #7e2514; } ,这样原本的颜色就会被覆盖掉,并且升级主题后这个自定义修改仍然有效。

小提示

  • Kayo 已经把子主题 style.css 设置为在父主题的 style.css 之后引用,因此在添加新的 CSS 语句时,只需直接引用原本的 CSS 选择器即可覆盖原样式。
  • 由于主题 CSS 经过压缩,若查找不到相应的 CSS 语句,可以用 chrome “查看元素” 或 Firefox 的 “Firebug” 等工具查看。

更多子主题使用的指导可以浏览 WordPress 子主题官方介绍

祝大家使用愉快!

本文由 Kayo Lee 发表,本文链接:https://kayosite.com/premium-theme-child-theme.html

评论列表

回复

你正在以游客身份访问网站,请输入你的昵称和 E-mail
:wink: :roll: :oops: :mrgreen: :idea: :cry: :?: :-| :-o :-P :-? :) :( 8-O