Removing the link on the Wordpress admin bar logo

Question

I've managed to replace the Wordpress icon/logo in the admin bar with a custom one in my functions.php file as well as removing the dropdown menu linking to Wordpress documentation, support forums, feedback etc. What i'm trying to do is to disable the link present on the logo that takes you to the About Wordpress page in the admin that explains the features of the version you currently are running.

I'd like to do this from within the functions.php file. Is this possible?

This is the code i have used so far:

    // Replace Wordpress logo with custom Logo
function my_custom_logo() {
    echo '
    <style type="text/css">
    #wp-admin-bar-wp-logo > .ab-item .ab-icon:before {
        background-position: 0 0;
        content: url(' . get_bloginfo('stylesheet_directory') . '/assets/img/my-logo.png)!important;
        top: 2px;
        display: block;
        width: 15px;
        height: 20px;
        pointer-events: none!important;
        cursor: default;
    }
    #wp-admin-bar-wp-logo.hover > .ab-item .ab-icon {
        background-position: 0 0;
    }
     </style>
    ';
}
add_action('admin_head', 'my_custom_logo');
add_action('wp_head', 'my_custom_logo');

//disable a few items on the admin bar
function remove_admin_bar_links() {
global $wp_admin_bar;
$wp_admin_bar->remove_menu('new-content');      // Remove the 'add new' button
$wp_admin_bar->remove_menu('comments');         // Remove the comments bubble
$wp_admin_bar->remove_menu('about');            // Remove the about WordPress link
$wp_admin_bar->remove_menu('wporg');            // Remove the WordPress.org link
$wp_admin_bar->remove_menu('documentation');    // Remove the WordPress documentation link
$wp_admin_bar->remove_menu('support-forums');   // Remove the support forums link
$wp_admin_bar->remove_menu('feedback');         // Remove the feedback link
}
add_action( 'wp_before_admin_bar_render', 'remove_admin_bar_links' );

Answer 1

I had this problem a while back.
The easiest solution would not be with css but with a function that removes that menu item from the admin bar.
Then just add a new menu item with your logo image.
I would do this instead of replacing the icon with your logo with css.

/*Remove WordPress menu from admin bar*/
    add_action( 'admin_bar_menu', 'remove_wp_logo', 999 );

    function remove_wp_logo( $wp_admin_bar ) {
        $wp_admin_bar->remove_node( 'wp-logo' );
    }

    /*Adds Custom Logo to Admin Bar*/
    add_action( 'admin_bar_menu', 'custom_admin_logo', 1 );
//priority 1 sets the location to the front/leftmost of the menu

    function custom_admin_logo( $wp_admin_bar ) {
        $custom_logo_id = get_theme_mod( 'custom_logo' ); //Uses theme logo
        $custom_logo_url = wp_get_attachment_image_url( $custom_logo_id , 'full' );
        $args = array(
            'id'    => 'custom_logo_admin',
            'title' => ' ',
            'meta'  => array( 'html' => '<li id="custom-logo-admin-bar" style="width: 230px;padding: 10px;padding-left: 0px;padding-right: 25px;"><img class="overlay" src="'.$custom_logo_url.'" style="float: left;width: 100%;height: auto;"></li>' )
        );
        $wp_admin_bar->add_node( $args );
    }

You can style your image with css either in your stylesheet or directly here in the meta array.
The $wp_admin_bar->add_node( $args ); is what actually adds the new node into the admin bar.
P.S. some of the styling here is just what I needed for my own purposes, feel free to change.

Answer 2

Maybe you should just overwrite the CSS for it and replace it with your own image so the functionality will stay in tact!

This is the original CSS:

#wp-admin-bar-wp-logo > .ab-item .ab-icon {
   background-image: url("../wp-includes/images/admin-bar-sprite.png?d=20120830");
   background-position: 0 -76px;
   background-repeat: no-repeat;
   height: 20px;
   margin-top: 4px;
   width: 20px;
}

You might want to change it in:

#wp-admin-bar-wp-logo > .ab-item span.ab-icon {
   background-image: url("your-image.png");
   background-repeat: no-repeat;
   height: 20px;
   margin-top: 4px;
   width: 20px;
}

Notice the addiational span to .ab-icon to make it more specific.

For any legal questions check their licence page: https://codex.wordpress.org/License

And the GPL licence: https://www.gnu.org/copyleft/gpl.html