让子 CSS 文件在 DIVI 主题 Wordpress 中最后加载
Let the child CSS file load last in the DIVI Theme Wordpress
通过以下代码,我集成了 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' />
Divi>core>components>PageResource.php.CSS第454行生成文件CSS。
/**
* 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 文件吗?
如果它不在生产中,您可以尝试禁用静态 CSS 文件生成,在 Divi 主题选项 > 生成器 > 高级中。
接缝更新导致它停止工作。
这里有一个更新:https://diviengine.com/set-divi-child-theme-dynamic-css/#comment-175924(不适合我)。
有了挂钩 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' ) );
}
感谢来自 Elegant Themes 的 Andrei 带钩的尖端。
通过以下代码,我集成了 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' />
Divi>core>components>PageResource.php.CSS第454行生成文件CSS。
/**
* 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 文件吗?
如果它不在生产中,您可以尝试禁用静态 CSS 文件生成,在 Divi 主题选项 > 生成器 > 高级中。
接缝更新导致它停止工作。
这里有一个更新:https://diviengine.com/set-divi-child-theme-dynamic-css/#comment-175924(不适合我)。
有了挂钩 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' ) );
}
感谢来自 Elegant Themes 的 Andrei 带钩的尖端。