diff --git a/src/js/_enqueues/wp/customize/preview.js b/src/js/_enqueues/wp/customize/preview.js index bcff0bc25166c..5614c653009e1 100644 --- a/src/js/_enqueues/wp/customize/preview.js +++ b/src/js/_enqueues/wp/customize/preview.js @@ -639,7 +639,7 @@ * @return {void} */ custom_css: function( value ) { - $( '#wp-custom-css' ).text( value ); + $( '#wp-custom-css-inline-css' ).text( value ); }, /** diff --git a/src/wp-includes/script-loader.php b/src/wp-includes/script-loader.php index 3beddac135e43..81bbc0be38f4d 100644 --- a/src/wp-includes/script-loader.php +++ b/src/wp-includes/script-loader.php @@ -2535,20 +2535,6 @@ function wp_enqueue_global_styles() { $stylesheet = wp_get_global_stylesheet(); - if ( $is_block_theme ) { - /* - * Dequeue the Customizer's custom CSS - * and add it before the global styles custom CSS. - */ - remove_action( 'wp_head', 'wp_custom_css_cb', 101 ); - // Get the custom CSS from the Customizer and add it to the global stylesheet. - $custom_css = wp_get_custom_css(); - $stylesheet .= $custom_css; - - // Add the global styles custom CSS at the end. - $stylesheet .= wp_get_global_stylesheet( array( 'custom-css' ) ); - } - if ( empty( $stylesheet ) ) { return; } @@ -2557,6 +2543,24 @@ function wp_enqueue_global_styles() { wp_add_inline_style( 'global-styles', $stylesheet ); wp_enqueue_style( 'global-styles' ); + if ( $is_block_theme ) { + /* + * Dequeue the Customizer's custom CSS + * and add it before the global styles custom CSS. + */ + remove_action( 'wp_head', 'wp_custom_css_cb', 101 ); + $customizer_custom_css = wp_get_custom_css(); + wp_register_style( 'wp-custom-css', false ); + wp_add_inline_style( 'wp-custom-css', $customizer_custom_css ); + wp_enqueue_style( 'wp-custom-css' ); + + // Enqueue the global styles custom CSS. + $global_styles_custom_css = wp_get_global_stylesheet( array( 'custom-css' ) ); + wp_register_style( 'global-styles-custom-css', false ); + wp_add_inline_style( 'global-styles-custom-css', $global_styles_custom_css ); + wp_enqueue_style( 'global-styles-custom-css' ); + } + // Add each block as an inline css. wp_add_global_styles_for_blocks(); } diff --git a/src/wp-includes/theme.php b/src/wp-includes/theme.php index 6287edef40110..e18445b644d80 100644 --- a/src/wp-includes/theme.php +++ b/src/wp-includes/theme.php @@ -1958,7 +1958,7 @@ function wp_custom_css_cb() { if ( $styles || is_customize_preview() ) : $type_attr = current_theme_supports( 'html5', 'style' ) ? '' : ' type="text/css"'; ?> - id="wp-custom-css"> + id="wp-custom-css-inline-css">