One Man's Blog

Specialization is for Insects.

Home / Wordpress / Wordpress Plugin: WP Admin Bar Reloaded

WordPress Plugin: WP Admin Bar Reloaded

John P.

By

NOTE: This plugin is no longer in development, so I recommend Viper’s WordPress Admin Bar. If that one doesn’t work for some reason, this one still does.

WP Admin Bar ReloadedWP Admin Bar is an indispensable WordPress plugin which displays links to the Administration Panel at the top of a blog’s page – but only for users who are logged in and have permission to view the given functions.

I find this plugin to be absolutely essential to my enjoyment of WordPress. It allows me to easily jump back and forth between viewing the blog and various management functions on the back end. If you’ve never used it before you’re going to wonder how you got by without it all this time.

I’ve personally been using the WP Admin Bar from Matt Read since I started using WordPress. But with the update to WordPress 2.1 it isn’t functioning properly, Matt hasn’t updated the plugin in almost a year, and his Envato Coupon site is currently very broken – so I decided to make the changes myself.

While I was modifying the plugin I made a number of other changes including:

  • Removed support for WP 1.5. This cuts the coding in half.
  • Removed the random message generator. No need to spend CPU cycles on this.
  • Added new Admin links directly to “Users” and “Comments” moderation.
  • Updated the links to work properly in WP 2.1.x with VPN like CactusVPN.
  • Removed the automatic STYLE insertion into the WP Header.

Please Note:

If you are using my Rapid Access theme, you don’t need to do anything other than install and activate the template monster plugin. The theme already has all of the code in it!

Frequently Asked Questions (that I’m sure are coming)

Q: Why did you remove the automatic STYLE insertion?
A: Because style rules should always be embedded into your site’s style sheet. There are too many reasons to list. It will only take you a minute to cut and paste them.

Q: Why did you remove support for WP1.5?
A: I don’t have a working copy to test it on, plus you can keep using Matt’s old version.

Q: Why are there different versions for 2.0.x and 2.1.x?
A: Because the WP developers made some slight changes that have to be compensated for.

Instructions (PLEASE READ!):

1.) If you are upgrading from the old WP Admin Bar use the Plugin Manager to disable it. If you do not, there WILL be a problem.
2.) Download, unzip and upload WP Admin Bar Reloaded to your plugins directory. wp-admin-bar-reloaded.zip

  • If your blog is running WordPress 2.0.x upload only the version titled: wp-admin-bar-reloaded-v2_0.php.
  • If your blog is running WordPress 2.1.x upload only the version titled: wp-admin-bar-reloaded-v2_1.php.
  • There is only one difference between these two files. It has to do with the link to the Write page.

3.) Activate the plugin in WordPress.
4.) Add the following lines to the very end of your “style.css” or “style.php” file.

#wp-admin-bar {margin:0; padding:5px; background:#f9f9f9; border:1px solid #666; clear:both; text-align:center}
#wp-admin-bar ul {margin:0; padding:0}
#wp-admin-bar ul li {list-style-type:none; display:inline; margin:0 10px; padding:0}

5.) Add the following line to your “header.php” file immediately after the “<body>” tag:

<?php if(function_exists('wp_admin_bar')) wp_admin_bar(); ?>

6.) Enjoy!

If you have any problems or find a bug please drop me a comment below.

EDITED April 11, 2007: Someone sent me a private message offering a donation because they found this useful. So I added the following “license” information:

This plugin is distributed under the Nice Person license as PostcardWare. Please use it, modify it, build commercial Web sites around it, and make the Web a faster, more accessible place. Here is what you could do for me in return:

  1. If you could provide a link back to any article you find useful on One Man’s Blog from your Web site I sure would appreciate it.
  2. If you discover ways to improve the speed, accessibilty or features of this plugin, please let me know.
  3. Do something nice for someone you don’t know today.
  4. Finally, if you really like it, drop me an old fashioned post card in the mail! That would be completely awesome! You can send them to:
    John Pozadzides
    PO Box 2591
    Frisco, TX 75034
    USA

I’ll publish the really interesting ones, so include a URL!

