ThemeShaper

How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial

●

·

Ian Stewart
in

Update: We’ve created a second edition of this popular tutorial! It contains updated code samples, coverage of the latest theme development techniques, and more. Check it out at The ThemeShaper WordPress Theme Tutorial: 2nd Edition.

In only 11 individual lessons this WordPress Theme Tutorial is going to show you how to build a powerful, up-to-date, WordPress Theme from scratch. As we go along I’ll explain what’s happening including (for better or worse) my thinking on certain techniques and why I’m choosing one path over another. Essentially, I’ll be teaching you everything you need to know about WordPress Theme development.

Skip to the Table of Contents.

tutorial-graphic-large

Here’s the list of features your finished theme will be able to boast of:

  • All the search-engine optimization you’ll really need
  • Including google-supported Microformat markup
  • Valid and logical semantic markup structure than can be used to create ANY layout
  • Smart default CSS layouts
  • Dynamic Body, post and comment classes
  • Separated trackbacks and threaded comments
  • 2 widget areas coded to disappear when they’re empty
  • And all the typical WordPress stuff you expect from a theme

I think that’s kind of impressive—for any WordPress Theme.

At the end of this tutorial, with code in hand, you’ll be able to do almost anything you want. You can even think of the finished Theme as your own personal website development framework for WordPress.

I’ve already used it to start another project of my own, The Shape Theme. Download it and check it out if you’d like to see some of the finished code we’ll be going through, live, in action. Alternately, you can browse through the up-to-date source code for the entire tutorial on Google Code.

WordPress Theme Tutorial Table of Contents

Ready for a WordPress Theme Tutorial that will show you how to create a powerful WordPress Theme from scratch? Read it from the beginning and code yourself up something awesome.

  1. WordPress Theme Tutorial Introduction
  2. Theme Development Tools
  3. Creating a Theme HTML Structure
  4. Template and Directory Structure
  5. The Header Template
  6. The Index Template
  7. The Single Post, Post Attachment, & 404 Templates
  8. The Comments Template
  9. The Search Template & The Page Template
  10. The Archive, Author, Category & Tags Template
  11. The Sidebar Template
  12. Reset-Rebuild Theme CSS & Define Your Layouts

