Now that we’ve realized the value of building your own theme framework it’s time to start building it. The best laid plans a happy framework make, so we’re going to start this the smart way. What are the frameworks of today, and how can we learn from them?
I’d like to take this quick second to praise each of these developers for doing what they do, and for supporting the GPL. By embracing open source (and no doubt being embraced back, but I’m not talking) they’ve made our review session here possible. You all rock.
Now, let’s go steal some of their work and improve it.
by Andy Skelton/Scott Wallick
I will say that Sandbox, above all, has a special place with me. It was the first theme I ever used to build another theme, before I even knew to call it a “framework.”
As far as frameworks go, this one should be considered one of the grandaddies. The theme itself comes with a folder of tiny
CSS files, each of which when linked will turn the layout into what it describes. This is a clever way to include different layout options without bloating any of our
CSS, the only downside being that it means we have to include another file.
Sandbox is built with beautiful
XHTML markup and awesomely relevant classes in
lis. In fact, probably my favorite part of Sandbox is how it generates classes in the
body and post
divs. Check it out.
<body class="wordpress y2009 m06 d24 h12 home blog">
div surrounding the post:
<div id="post-38" class="hentry p1 post publish author-john-doe category-pater-semper-incertus-est tag-bacon tag-big-blue-car tag-dog tag-evil-man tag-foo-bar tag-old-yellow-house tag-turnkey tag-under-the-table tag-ur-kewl tag-vicecory-of-india y2008 m03 d28 h00">
If you’ve ever worked with
CSS before, then you should get excited when you see relevant classes like that. Not only do we get awesome stuff like the current date down to the hour in the
body and the date of the post in the
div, every piece of meta information you attach to your post will show up there as well. The implications of this are limitless, really. Want your site to change its background color or gradient based on the time of day? Easy, just use
body.h01, etc to change it at each hour.
<?php sandbox_body_class(); ?> function in functions.php gives the
body its swagger, and the
<?php sandbox_post_class() ?> does the same for the post
Upsides to Sandbox
- Relevant and useful classes throughout the theme elements
- Restructured listing of pages (the
<?php sandbox_globalnav(); ?>function)
CSSfiles for various site layouts (
- Solid example of a
by Alex King
If any theme we’re looking at deserves the “arrived ahead of its time” award, Carrington would be it. The standard reaction to Carrington tends to be somewhere in between “huh, that’s interesting” and “whuh?”. That makes it very interesting to me.
It doesn’t say anything negative about Carrington that some developers aren’t ready for something like this. Most developers are looking for a machete to clear the brush. Carrington is like an army of chainsaw wielding ninjas.
“Most developers are looking for a machete to clear the brush. Carrington is like an army of chainsaw wielding ninjas.”
Abstraction is a word to use when describing Carrington. Using functions from within WordPress like
is_single(), Carrington chooses the particular context to deal up a unique template for each situation. So you’ll find a lot of folders within this framework that you won’t with others, making it simple to dish out specific post, sidebar, and comment templates, to name a few.
Carrington is one of those themes you’ll have to really poke around in before you’ll have any idea what it is about. Odds are it won’t be the first framework anyone uses, but it’s one that anyone interested should check out. While we may not be pulling anything specific out of this one to improve upon in ours, we’ll definitely keep it in mind as an ideal concept on the horizon.
Upsides to Carrington
- Abstraction of templates to an atomic level
- Readme files in every folder
- Optional AJAX loading of posts and comments from any page
by Ian Stewart
When it comes to popular theme frameworks, Thematic takes the cake. With a thriving support forum, a growing gallery of child themes, and glowing reviews from the WordPress elite like WPCandy and Adii, WordPress is all a buzz about Thematic. So Ian must be doing something right.
One thing that stands out about Thematic is the prevalence of widgets. For the most part WordPress themes will utilize the widgets strictly for sidebars. But since widgets are the third of only three content placement options within WordPress right now (the other two being posts and pages) some theme authors are beginning to place widget ready areas in places other than sidebars. Thematic is one of these, with ten widget ready areas places throughout the theme’s structure.
Thematic is also the first theme we’ve looked at so far that makes use of a theme options page. Theme options are a touchy subject when it comes to frameworks, since any options will need to be generalized enough to work with any theme or child theme relying on it. Thematic keeps in simple, only saving the most basic information that would be usable on just about any site or theme.
Thematic also makes heavy use of hooks. Even if you’ve never taken advantage of a custom hook before, you’ve used them in your theme whether you know it or not. The standard
<?php wp_head(); ?> and
<?php wp_footer(); ?> are necessary in every WordPress theme, as they are used by Plugins for pulling in its own
PHP. The trick is, you can include your own hooks for others to use. If you are building a theme framework, including a multitude of hooks can make it that much easier for developers to add their own code to your themes using their
We’ll definitely want to include custom hooks in our framework. More on that later.
Upsides to Thematic
- Language independent (see the /library/languages folder)
- Prevalence of widgets all over the place
- Hooks for the easy addition of theme elements
by Justin Tadlock
Hybrid does a lot of great things that the themes we’ve talked about above have done also. Awesome
XHTML and the custom functions are great. So let’s talk about what Hybrid does that the rest of these doesn’t do.
WordPress looks for the right template based on a hierarchy. It will start looking for more specific template files, go less specific, and then always rely on
index.php if nothing else is there. Hyrbid adds a bit more fun to the equation. For archive pages, Hybrid has added in archive templates for lists of posts by month (
month.php), by day (
day.php), and even by the hour (
hour.php) and the minute (
“I’m not going to say that having a lot of template files will work for your theme better or worse That’s something you have to decide for yourself.”
The attachment templates are far more interesting.
audio.php works for audio file attachments,
image.php for images, and
text.php for text files.
Hybrid also includes a number of useful templates for different purposes, which not every framework does.
biography.php is for listing author information aside from the normal
logged-in.php will protect a page for only logged in users, and
sitemap.php for displaying the sitemap.
Hybrid has by far the highest number of template files of any of the frameworks we’re looking at here. I’m not going to say that having a lot of template files will necessarily work for your theme better or worse than having fewer. That’s something you have to decide for your own framework.
Upsides to Hybrid
- Specific attachment templates based on file type and archive templates down to the day and hour
- Templates for logged in users
- Widgets all over the place, like every great theme
Okay, so what?
We’ve looked at a few of the most popular theme frameworks that are out there right now. For the sake of not writing a book on the topic, we’ll stop with these and try to summarize our findings.
Widgets work everywhere. The easier it is to add content all over our themes, the better. Widgets are flexible, and there’s no limit to how we can use them. So let’s make sure our framework doesn’t skimp on them.
Atomic templates are the future. Carrington in particular shows us the possibility behind truly atomic theme templates. While going as far as Alex King has may not be useful for us at this point, let’s see just how far it makes sense to take it.
Theme options work, but only a little. We have to remember that any themes built using ours will also be using our theme options, so the more general they are the better.
Hooks aren’t just for Peter Pan. If we’re smart enough to include theme hooks in all of the right places, additions to the theme in the future will be simple and pain free. Let’s also stick to the suggested (by a user, keep in mind) standardized hooks thought up by Dan Cole. More on that soon.
Readme files a happy user make. The one thing present among each of these frameworks is a solid system of documentation. Readme files within the theme folder (sometimes within the folder’s folders) and online support all play a major role in the success of the themes we’ve looked at. We’ll have to be prepared for the same sort of thing, if we follow through with making our framework public.
It seems we have a few goals to keep in mind now. And remember, since we don’t want to be a GPL douchebag, we’re going to treat this as our own project and not just rip off any of these fine gentlemen’s work. This is for learning, not for stealing.
Next we’ll think through our theme’s structure and the files we want to account for, and start chipping away.