The WordPress Theme Comments Template

I hate the Comments Template. There, I said it. It can be a confusing mess.

Luckily for you, I’ve sorted it out. Confusing still, yes. But sorted out. For this tutorial on the Comments Template, I’m basically going to walk you through what’s going to happen, show you some custom code snippets you’ll need to add to your inc/template-tags.php file, and then drop the whole thing on you. Hopefully, it’ll start to make sense. But at the very least you’ll have a wicked comments template.

Continue reading “The WordPress Theme Comments Template”

The WordPress Theme Single Post, Post Attachment & 404 Templates

You’ve built an index of all your posts, now you need to create a template to frame each piece of content (or missing content) on its own. In this lesson, you’ll create templates for single posts, post attachments, and 404 error pages.

Continue reading “The WordPress Theme Single Post, Post Attachment & 404 Templates”

The WordPress Theme Index Template

Index.php is the most crucial WordPress Theme Template. Not only because WordPress needs to use it if you’re missing any of its brother and sister templates (like, archive.php or tag.php) but because the work we do here, getting this template right, will help us breeze through the rest of our templates (with the exception of the dreaded comments template; that’s just plain difficult no matter how you look at it).
Continue reading “The WordPress Theme Index Template”

The WordPress Theme Header Template

Now we get into the nitty-gritty: building up your header.php and validating your theme with an HTML Doctype. There’ll be a lot of PHP in this lesson, but don’t despair. We’re also going to do two essential (and kinda neat) search engine optimization techniques and add some more things to your functions.php file.
Continue reading “The WordPress Theme Header Template”

WordPress Theme Template & Directory Structure

While the most minimal of WordPress Themes really only need an index.php template and a style.css file (or just the style file if it’s a Child Theme) most need something a little more solid.

Let’s create the directories and files that will make up our _s-based theme, Shape.
Continue reading “WordPress Theme Template & Directory Structure”

Creating a WordPress Theme HTML Structure

Now we’re starting to get into the real meat of WordPress Theme development: coding the HTML structure.

The Goals of Any HTML Structure

When coding a web site, you should have 2 goals in mind: lean code and meaningful code. That is, using as little markup (HTML tags) as possible and making sure that the markup is meaningful by using semantic class and ID names that refer to their content, not how they “look” (class=”widget-area” instead of class=”sidebar-left”).
Continue reading “Creating a WordPress Theme HTML Structure”

WordPress Theme Development Tools

Before we get started building any WordPress Theme, we’re going to need to get our development tools in place. In this post, we’ll build ourselves a cross-platform WordPress Theme test environment that would do a professional Theme developer proud.

Before we get started building any WordPress Theme, we’re going to need to get our development tools in place. In this post, we’ll run through the best of the best and build ourselves a cross-platform WordPress Theme test environment that would do a professional Theme developer proud.

Continue reading “WordPress Theme Development Tools”

Underscores.me — The Best Way To Get Started With The _s Theme

Back in February we introduced you to _s, or Underscores, the WordPress starter theme we use at Automattic to build the majority of our themes (and even when we’re not building themes from it we’re referring to it). It’s come a long way since then with a steady stream of refinements. But one thing about it has always been … less than refined. To fork _s you’d have to do a, well, OK, kind of annoying search and replace routine that could easily trip people up if they did it wrong. Thanks to the efforts of Hugo Baeta and Konstantin Kovshenin that isn’t the case anymore. And they’ve done away with that problem with incredible style. Themers, check out Underscores.me:

You can now download your own version of _s with your own custom theme name — the search and replace is all done for you. All you have to do is theme. Plus, you can see all the beautiful people who have contributed to your favorite WordPress starter theme. Look at them all! Community theme development, FTW.

So, what are you waiting for? Get over to Underscores.me and start developing that awesome theme. We can’t wait to see it.

Theme Options Gallery: The Best (and the Worst) Theme Options Screens Around

Man, theme options. 🙂 There aren’t many more topics in WordPress theme development that inspire more discussion these days than theme options. If you haven’t seen it yet, check out Konstantin Kovshenin’s Theme Options Gallery. Konstantin reviews the best and worst theme options pages around there. It’s where the best discussion on theme options is happening right now.