From 2377ab2f566f98dcfa56d5b5c170947eb6e5a7ef Mon Sep 17 00:00:00 2001 From: Ashar Fuadi Date: Thu, 2 Jul 2026 15:23:24 +0700 Subject: [PATCH 1/2] Omnibar: move the 'site icon in admin bar' feature from experiment to 7.1 compat --- backport-changelog/7.1/11781.md | 3 + lib/compat/wordpress-7.1/admin-bar.php | 88 +++++++++++++++++++++++++ lib/experimental/experiments/load.php | 5 -- lib/experimental/omnibar/load.php | 89 -------------------------- lib/load.php | 2 +- 5 files changed, 92 insertions(+), 95 deletions(-) create mode 100644 backport-changelog/7.1/11781.md create mode 100644 lib/compat/wordpress-7.1/admin-bar.php delete mode 100644 lib/experimental/omnibar/load.php diff --git a/backport-changelog/7.1/11781.md b/backport-changelog/7.1/11781.md new file mode 100644 index 00000000000000..e1d3fe5feb02e4 --- /dev/null +++ b/backport-changelog/7.1/11781.md @@ -0,0 +1,3 @@ +https://github.com/WordPress/wordpress-develop/pull/11781 + +* https://github.com/WordPress/gutenberg/pull/79807 diff --git a/lib/compat/wordpress-7.1/admin-bar.php b/lib/compat/wordpress-7.1/admin-bar.php new file mode 100644 index 00000000000000..75ab4e05ba2f64 --- /dev/null +++ b/lib/compat/wordpress-7.1/admin-bar.php @@ -0,0 +1,88 @@ +get_node( 'site-name' ); + if ( ! $node ) { + return; + } + + if ( isset( $node->meta['class'] ) && false !== strpos( $node->meta['class'], 'has-site-icon' ) ) { + return; + } + + /** This filter is documented in wp-includes/admin-bar.php */ + $show_site_icons = apply_filters( 'wp_admin_bar_show_site_icons', true ); + if ( true !== $show_site_icons || ! has_site_icon() ) { + return; + } + + $site_icon = sprintf( + '', + esc_url( get_site_icon_url( 32 ) ), + esc_url( get_site_icon_url( 64 ) ) + ); + + $wp_admin_bar->add_node( + array( + 'id' => 'site-name', + 'title' => $site_icon . $node->title, + 'meta' => array( 'class' => 'has-site-icon' ), + ) + ); +} +add_action( 'admin_bar_menu', 'gutenberg_admin_bar_site_icon', 31 ); + +/** + * Enqueues the styles for the admin bar site icon. + */ +function gutenberg_admin_bar_site_icon_styles(): void { + $css = << .ab-item { + display: flex; + align-items: center; + gap: 6px; + } + #wpadminbar #wp-admin-bar-site-name.has-site-icon > .ab-item:before { + content: none; + } + #wpadminbar #wp-admin-bar-site-name > .ab-item .site-icon { + width: 20px; + height: 20px; + background: #f0f0f1; + border-radius: 2px; + } + @media screen and (max-width: 782px) { + #wpadminbar #wp-admin-bar-site-name > .ab-item .site-icon { + position: absolute; + top: 9px; + left: 12px; + width: 28px; + height: 28px; + margin: 0; + border-radius: 4px; + } + } +CSS; + wp_add_inline_style( 'admin-bar', $css ); +} +add_action( 'admin_bar_init', 'gutenberg_admin_bar_site_icon_styles' ); diff --git a/lib/experimental/experiments/load.php b/lib/experimental/experiments/load.php index 1bbc79dd8358c5..61d2bccf3f949d 100644 --- a/lib/experimental/experiments/load.php +++ b/lib/experimental/experiments/load.php @@ -125,11 +125,6 @@ function gutenberg_initialize_experiments_settings() { 'label' => __( 'New Dashboard experience', 'gutenberg' ), 'description' => __( 'Enables a new dashboard experience with resizable, reorderable widgets that plugins can register and users can personalize.', 'gutenberg' ), ), - array( - 'id' => 'gutenberg-omnibar', - 'label' => __( 'Toolbar UI refresh', 'gutenberg' ), - 'description' => __( 'Previews a redesigned toolbar UI that is visually consistent everywhere. For now, it includes replacing home/odometer dashicon with site icon if set.', 'gutenberg' ), - ), array( 'id' => 'gutenberg-react-19', 'label' => __( 'React 19', 'gutenberg' ), diff --git a/lib/experimental/omnibar/load.php b/lib/experimental/omnibar/load.php deleted file mode 100644 index 458a927f36097d..00000000000000 --- a/lib/experimental/omnibar/load.php +++ /dev/null @@ -1,89 +0,0 @@ -get_node( 'site-name' ); - if ( ! $node ) { - return; - } - - $site_icon_url = get_site_icon_url( 64 ); - if ( ! $site_icon_url ) { - return; - } - - $meta = (array) $node->meta; - $meta['class'] = isset( $meta['class'] ) ? trim( $meta['class'] . ' has-site-icon' ) : 'has-site-icon'; - - $wp_admin_bar->add_node( - array( - 'id' => 'site-name', - 'title' => '' . $node->title, - 'meta' => $meta, - ) - ); -} - -add_action( 'admin_bar_menu', 'gutenberg_omnibar_site_icon', 31 ); - -/** - * Adds the styles for the admin bar site icon. - */ -function gutenberg_omnibar_site_icon_styles() { - if ( - ! is_admin_bar_showing() || - ! gutenberg_is_experiment_enabled( 'gutenberg-omnibar' ) - ) { - return; - } - - $css = << .ab-item:before { - content: none; -} - -#wpadminbar #wp-admin-bar-site-name > .ab-item .site-icon { - width: 20px; - height: 20px; - margin: 0; - margin-inline-end: 6px; - vertical-align: -5px; - background: #f0f0f1; - border-radius: 2px; -} - -@media screen and (max-width: 782px) { - #wpadminbar #wp-admin-bar-site-name > .ab-item .site-icon { - position: absolute; - top: 9px; - inset-inline-start: 12px; - width: 28px; - height: 28px; - margin: 0; - border-radius: 4px; - } -} -CSS; - - wp_add_inline_style( 'admin-bar', $css ); -} - -add_action( 'wp_enqueue_scripts', 'gutenberg_omnibar_site_icon_styles' ); -add_action( 'admin_enqueue_scripts', 'gutenberg_omnibar_site_icon_styles' ); diff --git a/lib/load.php b/lib/load.php index 30529c7195b7a4..38b843c6a16c9b 100644 --- a/lib/load.php +++ b/lib/load.php @@ -120,6 +120,7 @@ function gutenberg_is_experiment_enabled( $name ) { } // WordPress 7.1 compat. +require __DIR__ . '/compat/wordpress-7.1/admin-bar.php'; require __DIR__ . '/compat/wordpress-7.1/kses.php'; require __DIR__ . '/compat/wordpress-7.1/media.php'; require __DIR__ . '/compat/wordpress-7.1/preload.php'; @@ -127,7 +128,6 @@ function gutenberg_is_experiment_enabled( $name ) { require __DIR__ . '/compat/wordpress-7.1/icons.php'; // Experimental features. -require __DIR__ . '/experimental/omnibar/load.php'; require __DIR__ . '/experimental/block-editor-settings-mobile.php'; require __DIR__ . '/experimental/blocks.php'; require __DIR__ . '/experimental/navigation-theme-opt-in.php'; From bfca0041392720a5f4d2ab61dce88554ba5b77d2 Mon Sep 17 00:00:00 2001 From: Ashar Fuadi Date: Thu, 2 Jul 2026 20:20:36 +0700 Subject: [PATCH 2/2] Sync with WP Core PR --- lib/compat/wordpress-7.1/admin-bar.php | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/lib/compat/wordpress-7.1/admin-bar.php b/lib/compat/wordpress-7.1/admin-bar.php index 75ab4e05ba2f64..468470f54b159c 100644 --- a/lib/compat/wordpress-7.1/admin-bar.php +++ b/lib/compat/wordpress-7.1/admin-bar.php @@ -33,10 +33,13 @@ function gutenberg_admin_bar_site_icon( WP_Admin_Bar $wp_admin_bar ): void { return; } - $site_icon = sprintf( - '', - esc_url( get_site_icon_url( 32 ) ), - esc_url( get_site_icon_url( 64 ) ) + $site_icon_url = get_site_icon_url( 32 ); + $site_icon_url_2x = get_site_icon_url( 64 ); + $srcset = ( $site_icon_url_2x && $site_icon_url !== $site_icon_url_2x ) ? sprintf( ' srcset="%s 2x"', esc_url( $site_icon_url_2x ) ) : ''; + $site_icon = sprintf( + '', + esc_url( $site_icon_url ), + $srcset ); $wp_admin_bar->add_node(