318 responses

  1. Reset & Rebuild CSS | listen to…

    […] been following Themeshaper’s How to Build a WordPress Theme series for last couple weeks. Overall, it’s been ok, but a little too code-heavy, and not […]

  2. hehe Avatar
    hehe

    Thanks. Gonna start next week.

  3. Wordpress theme készítés | Yloz féle zacc

    […] Introduction […]

  4. Lazarus Avatar
    Lazarus

    Wow! you da man!

    thanks so much from this fledgling WP enthusiast!!

  5. Create Your Own WordPress Theme Tutorial

    […] of ThemeShaper, the man behind the Thematic WordPress Theme framework, has recently published a comprehensive tutorial on creating your own unique WordPress […]

  6. Kumail.H.T Avatar
    Kumail.H.T

    This is definitely going to be the ultimate tutorial I have ever come across! Cant Wait 🙂

  7. eiffair Avatar
    eiffair

    Fantastic serie !!!
    I’m a beginner in blogging with wordpress and started a serie of posts about how I’m learning it.
    Your tutorial is exactly what I was looking for and I think it could be very helpfull to have a translation of it in french.
    If you agree with it I could do it for my blog with, of course, link to your posts, blog and promotion of Thematic.
    Let me know if you’re intersted with this idea.
    Thanks.

  8. Blog… » links for 2009-07-08

    […] How To Create a WordPress Theme (tags: useful tutorials wordpress webdevelopment) […]

  9. links for 2009-07-08 | Digital Rehab

    […] How To Create a WordPress Theme (tags: wordpress tutorial theme howto webdesign themes tutorials design) […]

  10. Raymond Selda Avatar
    Raymond Selda

    Hi Ian,

    This series is what I need to get Archetype out of the beta stage. I believe my theme is going to be better after reading this. Thank you so much for sharing your knowledge.

  11. clivestewart Avatar
    clivestewart

    This tuts are step by step just the way we like it!
    great work!

  12. Best of the Week 7/10 – Creattica Daily

    […] The icons are free to use – no strings attached. […]

  13. Lucas Tadeu Avatar
    Lucas Tadeu

    Just what I was looking for, thanks (:

  14. Grégoire Noyelle Avatar
    Grégoire Noyelle

    Great great. Thanks so much Ian !

  15. Small Potato, How To Create a WordPress Theme, and New Redesign

    […] than 2 years ago, Ian Stewart from ThemeShaper.com felt the need to create a new series teaching how to create a WordPress theme. So, if you always wanted to create your own WordPress theme and didn’t know how to, go check […]

  16. tj mapes » Blog Archive » What I’m Reading (weekly)

    […] How To Create a WordPress Theme […]

  17. How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial | Design Newz

    […] How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial […]

  18. Design55 Avatar
    Design55

    Nice post. Thanks!

  19. My Favorite Design Links of the (Rest of the) Week | eGrace Creative

    […] Create a WordPress Theme: The Ultimate Tutorial […]

  20. Créer un thème WordPress Traduction en français themeshaper | Eiffair

    […] de son site une série de 12 articles formant un tutoriel sur la création de thème WordPress : How To Create a WordPress Theme. J’ai littéralement dévoré ces leçons à la fois concises et complètes et totalement […]

  21. Créer un thème WordPress – Introduction | Eiffair

    […] Par Eiffair | Publié : 13 juillet 2009 Cet article est une traduction du tutoriel How To Create a WordPress Theme rédigé par Ian Stewart, l’auteur du framework WordPress Thematic disponible sur son site […]

  22. Créer un thème WordPress : Outils de développement | Eiffair

    […] Par Eiffair | Publié : 13 juillet 2009 Cet article est une traduction du tutoriel How To Create a WordPress Theme rédigé par Ian Stewart, l’auteur du framework WordPress Thematic disponible sur son site […]

  23. New Broom – a theme by Geoff Matheson

    […] to the white, maroon and grey that you’re more accustomed to. Well, after following the How To Create A WordPress Theme tutorial on the Themeshaper blog, I’ve delved into the realm of creating my own theme. It’s […]

  24. Créer un Thème Wordpress : 3. Structure HTML du Thème | Eiffair

    […] du Thème Par Eiffair | Publié : 13 juillet 2009 Cet article est une traduction du tutoriel How To Create a WordPress Them rédigé par Ian Stewart, l’auteur du framework WordPress Thematic disponible sur son site […]

  25. WordPress Tips & Länkar v29-09 | wpxl

    […] How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial: Har ni någonsin funderat på att skapa ert eget WordPress tema? I så fall finns det en guide för er som är intresserade av att knåpa ihop ett tema från början till slut! I elva steg visar Ian Stewart hur ni ska gå tillväga. Kanske är det något man skulle prova på, eller? Nja, jag tror inte jag själv skulle få ihop ett kvalitativt tema, men ni kanske kan? […]

  26. XAMPP中Apache不能运行的解决方法。 | 路人吧

    […] 　　开始学习精博翻译的Ian Stewart的WP主题制作教程如何创建 WordPress 主题，英文原版点此。 […]

  27. Berlin-KulturClub Avatar
    Berlin-KulturClub

    Thank You sooo much!!!

    That´s what i was looking for for a very long time!!!!
    finally i found it! Thanx again!

  28. Créer un Thème WordPress : 4. Structure des Dossiers et des Templates | Eiffair

    […] Templates Par Eiffair | Publié : 14 juillet 2009 Cet article est une traduction du tutoriel How To Create a WordPress Them rédigé par Ian Stewart, l’auteur du framework WordPress Thematic disponible sur son site […]

  29. 8 Tutorials about How to create a WordPress theme « WPCrowd

    […] Tutorial link […]

  30. Learn How to Creat wordpress theme from A to Z. | guidesigner.net

    […] Tutorial link […]

  31. 12 great tutorials on creating a new Wordpress Theme | [Re]Encoded.com

    […] The Ultimate WordPress Theme Tutorial […]

  32. Créer un Thème WordPress : 5. Le Template Header | Eiffair

    […] Header Par Eiffair | Publié : 14 juillet 2009 Cet article est une traduction du tutoriel How To Create a WordPress Them rédigé par Ian Stewart, l’auteur du framework WordPress Thematic disponible sur son site […]

  33. Créer un Thème WordPress : 6. Le Template Index | Eiffair

    […] Index Par Eiffair | Publié : 14 juillet 2009 Cet article est une traduction du tutoriel How To Create a WordPress Theme rédigé par Ian Stewart, l’auteur du framework WordPress Thematic disponible sur son site […]

  34. Créer un Thème WordPress : 7. Les Templates Single Post, Attachment et 404 | Eiffair

    […] et 404 Par Eiffair | Publié : 16 juillet 2009 Cet article est une traduction du tutoriel How To Create a WordPress Theme rédigé par Ian Stewart, l’auteur du framework WordPress Thematic disponible sur son site […]

  35. Créer un thème WordPress : 8. Le Template Comments | Eiffair

    […] Comments Par Eiffair | Publié : 16 juillet 2009 Cet article est une traduction du tutoriel How To Create a WordPress Theme rédigé par Ian Stewart, l’auteur du framework WordPress Thematic disponible sur son site […]

  36. 8 Tutorials about How to create a WordPress theme : FARIFUNCOM

    […] Tutorial link […]

  37. How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial | WpMash – WordPress News

    […] original post here: How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial Share and […]

  38. In choosing a CMS: 40+ Great CMS Theming Tutorials | Noupe

    […] How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial […]

  39. Créer un Thème WordPress : 9. Les Templates Search et Page | Eiffair

    […] et Page Par Eiffair | Publié : 21 juillet 2009 Cet article est une traduction du tutoriel How To Create a WordPress Theme rédigé par Ian Stewart, l’auteur du framework WordPress Thematic disponible sur son site […]

  40. In choosing a CMS: 40+ Great CMS Theming Tutorials – Programming Blog

    […] How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial […]

  41. Amalgamis.com

    […] this site is to be viewed as an on-going project. Beginning with a tutorial at ThemeShaper.com on creating your own WordPress theme and then building off of previous knowledge from older yet similar tutorials as well as my custom […]

  42. How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial | wpden

    […] original here: How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial Share this on del.icio.usDigg this!Buzz up!Stumble upon something good? Share it on […]

  43. Bryan Jones Avatar
    Bryan Jones

    I have a strange thing happening. I can’t get the sidebars to show up at all. I’ve copied and recopied the exact files from the google code area, but still no avail. The sidebars just won’t show up. Any ideas? I’ve got them on a test area here: http://www.bcjonesonline.com/test1

    Thanks.

    1. Ian Stewart Avatar
      Ian Stewart

      I’d try resetting your widgets by uncommenting the 1 line in the tutorial code (it’s noted there).

  44. WordPress Blog from Your Design Tutorials! | witola.com

    […] How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial […]

  45. Top 5 Content Management Systems « Lemuel Stevens – Freelance Web Designer & Developer

    […] WordPress Template Creation – https://themeshaper.com/wordpress-themes-templates-tutorial/ […]

  46. My First Theme

    […] code is based on Ian Stewart’s “How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial“, which I highly […]

  47. Créer un Thème WordPress : 11. Le Template Sidebar | Eiffair

    […] Sidebar Par Eiffair | Publié : 29 juillet 2009 Cet article est une traduction du tutoriel How To Create a WordPress Theme rédigé par Ian Stewart, l’auteur du framework WordPress Thematic disponible sur son site […]

  48. Créer un Thème WordPress : 11. Le Template Sidebar | Eiffair

    […] CSS Par Eiffair | Publié : 29 juillet 2009 Cet article est une traduction du tutoriel How To Create a WordPress Theme rédigé par Ian Stewart, l’auteur du framework WordPress Thematic disponible sur son site […]

  49. Créer un thème WordPress : 10. Les Templates Archive, Author, Category et Tag | Eiffair

    […] et Tag Par Eiffair | Publié : 21 juillet 2009 Cet article est une traduction du tutoriel How To Create a WordPress Theme rédigé par Ian Stewart, l’auteur du framework WordPress Thematic disponible sur son site […]

  50. nitendra Avatar
    nitendra

    Thanks for the excellent article. It had clear my doubt, i m using it from past 2 months but getting the good result.

Previous:
Next: