您可以简单地使插件css依赖于主题css,而子主题css依赖于插件css。
function wpdocs_custom_scripts() {
// example theme style
wp_enqueue_style( \'theme-style\', \'#\' );
// Plugin css
wp_enqueue_style( \'plugin-style\', \'#\', array( \'theme-style\' ) ); // see "theme-style" passed in $deps param,
// Child theme css
wp_enqueue_style( \'child-style\', \'#\', array( \'plugin-style\' ) ); // see "plugin-style" passed in $deps param,
}
add_action( \'wp_enqueue_scripts\', \'wpdocs_custom_scripts\' );
这样,它们将按以下顺序加载
<link rel=\'stylesheet\' id=\'theme-style-css\' href=\'#\' type=\'text/css\' />
<link rel=\'stylesheet\' id=\'plugin-style-css\' href=\'#\' type=\'text/css\' />
<link rel=\'stylesheet\' id=\'child-style-css\' href=\'#\' type=\'text/css\' />
Another Approach:您还可以使用中的priority参数
wp_enqueue_scripts
. 使优先级降低,以便更早加载。像这样
function wpdocs_custom_theme_scripts() {
// theme style
wp_enqueue_style( \'theme-style\', \'#\' );
}
add_action( \'wp_enqueue_scripts\', \'wpdocs_custom_theme_scripts\', 9 );
function wpdocs_custom_plugin_scripts() {
// Plugin css
wp_enqueue_style( \'plugin-style\', \'#\' );
}
add_action( \'wp_enqueue_scripts\', \'wpdocs_custom_plugin_scripts\', 10 );
function wpdocs_custom_child_scripts() {
// Child theme css
wp_enqueue_style( \'child-style\', \'#\' );
}
add_action( \'wp_enqueue_scripts\', \'wpdocs_custom_child_scripts\', 11 );