Designing the SimpleAdmin Theme: Forms and Controls
videos

Designing the SimpleAdmin Theme: Forms and Controls

on Feb 7th 2012 with 14 comments
Tutorial Details
  • Topic: Admin Theme Design
  • Difficulty: Beginner
  • Screencast duration: 27 mins

Final Product What You'll Be Creating

Download Source Files
This entry is part 3 of 6 in the series The SimpleAdmin Theme

The SimpleAdmin Theme

In this, the third part of our Admin theme series, we’ll look at finishing off the Dashboard layout. We’ll design the all-important form elements, alerts and some additional controls.

Part 3: Forms and Controls

Alternatively, Download the video, or subscribe to Webdesigntuts+ screencasts via iTunes!

Further Resources

Series Navigation<< Designing the SimpleAdmin Theme: DashboardCoding the SimpleAdmin Theme: Login Page >>

Adi Purdila is AdiPurdila on Themeforest
 
Enjoyed this Post?

Subscribe to our RSS Feed, Follow us on Twitter or simply recommend us to friends and colleagues!

By

Rollover to read this author's bio or click through to see a full list of posts by this author.

Whether it’s websites, logos or print materials, my work philosophy is the same: never take any shortcuts and always put my heart and soul into each project because in the end, it’s the small details that count and the more effort I put into a project, the better it represents myself as a person and a designer and at the same time, it represents my client in a manner that’s appropriate to his needs. If you’re interested in the HTML Templates and Landing Pages I’m developing, you can check them out on my portfolio page on ThemeForest.  

Plus Premium
 
 
Note: Want to add some source code? Type <pre><code> before it and </code></pre> after it. Find out more
  • Blane

    C’mon, I’m dying seeing the coding part!! :D

    • http://www.adipurdila.com AdiPurdila
      Author

      They’re coming guys, won’t be long now :)

      • ChrisR

        Sweet. Will you be using basic HTML5 or XHTML?

        • http://www.adipurdila.com AdiPurdila
          Author

          HTML5 for the doctype, but the rest will be XHTML :)

  • Frank

    Hi Adi,

    As usual great video’s!

    can you tell me when to expect your masterpiece ;-) The wordpress conversion?
    I can hardly wait.

    Thanks

  • Mike

    U rock adi ;d

    looking forward for the coding part ;d

  • supprof

    adi purdila is hero
    best design video tutorial ever seen in the internet
    1 000 000 000 thank you adi

  • Techeese

    I like these series because of how adi uses freebee icons and simple design to make a clean and attractive theme

    will you use jQueryUI for all of the form controls? or plain jQuery or vanilla js(yes,please :D) even ? :)

    • http://www.adipurdila.com AdiPurdila
      Author

      I won’t be using any custom form controls, just styling the inputs/textareas from CSS :) It’s a simple theme, so I don’t wanna put too much stuff in it.

  • Carol

    CODE CODE CODE CODE CODE! :D

  • Pingback: Weekly Fresh Web Design Freebies – Vol. 5 (2-8-2011) « CSS Tips

  • http://afpwebworks.com Mike Kear

    I get really bored with all these “here’s how I design in Photoshop” tutorials. All they are is a how-to in making effects in Photoshop, whicn might or might not be practical and accessible on the web. And they tend to come across as “look how clever I am” rather than teaching anything useful. No one uses photoshop in the final web page, so why bother, except to pitch a design to a client? Why on earth do we need to spend so much time on how to draw a button in Photoshop?

    I am MUCH more interested in how to code these effects, how to organise files, how to do the effects in CSS. In this example, you’ve had to create the design in Photoshop, then you’re going to have to do it all over again in HTML/CSS editors.

    Why not structure these tutorials more as “here’s the design we created in Photoshop, now here’s how we make it into a living, breathing web site.”

    • http://www.adipurdila.com AdiPurdila
      Author

      Mike,

      I understand your point and for someone that knows PS well enough these can be redundant, but you must understand not everyone who reads this blog is PS savvy so these videos might actually help them. Plus, if you don’t like the vids, you can always skip them and wait for the coding ones to show up.

      Still, you make a good point and I’ll give it some thought. Thanks!

    • http://www.snaptin.com Ian Yates

      Hi Mike, I’m not going to dive into a predictable defense of our publishing schedule, but I will just say that we aim to cater for as many people, across as broad a range of skill levels, as possible. You shall have your coding tutorials!

      (And our posts are never about “look how clever I am”…..)

  • BrushMechanic

    The form is great but in the context of a web page when it comes to uploading to a server how do you make it work ? i have tried this without success trying various PHP pages loaded separately and on the same page all in the main public access folder. Is driving me crazy. Have no-one to ask