diff --git a/wp-includes/block-editor.php b/wp-includes/block-editor.php index fdc4846f69..00633d4d7e 100644 --- a/wp-includes/block-editor.php +++ b/wp-includes/block-editor.php @@ -532,7 +532,7 @@ function get_block_editor_settings( array $custom_settings, $block_editor_contex * entered by users does not break other global styles. */ $global_styles[] = array( - 'css' => wp_get_global_styles_custom_css(), + 'css' => wp_get_global_stylesheet( array( 'custom-css' ) ), '__unstableType' => 'user', 'isGlobalStyles' => true, ); diff --git a/wp-includes/class-wp-theme-json.php b/wp-includes/class-wp-theme-json.php index 0cd90575a5..90de255c82 100644 --- a/wp-includes/class-wp-theme-json.php +++ b/wp-includes/class-wp-theme-json.php @@ -1423,6 +1423,12 @@ class WP_Theme_JSON { $stylesheet .= $this->get_preset_classes( $setting_nodes, $origins ); } + // Load the custom CSS last so it has the highest specificity. + if ( in_array( 'custom-css', $types, true ) ) { + // Add the global styles root CSS. + $stylesheet .= _wp_array_get( $this->theme_json, array( 'styles', 'css' ) ); + } + return $stylesheet; } @@ -1467,10 +1473,12 @@ class WP_Theme_JSON { * Returns the global styles custom CSS. * * @since 6.2.0 + * @deprecated 6.7.0 Use {@see 'get_stylesheet'} instead. * * @return string The global styles custom CSS. */ public function get_custom_css() { + _deprecated_function( __METHOD__, '6.7.0', 'get_stylesheet' ); // Add the global styles root CSS. $stylesheet = isset( $this->theme_json['styles']['css'] ) ? $this->theme_json['styles']['css'] : ''; @@ -2692,6 +2700,7 @@ class WP_Theme_JSON { 'duotone' => $duotone_selector, 'features' => $feature_selectors, 'variations' => $variation_selectors, + 'css' => $selector, ); if ( isset( $theme_json['styles']['blocks'][ $name ]['elements'] ) ) { @@ -2908,7 +2917,7 @@ class WP_Theme_JSON { } } - // 7. Generate and append any custom CSS rules pertaining to nested block style variations. + // 7. Generate and append any custom CSS rules. if ( isset( $node['css'] ) && ! $is_root_selector ) { $block_rules .= $this->process_blocks_custom_css( $node['css'], $selector ); } diff --git a/wp-includes/default-filters.php b/wp-includes/default-filters.php index 2c182747a5..6fba4441d5 100644 --- a/wp-includes/default-filters.php +++ b/wp-includes/default-filters.php @@ -600,9 +600,6 @@ add_filter( 'block_editor_settings_all', 'wp_add_editor_classic_theme_styles' ); add_action( 'wp_enqueue_scripts', 'wp_enqueue_global_styles' ); add_action( 'wp_footer', 'wp_enqueue_global_styles', 1 ); -// Global styles custom CSS. -add_action( 'wp_enqueue_scripts', 'wp_enqueue_global_styles_custom_css' ); - // Block supports, and other styles parsed and stored in the Style Engine. add_action( 'wp_enqueue_scripts', 'wp_enqueue_stored_styles' ); add_action( 'wp_footer', 'wp_enqueue_stored_styles', 1 ); diff --git a/wp-includes/deprecated.php b/wp-includes/deprecated.php index 8084cdd96c..457b7fc136 100644 --- a/wp-includes/deprecated.php +++ b/wp-includes/deprecated.php @@ -6310,3 +6310,80 @@ function wp_interactivity_process_directives_of_interactive_blocks( array $parse _deprecated_function( __FUNCTION__, '6.6.0' ); return $parsed_block; } + +/** + * Gets the global styles custom CSS from theme.json. + * + * @since 6.2.0 + * @deprecated 6.7.0 Use {@see 'wp_get_global_stylesheet'} instead. + * + * @return string The global styles custom CSS. + */ +function wp_get_global_styles_custom_css() { + _deprecated_function( __FUNCTION__, '6.7.0', 'wp_get_global_stylesheet' ); + if ( ! wp_theme_has_theme_json() ) { + return ''; + } + /* + * Ignore cache when the development mode is set to 'theme', so it doesn't interfere with the theme + * developer's workflow. + */ + $can_use_cached = ! wp_is_development_mode( 'theme' ); + + /* + * By using the 'theme_json' group, this data is marked to be non-persistent across requests. + * @see `wp_cache_add_non_persistent_groups()`. + * + * The rationale for this is to make sure derived data from theme.json + * is always fresh from the potential modifications done via hooks + * that can use dynamic data (modify the stylesheet depending on some option, + * settings depending on user permissions, etc.). + * See some of the existing hooks to modify theme.json behavior: + * @see https://make.wordpress.org/core/2022/10/10/filters-for-theme-json-data/ + * + * A different alternative considered was to invalidate the cache upon certain + * events such as options add/update/delete, user meta, etc. + * It was judged not enough, hence this approach. + * @see https://github.com/WordPress/gutenberg/pull/45372 + */ + $cache_key = 'wp_get_global_styles_custom_css'; + $cache_group = 'theme_json'; + if ( $can_use_cached ) { + $cached = wp_cache_get( $cache_key, $cache_group ); + if ( $cached ) { + return $cached; + } + } + + $tree = WP_Theme_JSON_Resolver::get_merged_data(); + $stylesheet = $tree->get_custom_css(); + + if ( $can_use_cached ) { + wp_cache_set( $cache_key, $stylesheet, $cache_group ); + } + + return $stylesheet; +} + +/** + * Enqueues the global styles custom css defined via theme.json. + * + * @since 6.2.0 + * @deprecated 6.7.0 Use {@see 'wp_enqueue_global_styles'} instead. + */ +function wp_enqueue_global_styles_custom_css() { + _deprecated_function( __FUNCTION__, '6.7.0', 'wp_enqueue_global_styles' ); + if ( ! wp_is_block_theme() ) { + return; + } + + // Don't enqueue Customizer's custom CSS separately. + remove_action( 'wp_head', 'wp_custom_css_cb', 101 ); + + $custom_css = wp_get_custom_css(); + $custom_css .= wp_get_global_styles_custom_css(); + + if ( ! empty( $custom_css ) ) { + wp_add_inline_style( 'global-styles', $custom_css ); + } +} diff --git a/wp-includes/global-styles-and-settings.php b/wp-includes/global-styles-and-settings.php index b413273a64..efa68ce36b 100644 --- a/wp-includes/global-styles-and-settings.php +++ b/wp-includes/global-styles-and-settings.php @@ -243,58 +243,6 @@ function wp_get_global_stylesheet( $types = array() ) { return $stylesheet; } -/** - * Gets the global styles custom CSS from theme.json. - * - * @since 6.2.0 - * - * @return string The global styles custom CSS. - */ -function wp_get_global_styles_custom_css() { - if ( ! wp_theme_has_theme_json() ) { - return ''; - } - /* - * Ignore cache when the development mode is set to 'theme', so it doesn't interfere with the theme - * developer's workflow. - */ - $can_use_cached = ! wp_is_development_mode( 'theme' ); - - /* - * By using the 'theme_json' group, this data is marked to be non-persistent across requests. - * @see `wp_cache_add_non_persistent_groups()`. - * - * The rationale for this is to make sure derived data from theme.json - * is always fresh from the potential modifications done via hooks - * that can use dynamic data (modify the stylesheet depending on some option, - * settings depending on user permissions, etc.). - * See some of the existing hooks to modify theme.json behavior: - * @see https://make.wordpress.org/core/2022/10/10/filters-for-theme-json-data/ - * - * A different alternative considered was to invalidate the cache upon certain - * events such as options add/update/delete, user meta, etc. - * It was judged not enough, hence this approach. - * @see https://github.com/WordPress/gutenberg/pull/45372 - */ - $cache_key = 'wp_get_global_styles_custom_css'; - $cache_group = 'theme_json'; - if ( $can_use_cached ) { - $cached = wp_cache_get( $cache_key, $cache_group ); - if ( $cached ) { - return $cached; - } - } - - $tree = WP_Theme_JSON_Resolver::get_merged_data(); - $stylesheet = $tree->get_custom_css(); - - if ( $can_use_cached ) { - wp_cache_set( $cache_key, $stylesheet, $cache_group ); - } - - return $stylesheet; -} - /** * Adds global style rules to the inline style for each block. * diff --git a/wp-includes/script-loader.php b/wp-includes/script-loader.php index 715477ad8e..b7da065ad1 100644 --- a/wp-includes/script-loader.php +++ b/wp-includes/script-loader.php @@ -2504,6 +2504,20 @@ 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; } @@ -2516,27 +2530,6 @@ function wp_enqueue_global_styles() { wp_add_global_styles_for_blocks(); } -/** - * Enqueues the global styles custom css defined via theme.json. - * - * @since 6.2.0 - */ -function wp_enqueue_global_styles_custom_css() { - if ( ! wp_is_block_theme() ) { - return; - } - - // Don't enqueue Customizer's custom CSS separately. - remove_action( 'wp_head', 'wp_custom_css_cb', 101 ); - - $custom_css = wp_get_custom_css(); - $custom_css .= wp_get_global_styles_custom_css(); - - if ( ! empty( $custom_css ) ) { - wp_add_inline_style( 'global-styles', $custom_css ); - } -} - /** * Checks if the editor scripts and styles for all registered block types * should be enqueued on the current screen. diff --git a/wp-includes/version.php b/wp-includes/version.php index eb8deaade7..a06c5afd14 100644 --- a/wp-includes/version.php +++ b/wp-includes/version.php @@ -16,7 +16,7 @@ * * @global string $wp_version */ -$wp_version = '6.7-alpha-58702'; +$wp_version = '6.7-alpha-58703'; /** * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.