diff --git a/src/wp-includes/admin-bar.php b/src/wp-includes/admin-bar.php
index 41b01c3c5cc68..79231561a2209 100644
--- a/src/wp-includes/admin-bar.php
+++ b/src/wp-includes/admin-bar.php
@@ -385,15 +385,22 @@ function wp_admin_bar_site_menu( $wp_admin_bar ) {
}
$title = wp_html_excerpt( $blogname, 40, '…' );
+ $meta = array(
+ 'menu_title' => $title,
+ );
+
+ $site_icon_url = get_site_icon_url( 64 );
+ if ( $site_icon_url ) {
+ $title = '
' . $title;
+ $meta['class'] = 'has-site-icon';
+ }
$wp_admin_bar->add_node(
array(
'id' => 'site-name',
'title' => $title,
'href' => ( is_admin() || ! current_user_can( 'read' ) ) ? home_url( '/' ) : admin_url(),
- 'meta' => array(
- 'menu_title' => $title,
- ),
+ 'meta' => $meta,
)
);
diff --git a/src/wp-includes/css/admin-bar.css b/src/wp-includes/css/admin-bar.css
index 2331aeafd4b3c..0d09e99eee29e 100644
--- a/src/wp-includes/css/admin-bar.css
+++ b/src/wp-includes/css/admin-bar.css
@@ -581,6 +581,19 @@ html:lang(he-il) .rtl #wpadminbar * {
content: "\f102" / '';
}
+#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;
+ margin: 0 6px 0 0;
+ vertical-align: -5px;
+ background: #f0f0f1;
+ border-radius: 4px;
+}
+
/**
@@ -902,7 +915,7 @@ html:lang(he-il) .rtl #wpadminbar * {
#wpadminbar #wp-admin-bar-edit > .ab-item:before,
#wpadminbar #wp-admin-bar-my-sites > .ab-item:before,
- #wpadminbar #wp-admin-bar-site-name > .ab-item:before,
+ #wpadminbar #wp-admin-bar-site-name:not(.has-site-icon) > .ab-item:before,
#wpadminbar #wp-admin-bar-site-editor > .ab-item:before,
#wpadminbar #wp-admin-bar-customize > .ab-item:before,
#wpadminbar #wp-admin-bar-my-account > .ab-item:before,
@@ -917,6 +930,15 @@ html:lang(he-il) .rtl #wpadminbar * {
-moz-osx-font-smoothing: grayscale;
}
+ #wpadminbar #wp-admin-bar-site-name > .ab-item .site-icon {
+ position: absolute;
+ top: 9px;
+ left: 12px;
+ width: 28px;
+ height: 28px;
+ margin: 0;
+ }
+
#wpadminbar #wp-admin-bar-appearance {
margin-top: 0;
}
diff --git a/tests/phpunit/tests/adminbar.php b/tests/phpunit/tests/adminbar.php
index 27308bd82760e..e63772aee07a2 100644
--- a/tests/phpunit/tests/adminbar.php
+++ b/tests/phpunit/tests/adminbar.php
@@ -810,6 +810,37 @@ public function data_my_sites_network_menu_items() {
);
}
+ /**
+ * @covers ::wp_admin_bar_site_menu
+ */
+ public function test_site_name_menu_has_no_site_icon_when_unset() {
+ wp_set_current_user( self::$editor_id );
+
+ $wp_admin_bar = $this->get_standard_admin_bar();
+ $node_site_name = $wp_admin_bar->get_node( 'site-name' );
+
+ $this->assertStringNotContainsString( 'site-icon', $node_site_name->title );
+ $this->assertArrayNotHasKey( 'class', $node_site_name->meta );
+ }
+
+ /**
+ * @covers ::wp_admin_bar_site_menu
+ * @requires function imagejpeg
+ */
+ public function test_site_name_menu_includes_site_icon_when_set() {
+ wp_set_current_user( self::$editor_id );
+
+ $attachment_id = self::factory()->attachment->create_upload_object( DIR_TESTDATA . '/images/test-image.jpg' );
+ update_option( 'site_icon', $attachment_id );
+
+ $wp_admin_bar = $this->get_standard_admin_bar();
+ $node_site_name = $wp_admin_bar->get_node( 'site-name' );
+
+ $this->assertStringContainsString( '
title );
+ $this->assertStringContainsString( esc_url( get_site_icon_url( 64 ) ), $node_site_name->title );
+ $this->assertSame( 'has-site-icon', $node_site_name->meta['class'] );
+ }
+
/**
* This test ensures that WP_Admin_Bar::$proto is not defined (including magic methods).
*