Is there a ready-made fix to make the admin bar not obscure content?

1 Views

I have a situation where the WordPress 3 Admin Bar (which is cool and I do want to have) obscures some important information on my page.

Before I start fiddling with the CSS myself (which I’m sure will break stuff): Is there an existing patch to change this so the Admin Bar starts “above” the actual page? I realize there may be CSS complications (especially with absolutely positioned elements), but it should be possible.

Post Views: 1

Related posts

Leave a Reply

2 comments

  1. Upon closer inspection, I found out that WordPress already does try to move everything that would be obscured further down. The problem is elements that have been positioned using position: fixed or position: absolute.

    What I ended up doing is adding separate CSS rules for those that apply only when the admin-bar class is set on the body (which WordPress does automatically when the bar is visible.) like e.g. so:

    /* Normal mode */
ul.sidemenu { top: 4px; left: 4px; ..... etc. etc.}
ul.langmenu  { top: 4px; right: 4px; .... etc. etc. }

/* Move elements 28px down when the admin bar is visible */
body.admin-bar ul.sidemenu  { top: 32px}
body.admin-bar ul.langmenu  { top: 32px}

  2. I would just move the admin bar code to the top of the page, set it to position:relative and remove the top margin for html.

    remove_action( 'wp_footer', 'wp_admin_bar_render', 1000 );
add_action( 'wp_head', 'wp_admin_bar_render', 1000 );
add_action( 'wp_head', 'wpse_42041_admin_bar_fix', 1000 );

function wpse_42041_admin_bar_fix()
{
?>
<style>html{margin-top:0 !important}#wpadminbar{position:relative !important}</style>
<?php
}