通过Google进行搜索时, 我一遍又一遍地遇到了相同的代码, 这些代码将jQuery添加到一个从零开始的Wordpress主题中。
if (!is_admin()) add_action("wp_enqueue_scripts", "my_jquery_enqueue", 11);
function my_jquery_enqueue() {
wp_deregister_script('jquery');
wp_register_script('jquery', "http" . ($_SERVER['SERVER_PORT'] == 443 ? "s" : "") . "://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js", false, null);
wp_enqueue_script('jquery');
wp_enqueue_script('my_script', get_bloginfo('template_url') . '/js/theme.js', array('jquery'), '1.0', true);
}
【将jquery和自定义脚本添加到WordPress主题】我已将此代码添加到我的functions.php文件中, 并使用以下语法在其中创建了一个js文件夹并创建了theme.js文件:
jQuery(function ($) {
/* You can safely use $ in this code block to reference jQuery */
});
当我刷新WP网站时, 似乎未调用theme.js文件。在Chrome开发工具中, 未在呈现的js文件中列出该文件。
我是否使用过时的方法?如何使用jquery使/js/theme.js文件适合我的主题?
#1首先, wp_enqueue_scripts仅在前端运行, 因此你不需要进行is_admin()检查。
其次, 只有在你真正知道自己在做什么的情况下, 才注销默认的jQuery(与WP捆绑在一起)。在你的示例中, 你正在从Google加载过时的版本(当前版本为1.8.3, 而不是1.7.1)。另请参阅:不要让WordPress的jQuery出队
第三, 你应该使用get_stylesheet_directory_uri, 这是将适用于父主题文件夹和子主题文件夹的正确函数。
最后, 此代码可以在/themes/my-theme/functions.php中正常运行:
add_action( "wp_enqueue_scripts", "my_js_so_14864221", 11 );
function my_js_so_14864221()
{
wp_enqueue_script(
'my_script', get_stylesheet_directory_uri() . '/js/theme.js', array( 'jquery' ), '1.0', true
);
}
并且你的theme.js中的jQuery代码应封装为:
jQuery(document).ready(function($) {
// $('#your-stuff').animate().hide().whatever();
});
推荐阅读
- 向自定义WordPress主题添加菜单支持
- 将额外字段添加到WordPress用户配置文件
- 在WordPress子主题中添加自定义脚本
- 在wordpress中为ul添加类
- 将类添加到menu_class到wp_nav_menu中,将类添加到div而不是ul
- 在WordPress管理员中添加jQuery脚本
- 在WordPress中添加管理菜单分隔符
- 将编辑器添加到WordPress主题页面
- 关于WordPress主题架构(一个index.php与多个模板文件)