3HoursTheme is a free tutorial child theme for Thematic Framework for WordPress.
While you can use it, as is, on your blog, it’s main purpose is to give you an initial track to develop your own child theme.
The 3HoursTheme child theme has been developed using CSS-only code and every CSS rule is commentend for your learning aims. It can be a good starting point for those who want to approach WordPress theme developing from a beginner point of view.
Furthermore CSS code has been in-deep explained in my How to create your own WordPress Theme in just 3 hours tutorial.
How to create your own WordPress Theme in just 3 hours
Part I – Build a child theme based on Thematic Framework Theme
Part II – Style header, footer and posts
Part III – Navigation and widget areas
Part IV – The Superfish Menu
You can find more resources on Thematic Framework developer blog, ThemeShaper. Ian Stewart is writing a more comprehensive tutorial “How To Create a WordPress Theme”
I suggest to my italian readers to take a look at Altamente Decorativo. Daniele is writing here good tutorials on same topic. I guess more are coming in the next future.
Download 3HoursTheme
You can download here the 3HoursTheme.
There is style.css code from the tutorial. I included also the function.php containg my Customizable Menu for Thematic for WordPress and the Fireworks PNG source for the background image.
Feedbacks are always welcomes.
5 Commenti
The download link is broken or the zip file is corrupted. Can you please send the theme to me? Thanks so much!
ALPSaguado, where have you found the corrupted link? By clicking on “You can download here the 3HoursTheme” on this page I’ve been able to download a working zip file.
Matteo,
Love the post, it’s been a lot of help. One question if I could. I can’t seem to find how to change the color of the links within my posts. Also, the link color for “share this”? Not sure if these are two separate issues or not. I used you css as a template and I have been adding an subtracting to make my own. I’ve changed all the hover colors but can can’t figure out how to change these particular link colors.
Thanks
Justin, take a look at “Reset all a:hover colors” and “Use the !important declaration” chapters on part IV of the tutorial. You can set link color by using (for istance):
a {color:#113242 /* deep blue }
but more specific declaration on default.css will reset some link colors. Force all link colors with:a {color:#113242 !important/* links are ALWAYS deep blue*/}
.“Share This” links have a .stbutton class. So you can different style them using a code like this:
a.stbutton {color:#FF0000/* sharethis links are red*/}
. Remember to apply!important
declaration too if you previously applied it to generic links (as I showed above) .Dude, that’s flippin’ phenomenal! Love how you come at teaching it! I’m definitely going to delve into this. Thanks for your work!