# A guide to the Hybrid theme

Hybrid is a user-friendly, search-engine optimized theme framework, featuring 15 custom page templates and 8 widget-ready areas, allowing you to create any type of site you want.

What this means is that the possibilities are endless. It is about rethinking how WordPress themes should work. It looks simple on the outside, but you can do nearly anything with enough creativity. Everyone from first-time WordPress users to advanced developers and designers can take advantage of this theme framework.

## What is Hybrid?

I've been dabbling in the art of creating WordPress themes since 2005 and website design a couple of years longer than that. In that time, I've come to realize that the reuse of code is a cornerstone of good development practice. Why code the same things over and over when I can build off the same codebase, continually making it better?

Hybrid is a parent theme that focuses on code reuse and upgradability. What this means is that all of the core functionality is housed within a single theme. And, anytime one wants to make a modification, it should be done within a child theme. By doing this, the Hybrid parent theme can be upgraded (just like WordPress) without any loss of customizations.

## Features

The theme has everything you need to get started building your site. Here's a list of some of the features:

- Makes use of standard WordPress functions so that plugins will integrate easily.
- Dynamic global, post, and comment CSS classes.
- Fully localized, so you can run Hybrid in any language.
- Uses the built-in WordPress menu system. No need to hack your navigation into place.
- Context-aware action and filter hooks, so you don't have to learn WordPress conditional tags.
- Some of the most-used filter hooks are shortcode-ready and have accompanying shortcodes.
- Theme settings page that allows you to add custom meta boxes and settings.
- A redefined template hierarchy that makes larger sites easier to design for.
- Ability to create custom templates for any post type in multiple ways.
- Comes loaded with 15 custom page templates and an extra post template.
- Easily add post-specific settings and not make users learn how to use custom fields.
- Highly-configurable widgets that give you full control over their display.
- Has the Get the Image plugin built in.
- Has the Breadcrumb Trail plugin built-in.
- Comes loaded with eight default widget areas.
- Widget areas are content-aware, meaning that they only appear if they contain active widgets.
- Widgetized 404 template, which allows you to create a custom 404 error page.
- And much, much more!

Remember, those are just some of the features. Hybrid is a foundation that should make it easy to launch nearly any WordPress-powered site.

## Child Themes

When I call Hybrid a theme framework, I mean it. It is meant to be used as a base theme to build from. What this allows us to do is extend it through child themes.

Yes, you can create your own theme. Even if you're a total noob to WordPress!

Just create a new theme folder in your `/wp-content/themes` directory. Call it something like My Hybrid or some other much cooler name. So, you'd have a directory like `/wp-content/themes/my-hybrid`. Then, create a `style.css` file within your theme folder. At the top, add this information:

    /**
     * Theme Name: My Hybrid
     * Theme URI: http://link-to-your-site.com
     * Description: Describe what your theme should be like.
     * Version: 0.1
     * Author: Your Name
     * Author URI: http://link-to-your-site.com
     * Tags: Add, Whatever, Tags, You, Want
     * Template: hybrid
     */

Now, you have your own theme! Of course, you might want to style it.

Here are a few stylesheets that will help you get started. Just add this to your new `style.css` file.

    /* Get base 21px CSS */
    @import url('../hybrid/library/css/21px.css');

    /* Get a layout CSS */
    @import url('../hybrid/library/css/2c-l-fixed.css');

    /* Get the plugins CSS */
    @import url('../hybrid/library/css/plugins.css');

    /* Get the drop-downs CSS */
    @import url('../hybrid/library/css/drop-downs.css');

    /* Get default Hybrid CSS */
    @import url('../hybrid/library/css/screen.css');

The `21px.css` resets all browser defaults, gives you `21px` margins, and sets up some nice typography for you to start with. The `2c-l-fixed.css` sets up a two-column layout with the content on the left. The `plugins.css` sets some default styling for supported plugins. The `drop-downs.css` gives you some base styling for drop-down menus. The `screen.css` is the default theme CSS that you can overwrite.

## Theme Support

The most authoritative source for finding out how to use the theme or do some nifty stuff is the theme documentation. I'll constantly update it with tutorials and frequently asked questions.

We also have a vibrant community at the Theme Hybrid Support Forums where you can get help with Hybrid-related issues.

## Frameworks & Other Code

Hybrid owes a lot of thanks to several CSS frameworks and code other people have worked hard at putting together. The default styles and extra stylesheets take ideas and code from many different frameworks and stylesheets.

- 960 Grid System (License: GPL & MIT)
- Blueprint (License: MIT)
- Tripoli (License: GPL)

- Superfish (License: GPL & MIT)
- Supersubs (License: GPL & MIT)

## Credit

I don't know if I can come close to naming all the people that should be credited, but I'll list some of the main folks.

- Ian Stewart
- Prologue
- Sandbox
- Tarski
- WP Framework

- Microformats
- MicroID
- Otto's WP 2.7 comments enhancements
- Nathan Rice's SEO for WordPress guide
- WordPress, of course!

## Copyright & License

Hybrid is licensed under the GNU General Public License, version 2 (GPL).

This theme is copyrighted to Justin Tadlock and Theme Hybrid.

2008 – 2010 © Justin Tadlock. All rights reserved.