Digging into WordPress » free

BLANK WordPress Theme

Chris Coyier — Wed, 17 Feb 2010 15:43:26 +0000

There are many like it, but this one is mine.

I have a “blank” WordPress theme for myself, because I make a lot of WordPress themes. Starting from Kubrick, or any other pre-made theme, would be absurd. There is to much stuff there that would to be stripped out or fought against to be useful. So, I have my own. It’s been in a folder called BLANK-theme on my computer for a while, so I’m going to call it BLANK. And now I’m making it available for you. Read on to find out the scoop on it and you can decide if it would be of any use to you.

UPDATE: Please take a look at the WordPress Theme that is a part of the HTML5 Reset. It is based on this and far more up-to-date with modern standards. Ultimately I’ll be replacing the theme here with that.

What is BLANK?

It is a WordPress theme with all the functionality of a typical WordPress theme but almost none of the styling. The idea is that when starting a new theme, it is far easier to use this as a base then a theme that is already finished and styled.

What are some of it’s “features”?

Things are as semantically marked up as can be for a starter theme.
It’s XHTML 1.0 STRICT and validates. Maybe it will go HTML5 soon. We’re at that point where there isn’t a whole ton of advantages to going to HTML5 yet, but there aren’t many downsides either and it’s definitely the future.
The sidebar is widget-ready.
Page titles are optimized for best SEO and readability/usability.
Functions.php file does a number of things: Sets up RSS ’s in the head automatically, loads jQuery, removes the weird header links like rsd_link, wlw manifest, and generator info that I’ve never once needed, and registers the sidebar widget area.
Has some starter CSS ready to go, more about that below.

Uses includes for some key things, like under-title meta data and forward/back navigation, that are very common places for redundant code in themes.

About the CSS

As you can see from the screenshot above, the CSS is pretty barren, but not entirely! Here are some things the CSS is set up for:

Uses a basic star-selector reset.
Includes a .group selector for the new clearfix
Has basic toolbox and WordPress-standard CSS classes, including .screen-reader-text for hiding things.
Standard typography-related sectors are there but generally without any attributes.
CSS for threaded comments is in there, but light on actual styling.
Both screen and print styles included in single stylesheet. Print styles optimized for generic nice printing.

Demo and Download

If you want to take a peek at it live, you can view it in our Theme Playground. You can also download it from there, or directly right here.

Free HTML 5 WordPress Theme

Jeff Starr — Wed, 01 Jul 2009 07:19:43 +0000

In an effort to inspire more WordPress theme designers to embrace HTML 5, I am releasing the “H5” Theme Template. The H5 Theme Template is a bare-bones WordPress theme built entirely with HTML 5 and styled with CSS 2.1. As you may know, HTML 5 provides greater flexibility and interoperability than previous markup languages, and enables us to build well-structured themes that are more flexible, interactive, and semantically precise.

About the ‘H5’ WordPress Theme Template

The H5 Theme Template provides everything you need to create beautiful themes with HTML 5 right now. H5 contains a complete set of theme files and folders, and each file has been meticulously crafted with all of the latest and greatest WordPress functionality. As a template theme, H5 is designed with easy customization and personalization in mind, serving as a solid starting point for your next HTML-5-based theme.

Unlike other frameworks, H5 works great as a basic theme right out of the box. Of course, this is a template theme we’re talking about here, so you will inevitably feel “inspired” to begin tweaking and styling its minimalistic appearance to get the design looking exactly how you want it. And that is entirely the point: H5 makes it quick and easy to begin designing themes with HTML 5. And best of all, H5 is completely free. Sound good? Great, let’s dig into the specifics..

‘H5’ Specifications

First, thanks for your interest in the H5 Theme Template. I am very excited to be sharing this theme with the WordPress community and hope that you will put it to good use. Next, three important points that I would like to emphasize:

H5 is completely free and licensed under GPL
H5 is a template used to build HTML-5 themes
H5 is built entirely with WordPress, HTML 5, and CSS 2.1

About the markup

Uses as few tags and attributes as possible
Contains no
s, s, classes, or ids!
Built with semantically sound and fully valid HTML 5
Outputs clean, well-formatted source-code (although WordPress botches most of it)

About the CSS

Just enough CSS to target key elements, provide some structure, and make it “look” like a basic theme
Built with well-formatted and fully valid CSS 2.1 (current spec)
Uses child, adjacent, and attribute selectors to target elements without ids or classes

About the JavaScript

Uses only unobtrusive JavaScript
Uses createElement() to specify block elements for Internet Explorer
Includes WordPress’ jQuery script the right way

About the design

Includes minimal markup and styles for easy customization
Features a full set of theme template files and common folders
Very minimal, meant to do just the basics and serve as a starting point
Uses default and/or standard WordPress template tags, loops, and other functions
Looks and works great out of the box in (almost) all modern browsers (see next section)
Designed to be as lightweight and fast as possible — only essential tags are included

Browser compatibility

H5 looks and works great in the following browsers (and most likely others as well):

Firefox 3
Opera 8*
Opera 9
Chrome 1 & 2
Safari 2, 3, & 4
Internet Explorer 7*
Internet Explorer 8

* Denotes slight inconsistencies in these browsers.

For Firefox 2, Camino 1.6, and IE 6, the HTML seems to work great, it’s just some of the “advanced” CSS selectors that some browsers don’t understand. This is easily handled by simply adding a few choice id or class attributes to key elements (none are used by default).

Download and Demo

For a “live” demo of the H5 Template Theme, check out our newly revamped DiW Theme Playground, where we will be hosting any themes that we release here at Digging into WordPress.

At the DiW Theme Playground you will find a dropdown menu at the top of the browser window that enables you to preview any of our themes, as well as a download link for whichever theme happens to be active (Chris’ excellent WP Typo is the default active theme).

Free Theme: WP Typo

Chris Coyier — Thu, 18 Jun 2009 13:10:48 +0000

A big thanks to everyone for being supportive of the launch the website launch for Digging into WordPress. As thank you, and to celebrate our launch, I’d like to present to you a brand new free WordPress theme for you to download. It’s called WP Typo. You can view the demo here and download the theme here. It was designed by myself, then coded through WP Coder (as part of this review), and a little additional coding again my myself.

Here is the scoop:

It is 100% typographic; there are no images used at all.
It includes the PSD in case you want to make modifications and want to feel it out graphically first.
You can do whatever the heck you want with it. No attribution required.