How to replace the Gutenberg editor logo (without version-fragile CSS)

#wordpress #webdev #gutenberg #css

Open the WordPress block editor and look at the top-left corner. That square with the WordPress "W" is the "back to dashboard" button — and on every site you build, it's the same generic WordPress logo. You can brand the front end, the login screen, the admin menu, and the editor still shows stock WordPress in the corner.

The default way to change it is admin CSS targeting the editor's button:

add_action('admin_head', function () {
    echo '<style>
        .edit-post-fullscreen-mode-close.components-button {
            background-image: url(/wp-content/uploads/brand.png) !important;
            background-size: 36px !important;
        }
        .edit-post-fullscreen-mode-close.components-button svg { display: none; }
    </style>';
});

It works — until it doesn't. Those class names (edit-post-fullscreen-mode-close, and friends) are Gutenberg internals, and they get renamed between editor versions. A snippet that works on one WordPress release silently stops working after an update, and you don't notice until a client does.

I tested doing it from the admin instead, with WP Adminify's Customize / white-label module. Here's the honest before/after.

What the default editor logo costs you:

Every client's block editor shows the WordPress "W" in the corner
Looks unfinished on sites you white-label and resell
The CSS fix targets Gutenberg class names that change on update, so it breaks quietly

What changed after setting the logo in Adminify: