WordPress网站怎么快速简单的通过function.php来加载js文件和css文件，WordPress优化加速

在开发WordPress主题的时候，可以直接在head标签中写下需要的js或者css，但是这种加载方式已经不提倡了。现在 WordPress 主题通过 function.php 加载 js 和 css 文件。

基本架构

//加载css和js

函数 wpdie_add_scripts() {

wp_enqueue_style('style', get_template_directory_uri() . '/style.css');

$jq = get_template_directory_uri() 。 '/js/jquery.min.js';

wp_deregister_script('jquery');

wp_register_script('jquery', $jq);

wp_enqueue_script('jquery');

//在文章页面加载prism.css

如果(is_single()){

wp_enqueue_style('prism', get_template_directory_uri() . '/css/prism.css');

}

//在底部加载js，注意true。在标题中留空

wp_register_script('aosjs', get_template_directory_uri() . '/js/aos.js', array('jquery'), '');

wp_enqueue_script('aosjs',false,array(),'',true);

wp_enqueue_style('fa', get_template_directory_uri() . '/css/font-awesome/font-awesome.css');

}

add_action('wp_enqueue_scripts', 'wpdie_add_scripts');

有两个常用的 add_action 钩子可以将脚本和 CSS 加载到 WordPress 中：

init：确保始终为您的网站标题（如果使用 home.php、index.php 或模板文件）以及其他“前端”帖子、页面和模板样式加载脚本和 CSS。

wp_enqueue_scripts：“正确”的钩子方法，可能并不总是有效，具体取决于您的 WordPress 设置。

注意事项

这样加载css和js的时候，你会发现你使用的wordpress程序的版本号暴露在每个文件后面。平心而论，为了安全起见，这东西需要被屏蔽。怎么看：

函数 wpdie_remove_cssjs_ver( $src ) {

if( strpos( $src, 'ver=' ) )

$src = remove_query_arg('ver', $src);

返回 $src;

}

add_filter('style_loader_src', 'wpdie_remove_cssjs_ver', 999);

add_filter('script_loader_src', 'wpdie_remove_cssjs_ver', 999);

通过上面的代码，不仅css和js都被正确加载了。

另外，你还需要注意，这个方法需要你在head标签中包含和 这种功能还可以。

这几篇文章你可能也喜欢：

• BlueHost教程:如何在WordPress中创建目录？（wordpress无法创建目录）
• 修改后wordpress固定链接打不开的问题解决方案(WordPress地址修改了怎么办)
• 什么是wordpress页面编辑器？
• wordpress主题集在哪里(wordpress主题在哪个文件夹中)
• wordpress插件文件夹（wordpress文档插件）在哪

本文由主机参考刊发，转载请注明：WordPress网站怎么快速简单的通过function.php来加载js文件和css文件，WordPress优化加速 https://zhujicankao.com/66856.html