如何使用子主题功能修改您的WordPress主题?

如何使用子主题功能修改您的WordPress主题?,第1张

概述相信很多朋友使用的WordPress主题都经过了自己的一些修改,好不容易折腾好了,主题的升级版发布了,要不要升级呢?升级以后,还得重新再次修改?郁闷啊! 其实,...

相信很多朋友使用的wordpress主题都经过了自己的一些修改,好不容易折腾好了,主题的升级版发布了,要不要升级呢?升级以后,还得重新再次修改?郁闷啊!其实,你大可不必如此烦恼,使用wordpress的子主题功能,一切问题都可以迎刃而解!

很多朋友使用的是可以在线更新的wordpress主题,有的由于自己特殊的需求会对主题进行一定的自定义开发或修改,但是这样的话,如果主题以后发布了升级版本,你如果升级的话,原来你做的二次开发就都没了,还要重新做一次。那么怎么才能解决这个困境呢?其实很简单的,只要大家使用wordpress的子主题功能来对主题进行二次开发就行了。

什么是wordpress 子主题其实wordpress子主题也是一个主题,它继承了另一个主题——父主题——的功能,并允许你对父主题的功能进行修改,或者添加新功能。

创建一个子主题是很简单的。创建一个目录,将格式编写正确的 style.CSS 文件放进去,一个子主题就做成了!

只需要对 HTML 和CSS 具有基本的了解,您就可以通过创建一个非常基本的子主题 来对一个父主题的样式和布局进行修改和扩展,而不需要对父主题的文件作任何修改。

通过这样的方式,当父主题被更新的时候,您所做的修改就可以保存下来。

因为这个原因,我们强烈推荐您使用子主题的方式来对主题进行修改。

如果您对 PHP, wordpress Templates,和 wordpress Plugin API有个基本的理解,理论上来讲,您可以使用子主题对父主题的每一个方面进行扩展,而不需要对父主题的文件进行任何修改。

本文将说明如何创建一个基本的子主题并解释您能用它来干什么。本文将使用 wordpress 3.0 的默认主题 Twenty Ten 作为父主题进行举例说明。

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

public_HTMLwp-contentthemes (主题存放的目录)twentyten (示例中父主题Twenty Ten的目录)twentyten-child (子主题存放的目录,可以任意命名)style.CSS (子主题中不可或缺的文件,文件名必需为 style.CSS)这个文件夹里面必须少至只包含一个style.CSS文件,也可以包含多至一个完整wordpress主题所拥有的文件:

style.CSS (必需)functions.PHP (可选)Template files (可选)Other files (可选)让我们看看它们是如何起作用的。

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

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

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

1

2

3

4

5

6

7

8

9

/*

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/

Template: twentyten

Version: 0.1.0

*/

逐行的简单解释:

theme name. (必需) 子主题的名称。theme URI. (可选) 子主题的主页。Description. (可选) 子主题的描述。比如:我的第一个子主题,真棒!Author URI. (可选) 作者主页。Author. (optional) 作者的名字。Template. (必需) 父主题的目录名,区别大小写。 注意: 当你更改子主题名字时,要先换成别的主题。Version. (可选) 子主题的版本。比如:0.1,1.0,等。*/ 这个关闭标记的后面部分,就会按照一个常规的样式表文件一样生效,你可以把你想对wordpress应用的样式规则都写在它的后面。

要注意的是,子主题的样式表会替换父主题的样式表而生效。(事实上wordpress根本就不会载入父主题的样式表。)所以,如果你想简单地改变父主题中的一些样式和结构——而不是从头开始制作新主题——你必须明确的导入父主题的样式表,然后对它进行修改。

下面的例子告诉你如何使用@import规则完成这个。

一个子主题的范例这个例子中的父主题是Twenty Ten,我们喜欢这个主题的几乎每个部分,除了网站标题的颜色,因为我想把它从黑色的改成绿色的。使用子主题的话,只用完成以下三个简单的步骤:

在wp-content/themes目录下创建一个新目录,并将它命名为twentyten-child(或其他你喜欢的名称)。将下面的代码保存在名为style.CSS的文件里,并将它放到新建的这个文件夹。到wordpress的控制台>主题,然后激活你的新主题:Twenty Ten Child。1

2

3

4

5

6

7

8

9

10

11

12

/*

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;

}

下面一步步解释上面代码的作用:

/* 开启子主题的头部信息。theme name: 子主题名称的声明。Description: 主题的描述(可选,也可被省略)。Author: 作者名字的声明(可选,也可被省略)。Template: 声明子主题的父主题,换言之,父主题所在的文件夹的名称,区分大小写。*/子主题头部信息的关闭标记。用 @import规则将父主题的样式表调入#site-Title a 定义网站标题的颜色(绿色),覆盖父主题中相同的样式规则。注意 @import 规则需要注意的是,@import 规则之前没有其他的CSS样式规则,如果你将其他的规则置于它之上,那么它将无效,并且父主题的样式表不会被导入。

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

这样,子主题的functions.PHP提供了一个灵活稳定的方式来修改父主题的功能。如果你想在你的主题里加入一些PHP函数,最快的方式可能是打开functions.PHP文件然后加入进去。但那样并不灵活:下次你的主题升级更新了,你加入的新功能就会丢失掉。相反地,如果你使用子主题,将functions.PHP文件放进去,再将你想加入的功能写进这个文件里,那么这个功能同样会工作得很好,并且对于父主题以后的升级更新,子主题中加入的功能也不会受到影响。

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

1

2

3

4

5

6

7

8

<?PHP

 

function favicon_link() {

echo '<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" />' . "n";

}

add_action('wp_head','favicon_link');

 

?>

给主题作者的提示。事实上子主题的functions.PHP首先加载意味着你的主题的用户功能可插入——即子主题是可替换的——通过有条件地进行声明。例如:

1

2

3

4

5

if (!function_exists('theme_special_nav')) {

function theme_special_nav() {

// Do something.

}

}

用这种方式,子主题可以替换父主题中的一个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文件。

总结

以上是内存溢出为你收集整理的如何使用子主题功能修改您的WordPress主题?全部内容,希望文章能够帮你解决如何使用子主题功能修改您的WordPress主题?所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zz/998181.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-21
下一篇 2022-05-21

发表评论

登录后才能评论

评论列表(0条)

保存