Comments

  4. John,
    Just watched your 45 Ways video and learned a ton. I’m going through your list. I had a problem with WP Admin Bar Reloaded, which is probably a fault of my theme. Please peek at Thiefhunters in Paradise. The admin bar pushed down my header pix, but not my page tabs, causing the page tabs to overlap the header pix. When I couldn’t fix it (I’m pretty new), I deleted the Admin Bar code from the header php, deactivated the plugin, then even deleted the code from the style.css. Still, my page tabs are screwy. I also restored the previous header.php, just to be sure. What legacy bits could be remaining to mess up my page tabs?

    Still, grateful for your many, many tips. –thiefhunter

  5. You know what would make this plugin rock even harder? If the Admin Bar could float at the top as you scroll down through your blog, so you don’t have to go all the back to the top to click it.

    Not that I don’t like it. I do.

    Just sayin’…

  8. Art,

    You can actually fix this one yourself! :-)

    In the line you added to your stylesheet that reads:
    #wp-admin-bar {margin:0; padding:5px; background:#f9f9f9; border:1px solid #666; clear:both; text-align:center}
    The two funny codes that begin with the # symbol are colors. #f9f9f9 and #666 can be changed, and for simplicity you can use simple color names like black, blue, red, green, yellow, orange, gold, brown, silver, etc.

    So, play around with just editing the colors until you get something usable on your theme and hopefully you’ll be all set!

    John

  9. John,

    I am not a programmer, so I’m sure this will sound like a noob question… nevertheless…

    I installed the plugin and did the update of the style sheet and header and the header did appear, but the words are off white on white and nearly impossible for me to see without really straining.

    Did I do something wrong or is it in my template somewhere and I need to get one of my programmer friends to help me?

    Thanks in advance.

  11. After wp-admin-bar broke a while back, I thought I’d have to go without, but thanks for this fix! Working great on my site, even after upgrading to 2.5. Three cheers to you!

  13. Just thought I would touch base again about this plug-in. The more I use your plug-in, the more I couldn’t be without it. If you are running a WordPress Blog, you would be at a severe disadvantage without this handy little tool.

  15. Steve,

    The only thing you’re missing out on… is more work! :-) I’ve already got support for this plugin built into the Rapid Access theme, so you’re good to go!

    John

  16. John, I just uploaded and activated this plug in. I did not have to do the extra steps in the style.css and header.php. It works fine. Have I missed anything?

  19. Steve,

    I understand what you mean now! I wasn’t getting it before. :-)

    It shouldn’t be too hard to add the ability to show create account or login links for users that are not logged in. I’ll try to work on this code in the next week or so. Just got back in town from my brother’s wedding, so I’m a bit behind.

    If I don’t respond in a week feel free to ping me and remind me.

    John

  20. I meant there’d be a different display, like for example a “Login” and “Create Account” link.

  21. Steve,

    The plugin could be modified to perform that way, but it seems kind of silly to me to do so. It would be mean that the links were just always there – which you can do with plain old HTML by simply editing the theme – which you’d have to do anyway to get the admin bar to show up.

    John

  27. oh this is an awesome plugin! I am just new to all of this WP stuff but this helps a blogspot blogger like me make the change easier!

  28. Well, d’oh … I need to think a little more before asking noob questions … sorry for wasting bandwidth, solved it.
    Fantastic tool … probably the most useful one I’ve found so far!

    thanks again
    pete

  29. John,
    this wonderful plugin solves an annoying problem for me … great not to have to constantly keep 2 views going. One question … my dashboard is vertical in the center of the screen … is this normal and/or can it be set to display horizontally (less real estate)

    thanks
    pete

  36. It just doesn’t show up with 2.2 final, no error messages, no nothing.

  37. Darn! I haven’t even looked at 2.2 yet because I still have to upgrade to 2.1! :-)

    Can you tell me what the symptoms were? Did it just fail to load completely, or did the links not work or something like that?

    John

  40. Thanks a lot for the support. Tonight it’s going well with iceweasel. Probably a trouble with the navigator’s cache (sorry for the very poor english). BTW a friend of mine had the same trouble and said that removing “clear:both;” in “#wp-admin-bar”.
    I hope it helps

  41. Libretto (and everyone else),

    First of all, I just noticed that I had an error in the CSS. I’ve corrected it above, so please either recopy it into your style sheet, or simply remove “align:center” from the very beginning of the first line.

    It is possible that this invalid definition was causing the error in IceWeasel, though the software should be resilient enough to keep going.

    Other than that, the style declarations are completely valid and there is nothing out of the ordinary there. Furthermore they are very specific to lists that have an id=”wp-admin-bar” which should not interfere with anything else. So, it is possible that there is just a problem with IceWeasel’s CSS rendering.

    One alternative you might consider would be putting it in a sidebar widget. Check out Gloda’s posts above for more info on that.

    Let me know if any of the above worked for you.

    John

  42. Libretto,

    I’m sorry you’re experiencing that issue. I know it’s frustrating. I have no experience with IceWeasel, but I’ll look into this in a little while. At the moment I’m heading out the door to eat with my wife.

    Just to be clear, you’re telling me that you did install the style into your stylesheet, and viewing your page works properly in FireFox, but not IceWeasel, correct?

    Be back later,

    john

  45. Thanks Rob. Of course, I can’t take full credit. Matt Read had the original brainstorm. I just added incremental improvements and updates. But I am happy that so many people are finding the updated version as useful as I do.

    John

  47. Oh, another idea would be to have a link to the registration page which would disappear once you’re logged in.

  48. The Man,
    Thanks for the tip, the only problem was that having two tags messes up the widget look (they appear as two widgets) so I did the following ‘ugly’ hack:

    1) Removed this code from the .php
    # Login and logout link.
    echo “\n\t”; wp_loginout(); echo “”;

    2) In the following line, I removed
    [Note: I’m no good at php, so I’m not sure whether I could have deleted the entire line.]

    3) I removed this line:
    echo ”;

    4) I put the following into a Samsarin PHP Widget:

    So basically I had to get the and tags out of the php in order to allow the wp_loginout to be inside the , but not part of the IF rule in the PHP. It would be nicer though if the plugin, instead of deciding whether or not to load depending on login status, decided *what* to load depending on that information. That way it could all go into the PHP.
    I hope this helps, for an example click on my name, you can see the widget in action there, it’s the one called ‘Logbuch’.

  49. Gloda,

    Thanks for the reminder. I fixed the register.txt doc too now. It was interesting because it seems the problem was with saving the text file in ANSI. When I switched to UTF8 it worked.

    Using it as a widget is a good idea. For people who decided to try this you will need to remove the “display:inline;” from the CSS so that it comes out as a regular list instead of a horizontal list.

    It would indeed be useful to get it to show the login info instead so you don’t have to also have your Meta plugin. Here is the simplest hack I can think of… let me know if this works for you:

    1) Delete the following lines from the PHP file you are using (they’re toward the end):
    # Login and logout link.
    echo "\n\t<li>"; wp_loginout(); echo "</li>";
    2) In your Sidebar Widget, immediately after the line that calls the Admin Bar add the following:
    <ul>
    <li><?php wp_loginout(); ?></li>
    </ul>

    I believe that will make the Login/Logout show up either way immediately after the Admin Bar functions. Please let me know if this works. When I get time I’ll work on creating widgetized version for people who prefer it in their sidebar to their header.

    John

  50. That fixed it! Not sure how I missed the quotes having been like that.
    Great plugin, thanks for picking it up and getting it working for us.

  52. Hi, cool plugin. I’m using it as a widget with the Samsarin PHP Plugin. Just remember to update the instructions.txt with the fixed quotes. Also, is there a way to display a login and register link when you’re not logged in?

  55. Ok guys, sorry about the issue, and the slow response. I was traveling all day today.

    I was completely baffled by why this wasn’t working, but finally figured out what I think the problem is… and you’re not going to believe it!

    On step 5, the single quotes around wp_admin_bar were, for some reason, copying and pasting as slanted single quotes. These did NOT seem to work. I don’t know how or why that was happening, but I’ve changed them back to normal single quotes so hopefully you can copy and paste it now. If for any reason it isn’t working please make sure that you have normal single quotes in there.

    Can someone tell me if that fixed their problem?

    John

  57. ^ Same here. I’m using a custom theme of mine and have exactly followed your instructions but it’s not appearing.

  58. This is the plugin I was waiting for! Thank you! :)

    Unfortunatelly it doesn’t work on my site :( I’ve enabled the plugin, copied the 2 section to the header and style files, but the bar didn’t appeared… I use Rounded V2 blue edition 1.0 theme by Ghyslain Armand and WP 2.1.3. Can you please help me? :)

    Thanks,

    norti