在特定模板页面上包含脚本的最佳方式

时间:2012-03-17 作者:jw60660

这一直让我困惑,我需要一些帮助。

我想在结束正文标签的正上方做四件事:

包含jQuery(WordPress版本很好)在此下方包含依赖于jQuery的jQuery插件直接在该插件下方初始化插件,并使用$而不是jQuery避免冲突问题仅在特定页面模板或主题文件上执行此操作我知道我可能应该使用wp\\u enqueue\\u脚本,但我不确定是否应该在函数中使用它。php或直接在我想要的页面上。

关于第3个问题,我已经看到了一些解决方法,例如:

jQuery(function ($) {
/* You can safely use $ in this code block to reference jQuery */
});
但我真的很困惑如何实现这一点。

实现这一目标的最佳方式是什么?

非常感谢。

2 个回复
SO网友:Stephen Harris

以下内容(在您的主题中)functions.php) 将注册脚本,并将jQuery设置为依赖项。因此,当您将其排队时,jQuery也将被排队。

function my_scripts_method() {
   // register your script location, dependencies and version
   wp_register_script(\'my_custom_script\',
       get_template_directory_uri() . \'/js/custom_script.js\',
       array(\'jquery\'),
       \'1.0\' );

}
add_action(\'wp_enqueue_scripts\', \'my_scripts_method\');
然后,您可以通过以下两种方式之一将脚本排队。在您的主题中functions.php 您可以使用template_include 使用筛选获取正在使用的模板is_page_template()

add_filter( \'template_include\', \'my_load_script_for_template\', 1000 );
function my_load_script_for_template( $template ){
     if(is_page_template(\'my-template.php\'))
        wp_enqueue_script(\'my_custom_script\');

return $template;
}
或者,如果您使用的是3.3+和主题调用wp_footer() 那你可以打电话wp_enqueue_script(\'my_custom_script\') 在实际模板页面内。

SO网友:Jeremy Jared

由于我没有时间浏览最新的开发更新,我不确定这是否仍然是(或曾经是)最好的方式,但我将首先发布我的做法:

function my_slider_script() {
  if ( !is_page_template( \'slider.php\' ) )
  return;
    wp_enqueue_script(\'jquery-ui-core\');
    wp_enqueue_script(\'jquery-ui-tabs\');
    wp_enqueue_script( \'my_rotator_script\', get_template_directory_uri() . \'/js/photo_rotator_tabs.js\', array(\'jquery\'));
  }
add_action( \'template_redirect\', \'my_slider_script\' )
前两个是使用WordPress包含的js,以及\'my_rotator_script\' 是我在主题根目录的js文件夹中的模板文件夹中包含的一个名为photo_rotator_tabs.js. 它仅包含在使用滑块的页面上。php页面模板。

我想Scribu 我写了一篇关于这个主题的非常详细的帖子,但我不记得链接了。我想他用的是wp_print_scripts 方法,或"WordPress Ninja" 方法如果我的was过时了,也许他会帮你的。

结束

相关推荐

将WordPress内容集成到jQuery Slider中

在我的自定义WordPress主题中,我在我的内容上方实现了一个非常基本的“特色列表-图像滑块”。如何将WordPress内容集成到滑块中,以便通过“最近的帖子”或“类别”提取幻灯片内容?此外,如何设置“特色IMG”在滑块中显示为照片,并在列表区域中的我的缩略图部分中显示?这是我在jQuery I插件上获得的截图;<(他们的演示程序坏了,所以。)Below is the markup I have implemented. <div id=\"featured\" >