WordPress 从 3.4 版本开始,引入了子主题的功能,方便有开发经验的用户进行主题自定义修改。
启用子主题的步骤
1. 成功安装并启用 Smart Design 主题
2. 下载后安装 Smart Design 子主题并启用
3. 对子主题内的 style.css 和 functions.php 文件进行编辑,修改主题样式和添加功能
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
评论列表
貌似子主题的安装方式不太一样
@向日葵媒体设计 跟普通主题一样的,只是需要先安装父主题!
正在用,期待