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.
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.
- WordPress Theme Tutorial Introduction
- Theme Development Tools
- Creating a Theme HTML Structure
- Template and Directory Structure
- The Header Template
- The Index Template
- The Single Post, Post Attachment, & 404 Templates
- The Comments Template
- The Search Template & The Page Template
- The Archive, Author, Category & Tags Template
- The Sidebar Template
- Reset-Rebuild Theme CSS & Define Your Layouts
ThemeShaper 
318 responses
Thanks for this great tutorial and for the many hours you obviously have invested in it. I now have a much more thorough understanding of how the pieces of a wordpress theme fit together.
I did notice the same thing that Bryan Jones referred to in his post on July 27. The sidebars do not appear when using the downloadable theme from wordpress.org. In fact, there are no sidebars when previewing the theme at wordpress.org. There appear to be some dicrepancies between the online copy of functions.php and the tutorial. Perhaps that is an earlier version online, or maybe we are missing something?
Thanks again for all you are doing for us noobs!
[…] How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial […]
[…] Tutorial: How To Create A WordPress Theme: The Ultimate WordPress Theme Tutorial […]
[…] 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 […]
[…] a series of tutorials taking you through how to develop a wordpress theme from the bottom up, so I’m seriously […]
Thanks for such a great resource, Ian! If the comments before mine are only half true, this WordPress newbie will be a happy girl once she’s gone through all the lessons.
[…] Once you want to get in under the hood and figure out what to do with the PHP and CSS files in the Appearance>Editor to make fully customized sites with real CMS functionality for clients, read through this great Themeshaper tutorial. […]
[…] How To Create a WordPress Theme – This series of posts by Ian Stewart over at ThemeShaper will take you through the process of making your very own WordPress theme from scratch, similar to a series of posts made by Small Potato over at WPDesigner over 2 years ago. This really is a must-read series if you’re interested in WordPress theme development. […]
[…] WordPres 主题开发教程的中文版。这套教程的名字叫做 How to Create a WordPress Theme ，中文为：如何创建 WordPress […]
[…] How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial […]
[…] How To Create a WordPress Theme – […]
Really cool and helpful article on starting on a new wordpress theme. Thanks mate.
can’t wait to dig into this when some free time opens up, thanks!
[…] How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial […]
really awesome i adore it
CSS is tricky to make 2 columns into the same length, does the word press template automatic does it or how does that work?
[…] How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial […]
[…] haven´t heard of thematic before then you should check out Ian´s excellent site, especially the great tutorials he has written on customizing thematic and […]
I just wanted to let you know I’ve followed this tutorial step by step, and it was just what I was looking for. A million times, thank you!
[…] is a great step by step collections of lessons that will help you make a WordPress theme from scratch. Ian Stewart, founder of Theme Shaper lays it all out for you in plain English. So have […]
[…] that I went with Thematic because of the better documentation. It took a little digging, but this tutorial series of blog posts are really helpful to get you started. I particularly appreciated the pointer to a sample xml file you can import into your theme to help […]
[…] themeshaper.com/wordpress-themes-templates-tutorial/ […]
[…] Como crear un tema para WordPress – ThemeShaper. […]
[…] I’ll be teaching you everything you need to know about WordPress Theme development… view linkscolor = "EC1359"; highlightscolor = "ffffff"; backgroundcolor = "ffffff"; channel = […]
Hi Ian,
Thanks so much for the tutorials – I have been working on them and enjoying learning more about WordPress themes. I am, however, stuck with a little problem that I can’t find the solution to.
I have been doing everything exactly as you say in the tutorials (as far as I know!) – but when I go to upload my new theme, I get this error message:
“Warning: file(C:…wp-content/themes/char/style.css) [function.file]: failed to open stream: No such file or directory in C:…wp-includestheme.php on line 180
Warning: implode() [function.implode]: Invalid arguments passed in C:…wp-includestheme.php on line 180”
Have you any ideas how I might fix this? Thanks for any help you can provide, and for all the help you have provided already 🙂
Char
[…] можно организовать дизайн самому, то вперед изучать мануал. Сразу оговорюсь, что он на зарубежном языке однако […]
[…] nytt avsnitt publiceras varje dag (utom lördagar och söndagar) med start den 22/6 2009. Kursen hittar du här. Bookmark the permalink. Post a comment or leave a trackback: Trackback URL. « Uppdatera […]
[…] да създадем собствен WordPress Темплейт https://themeshaper.com/wordpress-themes-templates-tutorial/ в Любими преди 10 секунди edno23.com Начало контакти […]
[…] Themeshaper: How to create a WordPress theme: the ultimate WordPress theme tutorial […]
[…] How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial […]
[…] Theme Shaper – When I began researching how to build a custom WordPress site, I started looking at the Codex for […]
[…] Theme Shaper – When I began researching how to build a custom WordPress site, I started looking at the Codex for […]
[…] Theme Shaper – When I began researching how to build a custom WordPress site, I started looking at the Codex for […]
[…] Theme Shaper – When I began researching how to build a custom WordPress site, I started looking at the Codex for […]
[…] How to Create a WordPress Theme: The Ultimate WordPress Theme Tutorial – An extremely in-depth tutorial for creating themes from ThemeShaper. […]
I’ve followed all the steps of your tutorial to the letter. I’m working on a local server.
Now nothing appears in my browser when I search for my theme. I can fool it by calling another theme in my themes folder ‘your-theme’ but I can’t figure out how to access the one I’ve just done.
Any suggestions?
I canni wait man
oh well, try again. There’s a stylesheet missing. I can work with CSS but am not expert enough to know which stylesheet is missing. So my question is, having spent a few hours putting together the your-theme files, what stylesheet do I need to get up and running?
[…] Inače, ako ste očekivali tutorijal o kreiranju WordPress teme, videli ste da sam otišao u sasvim drugom pravcu. A, kada ste već stigli do kraja, izvanredan tutorijal o tome možete naći ovde. […]
[…] WordPress Themes Template Tutorial Series […]
I’m looking for some advice. I’ve copied the tutorials to the letter but still have a broken site telling me the stylesheet is missing. I’m not expert enough to figure out what to do. The stylesheet seems to have everything and the styles folder as well. I think I’m missing something obvious. Any help would be much appreciated. Thanks
Hi,
Just rename the “styles.css” to “style.css” and you should be set. I had the same thing happen. It drove me crazy. Good luck.
Thank you so much for the tutorials…
[…] How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial […]
[…] theme. You have 2 weeks to get it done, so the sooner you start the better! Start with the tutorial: https://themeshaper.com/wordpress-themes-templates-tutorial/ and email me if you get stuck. We can also do trouble shooting in class next week. Start thinking […]
[…] The Ultimate WordPress Theme Tutorial by Theme Shaper […]
It dont shows me the widgets on the main page but in the Admin Panel->widgets there are present activated widgets. These widgets apears only if I do any modification on widgets page in admin panel. Can you help me?
[…] ThemeShaper Tutorial ] [ WordPress Codex […]
[…] ThemeShaper Tutorial ] [ index.php (with my comments) ] [ ThemeShaper Files on Google Code ] [ ThemeShaper Styles on […]
[…] How to Create a WordPress Theme via ThemeShaper. Are you ready to make your own theme? Perfect it and sell it? I applaud your tenacity and drive. Start here. […]
[…] How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial […]