Merry Christmas to me, I got a new theme. This blog theme is a modified version of “Meta-Morphosis” from Woo Themes. They make some wicked themes and most will cost you, but they are worth it. They also make a few for free. The great part is the free ones are very feature rich. In fact, there are several options with this theme that I’m not using just yet, but will be.
You can see the finished product, but what did I have to work with? Well here is a screen shot from the theme demo over at Woo Themes.
As you can see I made several small changes to the overall look. As part of my Christmas present for you I want to tell you about how to make this easy.
First, a theme like this is pretty customizable out of the box, but it needs a few tweaks to make it mine. Graphics can be done in a few different programs. If you have the money and want to learn how to use them properly, get Adobe products like Photoshop. If you are flat broke, like me, then try out some open source stuff like “Gimp” for free. This is a great program that only gets more powerful with additional free plug-ins. If you are going to get serious about modifying themes to fit your site you have to have some kind of real graphic program.
Now either you have made some graphic changes, or had someone do it for you but now you need to edit the CSS to make things look right after all, not everything is done with graphics, much of the website is code. The absolute must have tool for this is FireBug for FireFox. Seriously, if you work on webpages and don’t use this then you are making life so much harder than it needs to be. Firebug not only shows the code each element of a page uses, it also shows layouts, css, and dependencies so complex pages will make sense. Code is “nested” so you can quickly scan through containers, and best of all you can edit the page live so you will know exactly how those changes affect the end product. The changes aren’t saved to the server though so make sure you keep notes on what you are doing so the changes can be made permanent. My only complaint is that the program isn’t on other browser platforms so you still have to open them up after you make changes to make sure things look good across the board.
Anyways, I just let everyone in on the secret to my web-fu. Now that the mystery is gone why don’t you tell me what you think about the site. Is there anything I need to fix still?
Happy Star Wars Day
Thunder is awesome
Punched Before Eating
Two things I love
Looks nice Nick! I love WooThemes, they’re the best in the business hands down. And your tip about FireBug is great too, it totally changed my life. I’m just a theme hacker, wish I had the brains to do it from scratch, but with these two resources, you don’t really need to do that anymore. No point reinventing the wheel.
What’s the little social networking plugin you’re using on the side?
Looks great!
Thanks, yeah I’ve looked at WooThemes before but never noticed the free ones. Moding an existing theme is easier and since I’m still learning how WordPress works I like seeing how themes are setup. I am still working on my own theme. I have the basic structure but I want access to some of the more advanced features of WP, so I’m having to study a lot more themes and the WP codex. There is a lot more to it than the appearance.
The plugin on the left is Cute Profiles. Peter had it on his blog and I’ve moded it a bit more so it feel like quick silver when the icons increase in size.
Like the new look! And the social media sharing pop-ups under the post is sweet (ditto with the ones on the side).
PS: did you drop intense-debate? or will you attempt to integrate it into the new theme (scary I’m sure – I’m not a CSS buff)
I prefer Intense Debate and I’m working to figure out what is happening with it. Basically there is a glitch with ID where it causes the media menu under the post and the slider under the post to not work correctly. It has something to do with the java script not the CSS. I’m trying to figure out why the glitch happens now, but it didn’t when I had my previous theme and the social media plugin.
I’ve found that other bits of Java seem to break the site so I need to hunt down the culprit in the new theme and fix that. I really like the slider so I don’t want to ditch it, but I might need to try and recreate it differently … possibly using CSS, it can be done but it is tricky.