When logged in, the admin bar adds the following to my page <head>
section:
<style media="screen" type="text/css">
html { margin-top: 28px !important; }
* html body { margin-top: 28px !important; }
</style>
Now, I can remove this by disabling the admin bar
/* Disable the Admin Bar. */
add_filter( 'show_admin_bar', '__return_false' );
or removing it completely
/* Remove admin bar */
remove_action('init', 'wp_admin_bar_init');
I would like to keep the admin bar in the admin interface and only remove the CSS from front end.
I already use CSS reset where I set margin: 0px
, but the admin-bar styling overrides this.
So how can I remove the styling from front end?
PS. I know I can disable the admin bar per user, but that's not what I want.
When logged in, the admin bar adds the following to my page <head>
section:
<style media="screen" type="text/css">
html { margin-top: 28px !important; }
* html body { margin-top: 28px !important; }
</style>
Now, I can remove this by disabling the admin bar
/* Disable the Admin Bar. */
add_filter( 'show_admin_bar', '__return_false' );
or removing it completely
/* Remove admin bar */
remove_action('init', 'wp_admin_bar_init');
I would like to keep the admin bar in the admin interface and only remove the CSS from front end.
I already use CSS reset where I set margin: 0px
, but the admin-bar styling overrides this.
So how can I remove the styling from front end?
PS. I know I can disable the admin bar per user, but that's not what I want.
Share Improve this question asked Oct 5, 2011 at 8:28 StevenSteven 2,6207 gold badges41 silver badges61 bronze badges 1- Does this answer your question? Remove top admin bar – T.Todua Commented May 14, 2020 at 20:31
4 Answers
Reset to default 30function hide_admin_bar_from_front_end(){
if (is_blog_admin()) {
return true;
}
return false;
}
add_filter( 'show_admin_bar', 'hide_admin_bar_from_front_end' );
Edit:
As @Walf suggested in the comments, this could be writen as:
add_filter('show_admin_bar', 'is_blog_admin');
f you want to remove the admin bar (toolbar) AND the bump CSS from your page, use this:
function wpse_99333_hide_admin_bar_from_front_end(){
if ( is_blog_admin() ) {
return true;
}
remove_action( 'wp_head', '_admin_bar_bump_cb' );
return false;
}
add_filter( 'show_admin_bar', 'wpse_99333_hide_admin_bar_from_front_end' );
The _admin_bar_bump_cb
function is the one that inserts the CSS (located in wp-includes/admin-bar.php)
I would do something like this :
Remove admin bar / CSS in head / body class
show_admin_bar(false);
or if you just want to : Remove html
margin-top CSS in <head>
function remove_admin_bar_bump() {
remove_action('wp_head', '_admin_bar_bump_cb');
}
add_action('get_header', 'remove_admin_bar_bump');
Tested : Version 4.7.3
I recently had to do this, I just wanted wordpress's default inline css styles (for the admin bar) removed, but I did want the admin bar to remain. I was displaying the admin bar at the bottom of the page, not the top.
Here is what got rid of injecting the styles from the _admin_bar_bump_cb function for me. I added the following to my functions.php
// remove wordpress trying to style the admin bar with inline css
function hide_admin_bar_from_front_end(){
remove_action( 'wp_head', '_admin_bar_bump_cb' );
return true;
}
add_filter( 'show_admin_bar', 'hide_admin_bar_from_front_end' );