wordpress添加js和css的正确方式

其中wp_enqueue_style语法结构:
<?php wp_enqueue_style($handle, $src, $deps, $ver, $media); ?>
解释:
$handle – 样式名字,就是添加后的样式表id,具有唯一性
$src – css文件路径,可以动态获取:get_template_directory_uri()
$deps – 依赖,如上面的例子,依赖uikit.css,则uikit.css加载的时候会排在iven.css之前,对排序有作用
$ver – 版本号,默认的话就是wp的版本号,上面例子改为了动态调用主题的版本号
$media – 媒体类型,如”screen”,”handheld”,”print”,默认为all

如:给style.css添加动态版本号,获取主题的版本号,再把版本号加到动态加载的样式里
一、定义函数
function iven_style(){
$version = wp_get_theme() -> get( ‘Version’ );
wp_enqueue_style(‘iven-style’, get_template_directory_uri().”/style.css”, array(‘uikit-css’), $version, ‘all’);
wp_enqueue_style(‘uikit-css’, get_template_directory_uri().”/uikit.css”, array(), ‘3.6.14’, ‘all’);
}
二、添加钩子
add_action(‘wp_enqueue_scripts’,’ iven_style’);
// 前台调用,使用钩子 “wp_enqueue_scripts”
// 后台调用,使用钩子 “admin_enqueue_scripts”
// 仅在登录页调用,使用钩子 “login_enqueue_scripts”
// 同时可以使用 wp_head 和 admin_head 钩子,如: add_action(‘wp_head’,’ iven_style’);

第二: 一个类似的函数,wp_enqueue_script 使用方式同上,专门调用js的。
<?php wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer ); ?>
$handle – 样式名字,就是添加后的样式表id,具有唯一性
$src – css文件路径,可以动态获取:get_template_directory_uri()
$deps – 依赖,如上面的例子,依赖uikit.css,则uikit.css加载的时候会排在iven.css之前,对排序有作用
$ver – 版本号,默认的话就是wp的版本号,上面例子改为了动态调用主题的版本号
$in_footer – 是否在页面末尾调用,也就是wp_footer里,若为否,则会在wp_head里调用了。