thematic是一个非常优秀的wordpress主题框架,利用它可以快速的制作出来我们需要的主题,但在实际的开发过程中,thematic的许多函数无法满足我们的需要,我们有更好的函数来完成工作,这个时候就需要对thematic的函数进行改造,例如近期在我们的开发项目中遇到的一个问题:thematic提供的javascript脚本过于臃肿,而我们的javascript小巧精干,所以这里就要解决两个问题,首先是在不改动thematic框架的原则下移除框架提供的javascript,然后依然是在不改动框架的原则下引入我们需要的javascript,不过这是一个思路,在实际的操作中,我们完全可以一步就达成我们的目的。
首先还是看一下thematic框架函数库,在wp-content\themes\thematic\library\extensions中找到header-extensions.php,这个文件里包含了有关整个框架的头部的函数,打开这个文件后转到309行,或找到如下代码:
- if (function_exists('childtheme_override_head_scripts')) {
- function thematic_head_scripts() {
- childtheme_override_head_scripts();
- }
- } else {
- function thematic_head_scripts() {
- $scriptdir_start = "\t";
- $scriptdir_start .= '<script type="text/javascript" src="';
- $scriptdir_start .= get_bloginfo('template_directory');
- $scriptdir_start .= '/library/scripts/';
- $scriptdir_end = '"></script>';
- $scripts = "\n";
- $scripts .= $scriptdir_start . 'hoverIntent.js' . $scriptdir_end . "\n";
- $scripts .= $scriptdir_start . 'superfish.js' . $scriptdir_end . "\n";
- $scripts .= $scriptdir_start . 'supersubs.js' . $scriptdir_end . "\n";
- $dropdown_options = $scriptdir_start . 'thematic-dropdowns.js' . $scriptdir_end . "\n";
- $scripts = $scripts . apply_filters('thematic_dropdown_options', $dropdown_options);
- $scripts .= "\n";
- $scripts .= "\t";
- $scripts .= '<script type="text/javascript">' . "\n";
- $scripts .= "\t\t" . '/*<![CDATA[*/' . "\n";
- $scripts .= "\t\t" . 'jQuery.noConflict();' . "\n";
- $scripts .= "\t\t" . '/*]]>*/' . "\n";
- $scripts .= "\t";
- $scripts .= '</script>' . "\n";
- // Print filtered scripts
- print apply_filters('thematic_head_scripts', $scripts);
- }
- }
- if (apply_filters('thematic_use_superfish', TRUE)) {
- add_action('wp_head','thematic_head_scripts');
- }
thematic_head_scripts这个函数名称很容易可以看得出来是控制头部脚本输出的作用,在这里我们不对这个函数做更详细的解释,只讨论和这个主题有关的部分,我们精简一下这个函数的代码如下:
- if (function_exists('childtheme_override_head_scripts')) {
- function thematic_head_scripts() {
- childtheme_override_head_scripts();
- }
- } else {
- function thematic_head_scripts() {
- ......
- print apply_filters('thematic_head_scripts', $scripts);
- }
- }
看到这里,我们就完全可以很轻松的控制javascript了,首先这个函数有一个if,检查childtheme_override_head_scripts()这个函数是否存在,存在即执行这个函数,否则就执行框架默认的函数。
所以,我们可以在主题的functions.php构造一个childtheme_override_head_scripts()函数来引用我们的javascript脚本,将如下代码加入主题的functions.php这个文件最后一个?>之前:
回到wordpress前台,刷新页面后查看网页源代码
- function childtheme_override_head_scripts() {?>
- <?php echo "\n\t" ?><script type="text/javascript" charset="utf-8" src="<?php bloginfo('stylesheet_directory'); ?>/script/main.js"></script><?php echo "\n" ?>
- <?php }
可以发现thematic框架的javascript已经没有了,取而代之的是我们自定义的javascript脚本了。
还有一种方法可以让我们自定义引用javascript和thematic框架的javascript共存,和上一种方法一样,在主题的functions.php这个文件最后一个?>之前加入如下代码:
- function childtheme_scripts() {?>
- <?php echo "\n\t" ?><script type="text/javascript" charset="utf-8" src="<?php bloginfo('stylesheet_directory'); ?>/script/main.js"></script><?php echo "\n" ?>
- <?php }
- add_action('wp_head', 'childtheme_scripts');
还有一个问题要说明一下,关于获得引用的javascript脚本路径的问题,正常情况下,我们可以通过bloginfo('template_directory')来获得当前主题的路径,但在子主题中用这个方法获取的将是上一级主题的路径,所以,我们需要通过bloginfo('stylesheet_directory')来获取子主题的路径
转载于:https://blog.51cto.com/xiaobeibei/762114