TwentyTen Extended – add Color to the Default WordPress Theme – TwentyTen child theme that makes it easy to change the colors of various elements without editing or writing code. ∞
By Jeffro on June 16, 2009
Justin Tadlock announced on the ThemeHybrid blog earlier this morning that version 0.6 of the Hybrid Theme Framework was released to the public. This is a big release for Justin as the new framework has been coded from the ground up with modularity in mind. One of the most important things to take notice from this release is that 0.6 is NOT compatible with versions of WordPress earlier than version 2.8.
Unfortunately, with so many new features in WordPress 2.8, I couldn’t make the theme backwards compatible. It’s something I wanted to do, but it wasn’t a viable option.
Along with bug fixes, leaner code and removing unnecessary files, this version also contains an assortment of new page templates. This puts the total number of templates inbetween 55 and 60. But, Justin has a valid reason for providing all of these:
I want things to be easier to overwrite with custom modifications. I want people to be able to take my ideas and branch from these ideas with new, cooler things. Most of these deal with different types of archives and may not be used by everyone. But, I wanted them available for those people that do need to use them.
As most of you know, WPTavern is using a child theme of the Hybrid Framework called Hybrid News. Once I get a few kinks straightened out, I’ll be upgrading to the latest and greatest version of Hybrid.
By Jeffro on June 12, 2009
Time to get back on the bandwagon and get the listener poll on track. This was supposed to be the poll a few weeks ago but thanks to my new system of including the poll inside the post, I’ve been forgetting. Alas, here is this weeks poll question submitted by The WordPress Kid.
Are You Aware What A Child Theme Is And How It Functions?
- Yes (83%, 33 Votes)
- No (17%, 7 Votes)
Total Voters: 40
By Jeffro on May 26, 2009
As most of you are aware, I ended up choosing to edit a child theme of the Theme Hybrid framework called Hybrid News. Out of the gate, using a child theme that is built on top of a framework certainly has a learning curve. For instance, if I installed a plugin where the directions told me to place a line of code in a certain theme template file, I couldn’t do that in this child theme since it’s primary purpose is to be compiled mostly of CSS without touching the core of the framework which holds the theme together.
Instead, it’s up to me to figure out how to add that plugins code to my child themes functions.php file. Something which requires I as an end user to know about filters, hooks, or other weird developing terms. In this instance, I believe child themes have raised the technical bar. I know if I put in a support query, Justin will be right there to answer it but I feel like a loony for having to rely on support in order to accomplish something which was easy before hand. I know some would argue that functions of a plugin should be added to a custom functions.php anyway to prevent it disappearing if a theme upgrade were to occur.
Other than this hurdle, I don’t have much to complain about. The experience has gone over rather well and it was nice to just edit the CSS of a theme for once without having to edit 5 separate template pages.
So should their be an easier way to customize where and when a plugins output will show up in a theme by implementing an interface of sorts for these plugin functions or should I just buckle down and learn a thing or two regarding functions.php, hooks, filters, and those other funky terms?
By Jeffro on May 7, 2009
Thematic is a free, open-source, highly extensible, search-engine optimize WordPress Theme Framework featuring 13 widget-ready areas, grid-based layout samples and styling for popular plugins.
Thematic is an easy to modify theme or a good way to create a new look for a theme, because there is no need to develop a theme from the ground up and it’s very easy to upgrade. Why?
You only need to add a child theme with your own CSS, when it is upgraded you only need to tweak it.
It’s very easy, just download it from Theme Shaper (Ian Stewart’s site-the creator of Thematic), unzip it and then upload the thematic folder to the WordPress themes folder, wp-content/themes.
You don’t need to activate Thematic, because we are going to create a child theme. But if you’re curious about Thematic itself, you can activate it with an old-school way. Go to Appearance screen, activate the thematic theme.
A Child Theme
This is the fun stuff. Thematic includes a folder named thematic-sample-child-theme. Move the folder outside of the thematic folder, put it on the same level with the thematic folder in wp-content/themes. WordPress child themes are located in /wp-content/themes/ like any other WordPress Theme, then name thematic-sample-child-theme to whatever you want it to be.
Let see how the child theme is structured. There are two essential files for Thematic, just open thematic-sample-child-theme, functions.php where you place functions code to modify how thematic interprets data from WordPress. For example, remove thematic built-in title.
Another is style.css where you put css code to change how thematic looks. You can add images folder for any images on your site like header or logo.
Working with Thematic
I would suggest a few tools for creating a Thematic child theme. Those are Mozilla Firefox with Firebug installed and Text Editor like TextMate (for Mac Users) or Notepad++ (for Windows Users). What I really like from thematic is that there are so many built in features on Thematic, you only need to add features you want to add, that’s why we use Firefox and Text Editor. Theming WordPress has never been this easy, right?
Now, edit style.css – use your text editor, add the theme details
If you see style.css, there’s 1 particular line:
It means that we use thematic as a theme base
Now, we look at our child theme. Activate your child theme, see that your child theme is exactly like Thematic.
It’s time to change the look of child theme to whatever we want. Open Firefox, then firebug.
We use firebug to track css so we can override thematic default css from the child theme’s style.css to fit your requirements.
Now that know a little bit about thematic, here’s some further reading to improve your child theme.