---
title: Idea for a WordPress Dashboard Layout &amp; Design
date: 2008-08-26T00:01:08+00:00
modified: 2008-08-26T00:01:08+00:00
image:: https://kaspars.net/wp-content/uploads/2008/08/wordpress-dashboard-green.gif
permalink: https://kaspars.net/blog/idea-for-a-wordpress-dashboard-layout-design
post_type: post
author:
  name: Kaspars
  avatar: https://reverse.kaspars.net/gravatar/avatar/92bfcd3a8c3a21a033a6484d32c25a40b113ec6891f674336081513d5c98ef76?s=96&d=mm&r=g
category:
  - Development
  - WordPress
---

# Idea for a WordPress Dashboard Layout &amp; Design

**Update**: this mock-up has now been turned into a [fully functional interface](https://kaspars.net/blog/design-suggetions/523-drag-and-drop-wordpress-dashboard-user-interface/ "View the suggested WordPress dashboard design").

In the [previous post](https://kaspars.net/blog/wordpress/505-first-impressions-of-wordpress-27/ "First impressions of WordPress 2.7") I stated that the proposed vertical navigation bar for WordPress 2.7 Dashboard is not the best solution for the purpose that it is going to be used for. And just because there should be a reason why most of the desktop applications have their main navigation placed at the top as a drop-down menu, right.

Here is a quick mock-up of the design that, I think, would be much easier to use.

[![Suggested WordPress dashboard design. Blue.](/wp-content/uploads/2008/08/wordpress-dashboard-blue-480x362.gif "Suggestion for a WordPress adminstration dashboard")](https://kaspars.net/wp-content/uploads/2008/08/wordpress-dashboard-blue.gif)Suggested WordPress dashboard design. Blue.



[![Same design, only green](/wp-content/uploads/2008/08/wordpress-dashboard-green-480x361.gif "Suggested WordPress administration Dashboard design")](https://kaspars.net/wp-content/uploads/2008/08/wordpress-dashboard-green.gif)Same design, only green



### Standard Functionality and Design

Notice how all the Dashboard elements use the same expandable/collapsible boxes. By applying the two column model and the idea of left side column containing the *content* and the right side column containing the *action*, one could easily come up with a standard set of design templates and system hooks that would allow greater expandability and customization of the whole backend.

The *Write Post* page would have text inputs in the *content* column while users would be able to reorder and place *action* widgets either bellow the post (as it currently is since WordPress 2.5) or in the *action* column.

This idea was also detailed in the description of the [*WordPress* design prototype 1.1](http://ma.tt/dropbox/2008/06/wordpress-prototype-1.1.pdf) (.pdf, page 7).

The Javascript side for the drag-and-drop interface elements has already been created by the amazing folks of jQuery — [view demo](http://ui.jquery.com/).

### Design Decisions

What would you like to see on the front Dashboard which opens when you log in? What are the first tasks that you usually do apart from writing a new post?