在模板中直接使用link標(biāo)簽引用css樣式文件是在wordpress主題開發(fā)中常用的方法,但這不是wordpress正確的引用css文件的方法,wordpress正確引用方法是使用wp_enqueue_style()函數(shù)。
語(yǔ)法結(jié)構(gòu)
<?php wp_enqueue_style($handle, $src, $deps, $ver, $media); ?>
參數(shù)
$handle – 調(diào)用的樣式文件名稱,唯一性,因此不能和其它c(diǎn)ss文件命名相同。
$src – css文件的路徑(即url),不要直接使用域名url,要使用路徑函數(shù),如get_template_directory_uri()來(lái)獲取主題目錄中的樣式文件。
$deps – 依賴關(guān)系,如果丟失某些其他樣式文件將導(dǎo)致你的樣式表將無(wú)法正常工作,你可以使用該參數(shù)設(shè)置“依賴關(guān)系”。,非必需。
$ver – 加載的css文件的版本號(hào),可以使用主題的版本號(hào)或隨意自定義一個(gè),設(shè)置為null則不使用版本號(hào)。默認(rèn)為false,使用WordPress的版本號(hào)。
$media – 是指CSS的媒體類型,比如“screen”或“handheld”或“print”。如果不知道是否需要,就留空。默認(rèn)為“all”。
通過(guò)wp_enqueue_style()函數(shù)加載css文件時(shí),應(yīng)該將它分配給一個(gè)鉤子,如只在前臺(tái)調(diào)用,使用鉤子wp_enqueue_scripts;只在后臺(tái)調(diào)用,使用admin_enqueue_scripts;用在WP登陸頁(yè)面加載則使用login_enqueue_scripts。
<?php
function tone_front_boot(){
wp_enqueue_style( 'bootstrap', get_template_directory_uri() . '/css/bootstrap.css' );
}
add_action( 'wp_enqueue_scripts', 'tone_front_boot' );
?>
只在后臺(tái)調(diào)用
<?php
function tone_admin_boot(){
wp_enqueue_style( 'bootstrap', get_template_directory_uri() . '/css/bootstrap.css' );
}
add_action( 'admin_enqueue_scripts', 'tone_admin_boot' );
?>
另外一種方法,使用wp_head鉤子和admin_head鉤子
為WordPress后臺(tái)添加css和js代碼
<?php
function admin_jscss() {
wp_enqueue_style( 'admin-myjscss', get_template_directory_uri() . '/css/bootstrap.css' );
wp_enqueue_script('admin-myjscss', get_template_directory_uri() . '/js/bootstrap.js' );
wp_enqueue_script( 'admin-myjscss', get_template_directory_uri() . '/js/jquery.min.js' );
}
add_action('admin_head', 'admin_jscss');
?>