让代码更简单

新版WordPress需使用wp_enqueue_script管理js与css

重要:本文最后更新于2021-10-16 10:42:25,某些文章具有时效性,若有错误或已失效,请在下方留言或联系代码狗

前几天在建英文站的时候遇到wordpress报告了一个警告,load_scripts报告的,具体记不住了。引起这个警告的原因是主题或插件未使用官方推荐的方式加载js与css,比如直接在 wp_headwp_footer 中输出js与css地址。正确的加载方式如下,取自DUX主题

复制
//https://www.daimadog.org/7792.html
// load script and style
add_action('wp_enqueue_scripts', '_load_scripts');
function _load_scripts() {
if (!is_admin()) {

$purl = get_stylesheet_directory_uri();

// common css
_cssloader(array( 'app' => 'app'));

_jsloader(array('loader'=>'loader'));


}
}
function _cssloader($arr) {
	foreach ($arr as $key => $item) {
		$href = $item;
		if (strstr($href, '//') === false) {
			$href = get_stylesheet_directory_uri() . '/css/' . $item . '.css';
		}
		wp_enqueue_style('_' . $key, $href, array(), THEME_VERSION, 'all');
	}
}
function _jsloader($arr) {
	foreach ($arr as $item) {
		wp_enqueue_script('_' . $item, get_stylesheet_directory_uri() . '/js/' . $item . '.js', array(), THEME_VERSION, true);
	}
}

通过 _cssloader 函数加载css,需提供以css文件名为键值的数组, _jsloader 函数加载js,使用方法与 _cssloader 相同。最后通过 wp_enqueue_scripts 钩子挂载函数进行加载,通过这种方式加载js与css,wordpress就不会再提示警告信息了。

感觉很棒!可以赞赏支持我哟~

0 打赏

评论 (1)

登录后评论
狗哥开始搞英文站了。
QQ咨询 邮件咨询 狗哥推荐