WordPress 子主题能干什么以及不能干什么

子主题基本用法

以Twenty Ten主题为例:

子主题放在wp-content/themes目录下属于自己的目录里。下面的结构显示的就是子主题和它的父主题(Twenty Ten)在典型的WordPress目录结构中的位置:

  • wp-content
    • themes (主题存放的目录)
      • twentyten (示例中父主题Twenty Ten的目录)
      • twentyten-child (子主题存放的目录,可以任意命名)
        • style.css (子主题中不可或缺的文件,文件名必需为 style.css)

这个文件夹里面可以少至只包含一个style.css文件,也可以包含多至一个完整WordPress主题所拥有的文件:

  1. style.css (必需)
  2. functions.php (可选)
  3. Template files (可选)
  4. Other files (可选)

必需的 style.css

style.css是一个子主题唯一必须的文件。它的头部提供的信息让WordPress辨认出子主题,并且重写父主题中的style.css文件

对于任何WordPress主题,头部信息必须位于文件的顶端,唯一的区别就是子主题中的Template:行是必须的,因为它让WordPress知道子主题的父主题是什么。

下面是一个style.css文件的头部信息的示例:

/*
Theme Name:     Twenty Ten Child
Theme URI:      http: //example.com/
Description:    Child theme for the Twenty Ten theme 
Author:         Your name here
Author URI:     http: //example.com/about/
<strong>Template:       twentyten</strong>
Version:        0.1.0
*/

逐行的简单解释:

  • Theme Name. (必需) 子主题的名称
  • Theme URI. (可选) 子主题的主页。
  • Description. (可选) 子主题的描述。比如:我的第一个子主题,真棒!
  • Author URI. (可选) 作者主页。
  • Author. (optional) 作者的名字。
  • Template. (必需) 父主题的目录名,区别大小写。 注意: 当你更改子主题名字时,要先换成别的主题。
  • Version. (可选) 子主题的版本。比如:0.1,1.0,等。

*/ 这个关闭标记的后面部分,就会按照一个常规的样式表文件一样生效,你可以把你想对WordPress应用的样式规则都写在它的后面。

要注意的是,子主题的样式表会替换父主题的样式表而生效。(事实上WordPress根本就不会载入父主题的样式表。)所以,如果你想简单地改变父主题中的一些样式和结构——而不是从头开始制作新主题——你必须明确的导入父主题的样式表,然后对它进行修改。下面的例子告诉你如何使用@import规则完成这个。

/*
Theme Name: Twenty Ten Child
Description: Child theme for the Twenty Ten theme 
Author: Your name here
Template: twentyten
*/

@import url("../twentyten/style.css");

#site-title a {
    color: #009900;
}
  • @import 用于将父主题的样式表调入。
  • #site-title a 用户自定义样式,定义网站标题的颜色(绿色),覆盖父主题中相同的样式规则。

需要注意的是,@import 规则之前没有其他的CSS样式规则,如果你将其他的规则置于它之上,那么它将无效,并且父主题的样式表不会被导入。

可选的 functions.php

不像style.css子主题中的functions.php不会覆盖父主题中对应功能,而是将新的功能加入到父主题的functions.php中。(其实它会在父主题文件加载之前先载入。)

functions.php文件的结构非常简单:将PHP起始标签置于顶部,关闭标签置于底部,它们之间就写上你自己的PHP函数。下面的示例是一个基本的functions.php文件的写法,作用是将favicon链接加入到HTML页面的head元素里面。

<?php

function favicon_link() {
    echo '<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" />' . "\n";
}
add_action('wp_head', 'favicon_link');

?>

由于同一个函数不能被多次定义,子主题中的函数不能和父主题同名,也就是说子主题只能新增函数,不能更改或覆盖父主题中的功能函数,除非父主题的作者从一开始就使用以下写法:

if (!function_exists('theme_special_nav')) {
    function theme_special_nav() {
        //  Do something.
    }
}

上面这段代码的作用是当不存在函数XX时才定义函数XX。

然而主题的原作者们通常很少这么写,因此还是没用。

可选的页面模板.php

模板文件在子主题中的表现和style.css一样,它们会覆盖父主题中的相同文件。子主题可以覆盖任何父主题模板中的文件,只需要创建同名文件就行。(注意:index.php在WordPress3.0及以上版本才能被覆盖。)

同样,这项WordPress的功能允许你修改父主题的样式功能而不用去编辑父主题的文件,并且你的修改能让你在更新父主题后继续保留。

下面是一些使用模板文件的子主题的例子:

  • 增加一个父主题没有提供的模板(例如:网站地图页面的模板,或者一单栏页面,它们在页面编辑,模板选择里是可用的)
  • 增加一个比父模板更加具体的模板(见模板级别)。(例如:新加的tag.php模板用于按tag归档的文章来代替父主题中通常的archive.php模板。)
  • 替换父主题中的一个模板.(例:使用你自己的home.php来覆盖父主题中的home.php

其他文件

除了style.css,functions.php,index.php和home.php,子主题可以使用任何正式主题使用的类型的文件,只要文件被正确链接。打个比方,你可以使用在样式表里或者Javascript文件里链接的图标、图片,或者从functions.php文件中调用出来的额外PHP文件。

子主题能干什么

  • 覆盖整个样式表 style.css。子主题的样式表会替换父主题的样式表而生效,事实上WordPress 根本就不会载入父主题的样式表。然而这并不比额外CSS好用。而且有些主题用的样式表不一定是 style.css 。
  • 增加少量函数到 functions.php。子主题中的functions.php会在父主题文件加载之前先载入。不会覆盖父主题中对应功能,而是将新的功能加入到父主题的functions.php中。
  • 新建或覆盖整个页面模板.php。子主题可以覆盖任何父主题中的同名模板文件。

子主题不能干什么

  • 不能更改父主题在 functions.php 中已有的功能函数。除非作者遵照上文提到的标准写法。
  • 不能更改 .php 文件中的局部细节。要么覆盖整个文件,只改局部是做不到的。

总结

总体来看,我觉得子主题很鸡肋。

如果是修改样式表我选择用额外CSS,修改函数小细节没必要覆盖整个文件,可能会错过原主题作者的一些更新内容。新增函数虽然可以写在子主题的functions.php,但是调用的时候不还是得回到父主题里调用?这可能会引发一些问题,主题编辑器甚至通不过修改。

如此看来,子主题唯一的用处就是新建页面模板。

不过,既然都有功夫新建一个子主题,那手动新建页面也算不了什么麻烦事。

所以最终我还是选择回归最原始的方式,那就是写篇文章记录一下自己修改过的地方,然后每次更新的时候再手动复制粘贴一遍……目前发现JavaScript能有效解决这个问题,见《WordPress 主题修改经验》。

参考资料

  1. 子主题
  2. WordPress 主题修改经验
  3. Argon 主题修改记录
  4. Adams主题修改记录
小提示:您还可以点击下方 [ 标签 ] 阅读相关文章。您可以通过 RSS 订阅本站文章更新,订阅地址:https://crowya.com/feed
暂无评论

发送评论 编辑评论

|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