WordPress主题中引入公共js教程

WordPress主题中引入公共js教程

在 WordPress 主题中引入公共的 JavaScript 文件,可以按照以下步骤进行操作:

1. 在主题根目录下创建一个名为 js 的文件夹;

2. 在 js 文件夹下创建一个名为 common.js 的文件,并编写需要共享的 JavaScript 代码;

3. 在主题的 functions.php 文件中添加以下代码:

function load_custom_script() {
wp_enqueue_script(
'common-js', // 注册的脚本名称
get_template_directory_uri() . '/js/common.js', // 公共 JS 文件的路径
array(), // 依赖项数组
'1.0', // 版本号
true // 是否在页面底部加载
);
}
add_action('wp_enqueue_scripts', 'load_custom_script');

4. 保存 functions.php 文件并上传到网站的主题文件夹下。

上述代码中,我们使用了 wp_enqueue_script() 函数来注册并加载公共的 JavaScript 文件。其中,第一个参数是注册的脚本名称,可以任意指定;第二个参数则是公共 JS 文件的路径,我们使用了 get_template_directory_uri() 函数来获取主题根目录的路径,并在其后面加上 js/common.js 来指定公共 JS 文件的路径;第三个参数是依赖项数组,可以为空数组;第四个参数是版本号,可以任意指定;第五个参数则表示是否在页面底部加载 JS 文件,这里我们将其设置为 true,表示在页面底部加载。

最后,在需要使用公共 JavaScript 文件的模板文件中调用 wp_enqueue_script() 函数即可,例如在 header.php 中添加以下代码:

<?php wp_enqueue_script('common-js'); ?>

这样就可以在 header.php 直接调用公共 JavaScript 文件了。

© 版权声明
THE END
喜欢就支持一下吧
点赞14 分享