搬码资源网广告位搬码资源网广告位

WordPress指定页面按需加载 JavaScript

上面是搬码源码网 abnma.com 经由过程收集网络收拾整顿的代码片断。搬码源码网小编此刻分享给各人,也给各人做个参考。

在 wordpress 主题或插件中加载 JavaScript 时,民间保举的要领是应用 wp_enqueue_script() 来加载,该函数可以指定 JavaScript 的依靠库,指定 JavaScript 文件的版本,设置在页面头部或许底部加载,很是矫捷和利便。可是,该插件短少指定在某些页面加载 JavaScript 的设置参数。所幸的是,咱们可以经由过程 WordPress 的函数本身下手来完成这个功效。

当一个比力年夜的库只在某一个或几个页面应用时,咱们不需求在每个页面上加载一切剧本,而只要要在特定的页面模板中加载即可,以免其余页面加载不需求的 JavaScript 文件而影响页面关上速率,增长办事器开支。

好比,咱们的主题中有一个名为 “Portfolio Archive” 的页面模板,在这个模板中,咱们需求应用 “imagesloaded、masonry、isotope、jquery-ias” 这 4 个 JavaScript 插件来完成这个页面的后果,而这些库在其余页面都是用不上的,假如间接在全数页面加载,每个页面城市加载这 4 个库,纵然是这个页面不需求应用这些库来完成后果。

只在应用了某个页面模板的页面上加载指定的 JavaScript 文件吗,鄙人面的代码中,首页咱们加载了每个页面都需求的 jQuery 和 Main.js 文件,然后判定以后页面是否应用了指定的页面模板,然后按照判定成果加载指定页面模板需求的 JavaScript 文件。

//注册加载函数到 hook 上

add_action('wp_enqueue_scripts','my_theme_load_scripts');

// 加载样式和剧本

function my_theme_load_scripts(){

wp_enqueue_script('jquery');

// 加载每个页面都需求的 JavaScript 文件

wp_enqueue_script('my_second_script',get_template_directory_uri() . '/js/main.js');

if(is_page()){ //查抄以后页面

global $wp_query;

// 插件是否应用了某页面模板

$template_name = get_post_meta( $wp_query->post->ID,'_wp_page_template',true );

if($template_name == 'portfolio-archive.php'){

// 假如应用了指定的页面模板,加载需求库

wp_enqueue_script('my_third_script',get_template_directory_uri() .'/js/imagesloaded.js');

...

}

}

}

在现实的 WordPress 主题开发事情中,并不是每个主题都需求这么操作。假如某主题应用的 JavaScript 文件比力少,全数加载一路也没有多年夜,咱们完全可以把这些 JavaScript 文件归并在一路文件中,如许不单可以削减页面哀求数,还可以把剧本文件缓存到客户端,关上下一个页面的时辰不消再下载一次。详细什么时辰归并代码到一个文件,什么时辰拆分代码按需加载,要望主题的现实环境,矫捷断定。

以上是搬码源码网(abnma.com)为你网络收拾整顿的全数代码内容,但愿文章可以或许帮你解决所碰到的步伐开提问题。假如感觉搬码源码网网站内容还不错,接待将搬码源码网网站保举给步伐员挚友。

总结

以上是搬码源码网为你网络收拾整顿的指定 WordPress 页面按需加载 JavaScript全数内容,但愿文章可以或许帮你解决指定 WordPress 页面按需加载 JavaScript所碰到的步伐开提问题。

假如感觉搬码源码网网站内容还不错,接待将搬码源码网网站保举给步伐员挚友。

0
分享到:
搬码资源网广告位

评论0

请先

为了配合净网行动 , 本站下架所有娱乐源码 , 如有疑问 , 请联系站长qq 43233524
没有账号? 忘记密码?