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

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

Continue reading

Street: A Thematic Child Theme by CozmosLabs

Thematic expert, Cristi at CozmosLabs has released another excellent Thematic Child Theme. This one’s called Street.

The Street Theme

Here’s what Cristi had to say about it:

Street is something that was created from a spark of inspiration,
something that I felt should look like this. This wasn’t thought out
nor planed. It took only 4 days from the initial idea to the launch of
the theme.

Street Features:

  • It uses the beautiful Vegur Free Font for the headings and main menu, implemented by Cufon (text replacement technique).
  • Upload your own logo or header image from the “Street Theme Options”.
  • One Column page template that spans the width of the page

So You Want To Create WordPress Themes, Huh?

Update: It’s live! It’s happening! Go read How To Create a WordPress Theme and learn how to code up something awesome.


Does that title sound familiar? Over 2 years ago the now defunct WPDesigner.com published a series of posts under that banner, teaching beginners how to create WordPress Themes from scratch.

2 years ago is a long time online: Things have changed.

Starting next week, ThemeShaper will publish a series of daily lessons that will teach you how to create your very own modern WordPress Theme—from scratch—using the latest best practices.

And it won’t be just any old WordPress theme you’ll have in your hands. In a lot of ways it will surpass what’s been done with the popular Thematic Theme Framework. Except, it’ll be a little leaner, a little meaner, and it’ll be all yours.

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

  • Search-engine optimization
  • Microformats
  • Localization support for translation
  • Robust dynamic body and post classes
  • Separated Comments and Trackbacks
  • Gravatar support
  • A valid, logical, semantic XHTML structure you can use to build ANY layout
  • Valid CSS
  • A strong typographical foundation
  • Smart default layouts (that we can adapt for later layout generation)
  • 2 widget areas, with NO hard-coded widgets, that “disappear” from the markup when they’re empty.
  • Styling for WordPress Image Classes
  • And pretty much all the typical WordPress stuff

When you’re done you’ll have a complete—and completely powerful—WordPress Theme that you can edit further or build on with a WordPress Child Theme. The choice is yours.

Are you ready?

Get Thematic Version 0.9.5

It’s here! Thematic 0.9.5. A huge refinement of the Thematic Theme Framework—so huge that it’s only caution keeping me from calling it version 1.0. Chris Gossmann and I spent a lot of time on this version chopping down our personal to-do lists. Chris especially, making sure brilliant themes like the Gallery Theme are even easier to make. That’s right, even easier.

Here’s the quick list of what we’ve done to make Thematic easier for you to use.

  • Want to quickly find out what you can hook into and where? Browse through the cleaned up and organized extension files in the library. They’re logically organized and better documented.
  • Every last default widget ready area is hookable. Before, after, and in between.
  • We’ve added a hook before and after the main loops. You’ll be seeing a lot more magazine Child Themes I think.
  • The older/newer and post navigation is filterable.
  • Don’t want the Secondary Aside? Pull all the widgets out. The default widgets are no longer hard-coded into the sidebar template files.
  • You can move the comments template by unhooking it and injecting it somewhere else. Adding even more layout possibilities for creative designers.
  • More new dynamic body classes enabling surgically precise CSS work.

What it boils down to is this: I want you to be able to quickly develop powerful, rock-solid WordPress Themes with the Thematic Theme Framework. This version of Thematic just makes it even easier.

Of course, there’s more. As always thank you to everyone who’s contributed to the Thematic Theme Framework and this release. I’m getting pretty excited about Thematic and what it’s leading to. I hope you are too.

Download the Thematic Theme Framework and read how to modify WordPress Themes the smart way. It’ll change how you think about WordPress and WordPress Themes.

Using Action Hooks in WordPress Child Themes

In this post we’ll review how to write a PHP function and go over the basic idea of how you can use Action Hooks in your WordPress Theme. We’ll take a look at a practical example of injecting a Welcome Blurb into your Theme without touching the existing code and we’ll also look at how to remove existing content being injected into Theme Hooks.

Packing Up A Function

Action hooks are in a lot of WordPress Themes nowadays. There’s a good reason for that but you’re probably wondering what the big deal is right? They’re such a big deal because firstly, they’re incredibly easy to use and secondly, because they’re extremely powerful.

If you want to get started with them we’re going to have to take a look at how to write a PHP function again. Don’t worry, we’ll keep it pretty simple.

Continue reading

How To Design A Popular WordPress Theme: Chris Pearson’s Secret

Want to design a popular WordPress Theme? Then you better take a look at what Chris Pearson is doing. He knows the secret of designing a popular theme.

Chris is arguably the most popular and successful WordPress Theme designer in the short history of blogging. Press Row, Cutline, The Copyblogger Theme, Neo-Classical, and now Thesis, have all struck a resounding chord with the WordPress community. It’s impossible to find a blogger that hasn’t run across at least 1 of these 5 themes and admired them.

What’s his secret? Why are his simple-looking themes more successful than others? Can any theme designer duplicate his success?

Continue reading

The Gallery Theme for Thematic by Chris Wallace

Wow. Just, wow. Chris Wallace has outdone himself with the advanced Thematic Child Theme he’s released through Smashing Magazine. It’s called Gallery and it’s amazing.

gallery

Gallery—like every theme released through Smashing Magazine—is just packed with loads of cool features.

  • A jQuery slide hover effect on thumbnails
  • Lazyloading for thumbnails
  • Built-in social media links for each gallery item
  • Seamless integration with the following plugins: WP-PostRatings, BuySellAds plugin, and Contact Form 7
  • And, of course, it’s built on Thematic.

Make sure you check this one out if you’re looking at producing a Gallery or Portfolio site. Smashing Magazine calls it “extremely flexible” and recommends it as a “starting point for design galleries and portfolios”. Get the Gallery Theme.

Using Filter Hooks in WordPress Child Themes

In this post you’ll learn to take advantage of Filter Hooks in your WordPress Child Themes. Filter Hooks are an essential weapon in your WordPress Theming arsenal. With them you’ll have almost complete control over the HTML created by your WordPress Theme—without touching any template files.

Warning: things will get a little technical on this one but hang in there—you’re about to become an expert in this stuff.

Continue reading