New UI for the WP Admin area

Update #1: Joshua aka iioshius from #wordpress has decided to host backups for those who bork thier install, or make changes to the CSS and need a fresh, unspoiled copy.  Thanks brother.
Update #2: Joshua has also posted a variation on my UI for mass consumption, his version attempts to prove that blue is the new red.  We’ll see pal.  If you create a variation on this theme, leave me a trackback or comments so I can list you here as well.

Before you get into the nitty gritty of this little excursion, you must be informed of a couple of caveats.

First of all, this design is for me, not everyone.  Some of my compatriots on the #wordpress irc channel seemed to dig it, so I am releasing it for them really.  What does this mean to you gentle reader?  Well it means that for instance, you must keep your window at a certain width to avoid nasty wrapping issues, if you have your monitor set at 1024 X 768 then you shouldn’t have a problem.

Secondly, this includes my Overview page wp-glance, with the stats piece commented out, but if you would like to add that back in, you can download wp-glance, and follow the instructions to add the table for stats to your DB and uncomment the stats bit.

Okay, on with the show.

Well here is the first release of my new UI for WordPress.

Again before starting here, the purpose for this little experiment was to make the UI more comfortable for me, and to get rid of the stinking blue, of which I am not a fan.  Give me red baby.

Here is a screenshot:

UI Redesign

Ok, so now on to business.  I tried to make this as painless as possible so bear with me.

  1. First you need to download this archive.
  2. After you have unzipped it, you will find a number of new .php files, and a couple of new images within the wp-admin folder and a new wp-admin.css file.
  3. You now have one of two choices, you can either A.) backup your current copies of the .php and .css files, or you can B.) just drag and drop overwriting the current files.
  4. You also need to add the images found in wp-images to your own wp-image folder.

That should be all you need to do, look for teh next version of this little endeavour that will incorporate more drastic changes to the layout of some of the screens.

Tagged:

Penned at "home" in Nicholasville, KY

Skip to Comments

  1. personal avatar Randy
    Stroll on over and visit Randy
    March 1, 2007

    Ooooo… Pretty!

  2. personal avatar Chris J. Davis
    Stroll on over and visit Chris J. Davis
    March 1, 2007

    Thanks.

  3. personal avatar adam
    Stroll on over and visit adam
    March 1, 2007

    Swank. Very nice. Thanks for adding a little spice to the somewhat blah default WP interface.

  4. personal avatar JoelThomas
    Stroll on over and visit JoelThomas
    March 1, 2007

    Give me blue, baby. So much less offensive. ;)

  5. personal avatar Alex
    Stroll on over and visit Alex
    March 1, 2007

    This was on my to-do list as well. Nice job. :)

  6. personal avatar Angela
    Stroll on over and visit Angela
    March 1, 2007

    I’m getting strange errors after tranferring the files.

    Warning: main(../wp-includes/wp-l10n.php): failed to open stream: No such file or directory in /home/bhenders/public_html/slolanetest/wp-admin/index.php on line 2

    Fatal error: main(): Failed opening required ‘../wp-includes/wp-l10n.php’ (include_path=’.:/usr/lib/php:/usr/local/lib/php’) in /home/bhenders/public_html/slolanetest/wp-admin/index.php on line 2

    Any idea what that’s about? I think I have WP 1.0.1 installed.

  7. personal avatar Angela
    Stroll on over and visit Angela
    March 1, 2007

    I’m getting big time errors. Is it not compatable with the WP 1.0.1?

  8. personal avatar Chris J. Davis
    Stroll on over and visit Chris J. Davis
    March 1, 2007

    Hey Angela,

    No I am afraid it is not compatible with anything before 1.2-delta. I used to point out what version of WP it was for, but I have become lazy and stopped. My apologies.

    Congrats on the twins by the way.

  9. personal avatar Angela
    Stroll on over and visit Angela
    March 1, 2007

    Ah. ‘K, thanks for the heads up :)

  10. personal avatar Jerome
    Stroll on over and visit Jerome
    March 1, 2007

    Totally awesome. Thanks…
    Work perfectly fine.

  11. personal avatar Khaled
    Stroll on over and visit Khaled
    March 1, 2007

    Just to say I loved it completely and utterly especially the red, just one thing, the login.php or wp-register.php files are seen on the far left of the screen probably due to the css, just thought you could sort it out so that you’ve got a perfect little addition to the already excellent wp arsenal.

  12. personal avatar dfunkd
    Stroll on over and visit dfunkd
    March 1, 2007

    Indeed. Very nice.
    I second the problem with wp-register.php being too far left. No problems with login.php tho. (Try re-uploading it Khaled, i experienced the problem at first, and fixed it with a quick re-upload.)

    Also, the admin menu Options-Theme links to options-themes.php which isn’t in the zip. Hmmm.

    Aside from that, a vast improvement in the Admin UI. Ta!

  13. personal avatar Cine
    Stroll on over and visit Cine
    March 1, 2007

    I really would like to use this, but the link is broken :(

  14. personal avatar Chris J. Davis
    Stroll on over and visit Chris J. Davis
    March 1, 2007

    Sorry, one of the little changes that I missed moving from my previous host to this one. The link is fixed now.

  15. personal avatar anukhm
    Stroll on over and visit anukhm
    March 1, 2007

    很不错哦,,支持呀,,,

Leave a Reply