How do I remove the admin bar (styling) from frontend only?

by

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.

4

function 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');

Leave a Comment