Thematic 0.7 has been officially released with two major upgrades that’ll help you get what you need done with your WordPress blog or site faster and easier.
Rapid Site Development With Modular CSS
I’m doing my best to make Thematic a tool for rapid site development whether you’re digging into it and using it as the basis for a custom site design or using it as a theme framework with a WordPress Child Theme. How? By making the CSS completely modular. Let’s take a look at two of the folders in the
library directory of Thematic; layouts and styles.
/layouts 2c-l-fixed.css 3c-r-fixed.css 2c-r-fixed.css 3c-fixed.css /styles 18px.css typography.css 21px.css default.css images.css plugins.css reset.css
Each of these files can be imported into the stylesheet of either your Thematic-based theme or Child Theme with the
@import rule—or copy-pasted if you want to make changes without having to override the CSS to make structural changes. Simply put, what that means is that you can bring each of these files into play in your stylesheet and rapidly build a WordPress theme by mixing and matching them. And I mean really rapidly. For example, here’s an example of a fully finished 3 column Thematic Child Theme, with a sidebar on either side of the content, that follows the default Thematic color styles—built by you, out of only a few lines of CSS.
/* Theme Name: Thematic, 3-column Theme URI: https://themeshaper.com/ Description: A 3-column version of Thematic Author: Ian Stewart Author URI: https://themeshaper.com/ Template: thematic Version: 1.0 */ /* Reset browser defaults */ @import url('../thematic/library/styles/reset.css'); /* Apply basic typography styles */ @import url('../thematic/library/styles/typography.css'); /* Apply a basic 3 column layout */ @import url('../thematic/library/layouts/3c-fixed.css'); /* Apply the default Thematic style */ @import url('../thematic/library/styles/default.css'); /* Apply basic image styles */ @import url('../thematic/library/styles/images.css'); /* Apply styles for popular plugins */ @import url('../thematic/library/styles/plugins.css');
That’s really all there is to it. And if you’re modifying Thematic instead of building a Child Theme, just take a look at the style.css included with it and start mixing and matching CSS files. It’s that easy.
But what if you want more of a blank template with just enough styles to build a WordPress theme from? I’ve got you covered there too with 18px.css and 21px.css. Each has just enough CSS styles to produce a blank theme based on a 18px or 21px line-height. Combine them with any of the layout styles included with Thematic—just like in the simple example above, using 18px or 21px instead of default—and you’ve saved yourself potentially hours of time.
Essentially, I’ve done all the boring CSS work that’s required to build 99% of all the WordPress themes you’ll ever see. You’re welcome. 😉
And yes, now that there’s a default there might be more included styles in the future.
A Guide To Developing With Thematic
One thing that’s really been lacking with Thematic, and really should be included with all good WordPress themes, is a good ReadMe file. That’s been fixed with version 0.7. I’ve made it an xHTML file instead of the typical text file so you can check it out in your browser.
I’ll be adding a table of contents to it in the future as it inevitably grows. Which should be very soon since it’s already out of date! I completely forgot to update the list of Thematic Child Themes before I submitted it to the WordPress Themes directory. I’ll be fixing that in an update which should come in the next couple of weeks.
Download Thematic and Build Your Own WordPress Theme
Thematic is completely free and available for download at the Thematic WordPress Theme Framework page.
18 thoughts on “What’s new in Thematic 0.7”
hi Ian… simply awesome ! I’m running Thematic locally and just installed version 0.7, everything went as smooth as warm butter.
I’m designing a child theme for my new blog/site and the Thematic framework is an absolute dream to work with. I’ll post a link when my new site goes live but this has seriously cut way down on development/design time.
I’m still very new to the concept of child themes but now that I’ve played around with it, I can’t imagine designing WP blogs any other way. Thanks so much!
Thanks Ian, but now I am going to lose 20 hours this week playing with it and either changing one of my blogs or creating a new one so thanks a lot :).
I’ll check back with what will be a new child theme I hope which I have been looking to develop. I have already created a few with Justin Tadlocks Options and Structure and really love this “new” way and appreciate the efforts of both you guys for leading all us newbies towards this concept which makes perfect sense in all respects.
It would be great if the WP theme directory could include child themes submitted under its parent theme. I think Matt said at Wordcamp NYC that it doesn’t seem to be something they are looking to do?
Great job and can’t wait to explore the new version sounds very exciting.
Glad to hear Thematic is helping people get things done!
I’ll have to watch the video. I’ve been told that Child Themes in the theme directory are on the official to-do list. I can’t see why they wouldn’t be there.
okay, you are now really putting my lack of knowledge / ease of child themes to the test. I’ve done what for me is a lot of modification but (after creating backups) will upgrade this weekend. What steps do I need to take? I’ve done plenty of reading so feel free to refer me to another post if it’s already spelled out.
which by the way, I have created a very cool child theme with zero knowledge of site design / programming / code whatever it is that you guys do so well and that has been possible because of your VERY informative posts, thank you. it feels great to have what I want (I’m rather particular 😉
If your modifications were done in a Child Theme all you have to do is … upload the new version of Thematic. That’s it.
I find this development really interesting. I like the idea of an importable stylesheet for basic layout, a different one for typography, one for site specific stuff and the like.
That’s an idea I’ll have to think about using in the future.
and aside from a few of the functions that I put into the first one it is perfect! thank you! sorry, a little excited over here
WOW IAN. I didn’t think there would be much more room for improvement considering how great Thematic already is, but you have definitely proved me wrong. *Downloads Thematic and updates about 3 sites, without a single headache*
I haven’t started playing with 0.7 just yet but in the future will there be any ‘pluggable’ styles that tackle colors/background images/borders specifically? With 0.6 it was a bit tough/time consuming to figure which color styles to override using the child theme’s css. So, I started building a mod to Thematic(0.6) that stripped out the default colors, borders and backgrounds, so that I could start with a clean slate(ie: Sandbox). That way I could use the child theme to add the color, border and background styles. 0.7 may do the trick, but I thought I’de ask anyway.
Great work as usual. KEEP IT COMING!
Thanks, Allan. I think you get what you’re looking for with this version: just don’t use default.css. Use one of the simpler stylesheets instead.
Ahh ok makes sense.
*Installs Thematic locally for testing.*
Wow, just finally wrapped my head around this. To think I’ve been copying thematic and renaming it to test variations of themes lol. I think this might help just a bit. Nicely written too. Thanks for your work bro.
Great Framework but IE6.0 seems to spit out the 3 column version
Way too many css files is not cool, I prefer to separate in that way:
generic.css (stuff like module grids, reset, generic classes etc; it goes first so it not distracting in Firebug)
enchanced.css (webkit and mozilla stuff like animation and transitions; @media queries)
page_name-of-page.css (if some blog post has completely unique design)
Comments are closed.