如何在父主题css之后加载wordpress子主题css

Question

在我的 wordpress 子主题 css 文件中，在主题 css 之前加载。 我的子主题 css functions.php 文件如下所示

function my_theme_enqueue_styles(){
  wp_enqueue_style( 'bootstrap', get_template_directory_uri() . '/../enfold-child/plugins/bootstrap/css/bootstrap.min.css' );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );

我想在父主题 css 之后加载子主题 css。

Answer 1

添加优先级。 这里 99 很高，所以它可能是最后一个，但一些插件可能会以更高的优先级添加 css，尽管这种情况很少见。

function my_theme_enqueue_styles(){
  wp_enqueue_style( 'bootstrap', get_template_directory_uri() . '/../enfold-child/plugins/bootstrap/css/bootstrap.min.css' );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles', 99 );

请参阅：https ://developer.wordpress.org/reference/functions/add_action/

Answer 2

根据文档（ https://codex.wordpress.org/Child_Themes ），将父样式设置为子样式的依赖项，并将其加载到您的functions.php中：

<?php
function my_theme_enqueue_styles() {
    // You'll find this somewhere in the parent theme in a wp_enqueue_style('parent-style').
    $parent_style = 'parent-style';

    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
        wp_get_theme()->get('Version')
    );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
?>

但请注意，某些主题使用多个样式表。 如果发生这种情况，您可以将它们中的任何一个添加到函数中，如下所示：

    $parent_style = 'parent-style';
    $parent_style2 = 'other-parent-style';

    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( $parent_style2, get_template_directory_uri() . '/inc/css/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style, $parent_style2 ),
        wp_get_theme()->get('Version')
    );

Answer 3

对于儿童主题get_stylesheet_directory_uri()

对于父主题get_template_directory_uri()

function my_theme_enqueue_styles() { 

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

wp_enqueue_style( 'owl-carousel-style', get_stylesheet_directory_uri() . '/assets/owlcarousel/assets/owl.carousel.min.css' );
wp_enqueue_style( 'owl-theme-style', get_stylesheet_directory_uri() . '/assets/owlcarousel/assets/owl.theme.default.min.css' );


wp_enqueue_script( 'owl-carousel-js', get_stylesheet_directory_uri() . '/assets/owlcarousel/owl.carousel.min.js', array(), '1.0.0', true );

}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );