How to Disable the Admin Bar in Sonny aka WordPress 3.3 | Tutorial Freak – Online Tutorials

How to Disable the Admin Bar in Sonny aka WordPress 3.3

WordPress (Sonny) version 3.3 was just released few days back. I like it. Then I disabled the admin-bar. Clicked “Update Profile”. Great! Hey, wait a minute. The admin-bar is still there!? What the Sonny!!

With the previous versions of WordPress you could just go to the user profile to disable the admin-bar, or you could use this popular code in the functions.php file:

add_filter('show_admin_bar', '__return_false');

With the release of version 3.3 we no longer are given the option to disable the admin-bar in the Admin section. I appreciate the Core WordPress Development Team for trying to make WordPress easier to use and more accessible, but they seem to be missing something in their thinking. People like to have options, and they don’t like it when those options are taken away. Especially when they’ve utilized those options. :(

So, I went messed around to find this solution to disable the admin-bar.

Disabling the admin-bar in the Admin Section

Well, before we start all this I would advise you to backup the whole site first – Just to be on a safer side!

This code is going to be placed in the functions.php file, so go ahead and open it up in your favorite text editor.

First let’s set up the function with a check.

if (!function_exists('disableAdminBar')) {  
  
    function disableAdminBar(){  
  
  }  
  
}

This is going to make sure that the function ‘disableAdminBar’ doesn’t already exists. If it doesn’t the our function will run.

Next, let’s remove the action that will enables the admin-bar.

if (!function_exists('disableAdminBar')) {  
  
    function disableAdminBar(){  
  
    remove_action( 'admin_footer', 'wp_admin_bar_render', 1000 );  
  
  }  
  
}

Now, for the action hook that initializes the disableAdminBar function.

if (!function_exists('disableAdminBar')) {  
  
    function disableAdminBar(){  
  
    remove_action( 'admin_footer', 'wp_admin_bar_render', 1000 );  
  
  }  
  
}  
  
add_filter('admin_head','remove_admin_bar_style_backend');

OK, that disabled the admin-bar, but there’s still a 28px padding at the top of the page.

28px-padding

You can go into the admin-bar.css file and edit the css there to remove the padding. The css property you want to edit is this.

body.admin-bar #wpcontent,  
body.admin-bar #adminmenu{  
padding-top:28px;  
}

You could dig through the wp-admin.css file and change the css there, but I think it’s better to preserve the core files. So, I’m going to override the css in the function we just made. This is the function we’re going to use to override the css.

function remove_admin_bar_style_backend() {  
  echo '<style>body.admin-bar #wpcontent, body.admin-bar #adminmenu { padding-top: 0px !important; }</style>';  
}  
  
add_filter('admin_head','remove_admin_bar_style_backend');

Here is the whole function to disable the admin-bar and overriding the css all together.

if (!function_exists('disableAdminBar')) {  
  
    function disableAdminBar(){  
  
    remove_action( 'admin_footer', 'wp_admin_bar_render', 1000 );  
  
    function remove_admin_bar_style_backend() {  
      echo '<style>body.admin-bar #wpcontent, body.admin-bar #adminmenu { padding-top: 0px !important; }</style>';  
    }  
  
    add_filter('admin_head','remove_admin_bar_style_backend');  
  
  }  
  
}  
  
add_filter('admin_head','remove_admin_bar_style_backend');

Now that 28px padding should be gone.

no-padding

It’s not pretty but it works, also by overwriting the css this way. If you ever want to re-enable the admin-bar. You won’t have to change the core css back.


Disabling the admin-bar in the Admin Section

If you want to disable the admin bar of the frontend of your site, you can go into your user profile and uncheck “Show Toolbar when viewing site“. Easy enough, but if you want to disable the admin-bar all together, we’re going to have to add some more to the ‘disableAdminBar’ function.

Here’s the action to disable the admin-bar on the frontend.

remove_action( 'wp_footer', 'wp_admin_bar_render', 1000 );

In our ‘disableAdminBar’ function. It looks like this.

if (!function_exists('disableAdminBar')) {  
  
    function disableAdminBar(){  
  
    remove_action( 'admin_footer', 'wp_admin_bar_render', 1000 ); // for the admin page  
    remove_action( 'wp_footer', 'wp_admin_bar_render', 1000 ); // for the front end  
  
    function remove_admin_bar_style_backend() {  
      echo '<style>body.admin-bar #wpcontent, body.admin-bar #adminmenu { padding-top: 0px !important; }</style>';  
    }  
  
    add_filter('admin_head','remove_admin_bar_style_backend');  
  
    }  
  
}  
  
add_filter('admin_head','remove_admin_bar_style_backend');

The admin-bar is gone, but one problem. Now, there’s a 28px margin on the top of your site.

28px-margin

This one is tricky. This css is hard coded in the when the “Show Toolbar when viewing site” is checked. I haven’t been able to figure out how to remove the css, so we’re going to have to override it like with the admin section using this function.

function remove_admin_bar_style_frontend() {  
  echo '<style type="text/css" media="screen"> 
  html { margin-top: 0px !important; } 
  * html body { margin-top: 0px !important; } 
  </style>';  
}  
  
add_filter('wp_head','remove_admin_bar_style_frontend', 99);

The 99 at the end of the add_filter hook, is to ensure that the css is in the comes after the original hard coded css in the

no-margin

Here’s our completed function.

if (!function_exists('disableAdminBar')) {  
  
    function disableAdminBar(){  
  
    remove_action( 'admin_footer', 'wp_admin_bar_render', 1000 ); // for the admin page  
    remove_action( 'wp_footer', 'wp_admin_bar_render', 1000 ); // for the front end  
  
    function remove_admin_bar_style_backend() {  // css override for the admin page  
      echo '<style>body.admin-bar #wpcontent, body.admin-bar #adminmenu { padding-top: 0px !important; }</style>';  
    }  
  
    add_filter('admin_head','remove_admin_bar_style_backend');  
  
    function remove_admin_bar_style_frontend() { // css override for the frontend  
      echo '<style type="text/css" media="screen"> 
      html { margin-top: 0px !important; } 
      * html body { margin-top: 0px !important; } 
      </style>';  
    }  
  
    add_filter('wp_head','remove_admin_bar_style_frontend', 99);  
  
  }  
  
}  
  
// add_filter('admin_head','remove_admin_bar_style_backend'); // Original version  
add_action(‘init’,'disableAdminBar’); // New version

Conclusion

I agree that this version is a bit lengthy, but i am waiting to see what other developers come out with.

Feel free to post your methods, if any.

Author, Blogger, SEO Expert, Working Professional and a Student! I play so many roles in life and love what i do. I enjoy each moment of my life. Do follow us on Facebook

Sagar – who has written posts on Tutorial Freak – Online Tutorials.


Help keep us alive & kicking, we need coffee 24/7, please donate, thanks!
Embed

Leave a Reply

      
      
      
      
      
      
      
      
             
Save Now! $1.99 .COM at GoDaddy!