| @@ -16,48 +16,26 @@ | ||
| 16 | 16 | * |
| 17 | 17 | * @return void |
| 18 | 18 | */ |
| 19 | 19 | function gutenberg_enqueue_global_styles() { |
| 20 | - $assets_on_demand = wp_should_load_block_assets_on_demand(); | |
| 20 | + $separate_assets = wp_should_load_separate_core_block_assets(); | |
| 21 | 21 | $is_block_theme = wp_is_block_theme(); |
| 22 | 22 | $is_classic_theme = ! $is_block_theme; |
| 23 | 23 | |
| 24 | - /** | |
| 25 | - * Global styles should be printed in the HEAD for block themes, or for classic themes when loading assets on | |
| 26 | - * demand is disabled (which is no longer the default since WordPress 6.9). | |
| 24 | + /* | |
| 25 | + * Global styles should be printed in the head when loading all styles combined. | |
| 26 | + * The footer should only be used to print global styles for classic themes with separate core assets enabled. | |
| 27 | 27 | * |
| 28 | - * @link https://core.trac.wordpress.org/ticket/53494 | |
| 29 | - * @link https://core.trac.wordpress.org/ticket/61965 | |
| 28 | + * See https://core.trac.wordpress.org/ticket/53494. | |
| 30 | 29 | */ |
| 31 | 30 | if ( |
| 32 | - doing_action( 'wp_footer' ) && | |
| 33 | - ( | |
| 34 | - $is_block_theme || | |
| 35 | - ( $is_classic_theme && ! $assets_on_demand ) | |
| 36 | - ) | |
| 31 | + ( $is_block_theme && doing_action( 'wp_footer' ) ) || | |
| 32 | + ( $is_classic_theme && doing_action( 'wp_footer' ) && ! $separate_assets ) || | |
| 33 | + ( $is_classic_theme && doing_action( 'wp_enqueue_scripts' ) && $separate_assets ) | |
| 37 | 34 | ) { |
| 38 | 35 | return; |
| 39 | 36 | } |
| 40 | 37 | |
| 41 | - /** | |
| 42 | - * The footer should only be used for classic themes when loading assets on demand is enabled. In WP 6.9 this is the | |
| 43 | - * default with the introduction of hoisting late-printed styles (via {@see wp_load_classic_theme_block_styles_on_demand()}). | |
| 44 | - * So even though the main global styles are not printed here in the HEAD for classic themes with on-demand asset | |
| 45 | - * loading, a placeholder for the global styles is still enqueued. Then when {@see wp_hoist_late_printed_styles()} | |
| 46 | - * processes the output buffer, it can locate the placeholder and inject the global styles from the footer into the | |
| 47 | - * HEAD, replacing the placeholder. | |
| 48 | - * | |
| 49 | - * @link https://core.trac.wordpress.org/ticket/64099 | |
| 50 | - */ | |
| 51 | - if ( $is_classic_theme && doing_action( 'wp_enqueue_scripts' ) && $assets_on_demand ) { | |
| 52 | - if ( has_action( 'wp_template_enhancement_output_buffer_started', 'wp_hoist_late_printed_styles' ) ) { | |
| 53 | - wp_register_style( 'wp-global-styles-placeholder', false ); | |
| 54 | - wp_add_inline_style( 'wp-global-styles-placeholder', ':root { --wp-internal-comment: "Placeholder for wp_hoist_late_printed_styles() to replace with the global-styles printed at wp_footer." }' ); | |
| 55 | - wp_enqueue_style( 'wp-global-styles-placeholder' ); | |
| 56 | - } | |
| 57 | - return; | |
| 58 | - } | |
| 59 | - | |
| 60 | 38 | /* |
| 61 | 39 | * If loading the CSS for each block separately, then load the theme.json CSS conditionally. |
| 62 | 40 | * This removes the CSS from the global-styles stylesheet and adds it to the inline CSS for each block. |
| 63 | 41 | * This filter must be registered before calling wp_get_global_stylesheet(); |
| @@ -64,58 +42,47 @@ | ||
| 64 | 42 | */ |
| 65 | 43 | add_filter( 'wp_theme_json_get_style_nodes', 'wp_filter_out_block_nodes' ); |
| 66 | 44 | |
| 67 | 45 | $stylesheet = gutenberg_get_global_stylesheet(); |
| 46 | + if ( empty( $stylesheet ) ) { | |
| 47 | + return; | |
| 48 | + } | |
| 68 | 49 | |
| 50 | + wp_register_style( 'global-styles', false ); | |
| 51 | + wp_add_inline_style( 'global-styles', $stylesheet ); | |
| 52 | + wp_enqueue_style( 'global-styles' ); | |
| 53 | + | |
| 54 | + // Add each block as an inline css. | |
| 55 | + gutenberg_add_global_styles_for_blocks(); | |
| 56 | + | |
| 69 | 57 | /* |
| 70 | - * For block themes, merge Customizer's custom CSS into the global styles stylesheet | |
| 71 | - * before the global styles custom CSS, ensuring proper cascade order. | |
| 72 | - * For classic themes, let the Customizer CSS print separately via wp_custom_css_cb() | |
| 73 | - * at priority 101 in wp_head, preserving its position at the end of the <head>. | |
| 58 | + * Add the custom CSS for the global styles. | |
| 59 | + * Before that, dequeue the Customizer's custom CSS | |
| 60 | + * and add it before the global styles custom CSS. | |
| 61 | + * Don't enqueue Customizer's custom CSS separately. | |
| 74 | 62 | */ |
| 75 | - if ( $is_block_theme ) { | |
| 76 | - /* | |
| 77 | - * Dequeue the Customizer's custom CSS | |
| 78 | - * and add it before the global styles custom CSS. | |
| 79 | - */ | |
| 80 | - remove_action( 'wp_head', 'wp_custom_css_cb', 101 ); | |
| 63 | + remove_action( 'wp_head', 'wp_custom_css_cb', 101 ); | |
| 81 | 64 | |
| 65 | + $custom_css = wp_get_custom_css(); | |
| 66 | + | |
| 67 | + if ( ! wp_should_load_separate_core_block_assets() ) { | |
| 82 | 68 | /* |
| 83 | - * Get the custom CSS from the Customizer and add it to the global stylesheet. | |
| 84 | - * Always do this in Customizer preview for the sake of live preview since it be empty. | |
| 69 | + * If loading all block assets together, add both | |
| 70 | + * the base and block custom CSS at once. Else load | |
| 71 | + * the base custom CSS only, and the block custom CSS | |
| 72 | + * will be added to the inline CSS for each block in | |
| 73 | + * gutenberg_add_global_styles_block_custom_css(). | |
| 85 | 74 | */ |
| 86 | - $custom_css = trim( wp_get_custom_css() ); | |
| 87 | - if ( $custom_css || is_customize_preview() ) { | |
| 88 | - if ( is_customize_preview() ) { | |
| 89 | - /* | |
| 90 | - * When in the Customizer preview, wrap the Custom CSS in milestone comments to allow customize-preview.js | |
| 91 | - * to locate the CSS to replace for live previewing. Make sure that the milestone comments are omitted from | |
| 92 | - * the stored Custom CSS if by chance someone tried to add them, which would be highly unlikely, but it | |
| 93 | - * would break live previewing. | |
| 94 | - */ | |
| 95 | - $before_milestone = '/*BEGIN_CUSTOMIZER_CUSTOM_CSS*/'; | |
| 96 | - $after_milestone = '/*END_CUSTOMIZER_CUSTOM_CSS*/'; | |
| 97 | - $custom_css = str_replace( array( $before_milestone, $after_milestone ), '', $custom_css ); | |
| 98 | - $custom_css = $before_milestone . "\n" . $custom_css . "\n" . $after_milestone; | |
| 99 | - } | |
| 100 | - $custom_css = "\n" . $custom_css; | |
| 101 | - } | |
| 102 | - $stylesheet .= $custom_css; | |
| 103 | - | |
| 104 | - // Add the global styles custom CSS at the end. | |
| 105 | - $stylesheet .= gutenberg_get_global_stylesheet( array( 'custom-css' ) ); | |
| 75 | + $custom_css .= gutenberg_get_global_styles_custom_css(); | |
| 76 | + } else { | |
| 77 | + $custom_css .= gutenberg_get_global_styles_base_custom_css(); | |
| 106 | 78 | } |
| 107 | 79 | |
| 108 | - if ( empty( $stylesheet ) ) { | |
| 109 | - return; | |
| 80 | + if ( ! empty( $custom_css ) ) { | |
| 81 | + wp_add_inline_style( 'global-styles', $custom_css ); | |
| 110 | 82 | } |
| 111 | 83 | |
| 112 | - wp_register_style( 'global-styles', false ); | |
| 113 | - wp_add_inline_style( 'global-styles', $stylesheet ); | |
| 114 | - wp_enqueue_style( 'global-styles' ); | |
| 115 | - | |
| 116 | - // Add each block as an inline css. | |
| 117 | - gutenberg_add_global_styles_for_blocks(); | |
| 84 | + gutenberg_add_global_styles_block_custom_css(); | |
| 118 | 85 | } |
| 119 | 86 | add_action( 'wp_enqueue_scripts', 'gutenberg_enqueue_global_styles' ); |
| 120 | 87 | add_action( 'wp_footer', 'gutenberg_enqueue_global_styles', 1 ); |
| 121 | 88 | |
