让子 CSS 文件在 DIVI Theme Wordpress 中最后加载

Question

通过以下代码，我集成了 Divi 子主题的 CSS 文件。

add_action( 'wp_enqueue_scripts', 'divi_engine_dynamic_child_theme', 20 );
function divi_engine_dynamic_child_theme() {
    wp_enqueue_style( 'parent-theme', get_template_directory_uri() . '/style.css', array(), et_get_theme_version() );
    wp_dequeue_style( 'divi-style' );
    wp_enqueue_style( 'child-theme', get_stylesheet_uri(), array(), filemtime( get_stylesheet_directory() . '/style.css' ) );
 }

下面是从主题加载的动态 CSS 文件：cached-inline-styles。

<link rel='stylesheet' id='et-core-unified-tb-63-tb-46-48-cached-inline-styles-css'  href='https://domain.de/wp-content/et-cache/48/et-core-unified-tb-63-tb-46-48.min.css?ver=1630180326' type='text/css' media='all' />

CSS文件在Divi>core>components>PageResource.php的第454行生成。

/**
 * Enqueues static file for provided style resource.
 *
 * @param ET_Core_PageResource $resource
 */
protected static function _enqueue_style( $resource ) {
    if ( 'footer' === self::$current_output_location ) {
        return;
    }

    // Bust PHP's stats cache for the resource file to ensure we get the latest timestamp.
    clearstatcache( true, $resource->path );

    $can_enqueue = 0 === did_action( 'wp_print_scripts' );
    // reason: We do this on purpose when a style can't be enqueued.
    // phpcs:disable WordPress.WP.EnqueuedResources.NonEnqueuedStylesheet
    $template = '<link rel="stylesheet" id="%1$s" href="%2$s" />';
    // phpcs:enable
    $timestamp = filemtime( $resource->path );

    if ( $can_enqueue ) {
        wp_enqueue_style( $resource->slug, set_url_scheme( $resource->url ), array(), $timestamp );
    } else {
        // reason: this whole file needs to be converted.
        // phpcs:disable ET.Sniffs.ValidVariableName.UsedPropertyNotSnakeCase
        $timestamp = $timestamp ?: ET_CORE_VERSION;
        $slug      = esc_attr( $resource->slug );
        $scheme    = esc_url( set_url_scheme( $resource->url . "?ver={$timestamp}" ) );
        $tag       = sprintf( $template, $slug, $scheme );
        $onload    = et_core_esc_previously( self::$_onload );
        // phpcs:enable

        $tag = apply_filters( 'et_core_page_resource_tag', $tag, $slug, $scheme, $onload );

        print( et_core_esc_previously( $tag ) );
    }

    $resource->enqueued = true;
}

有人知道如何将子主题 CSS 文件加载为最后一个 css 文件吗？

Answer 1

使用钩子 wp_footer 我可以稍后加载自定义 CSS！

add_action( 'wp_enqueue_scripts', 'custom_styles', 105 ); // 102 is the latest used number from parent theme
function custom_styles() {
    //wp_enqueue_style( 'parent-theme', get_template_directory_uri() . '/style.css', array(), et_get_theme_version() );
    wp_dequeue_style( 'divi-style' );
    wp_deregister_style( 'divi-style' );
    //wp_enqueue_style( 'child-theme', get_stylesheet_uri(), array(), filemtime( get_stylesheet_directory() . '/style.css' ) );
}

// add Child Theme CSS as last
add_action('wp_footer', 'custom_styles_footer'); 
function custom_styles_footer() { 
    wp_enqueue_style( 'child-theme', get_stylesheet_uri(), array(), filemtime( get_stylesheet_directory() . '/style.css' ) );
}

感谢来自优雅主题的 Andrei 的提示。

Answer 2

如果它不在生产中，您可以尝试在 Divi Theme Options > Builder > Advanced 中禁用静态 CSS 文件生成。

接缝更新导致它停止工作。

这里有一个更新：https://diviengine.com/set-divi-child-theme-dynamic-css/#comment-175924（不适合我）。