About the new designAugust 25, 2010
The other day I quickly coded a new design for this here website. The idea behind it is simple: provide some base structure, but ultimately let the content drive the design of the site. To share what’s under the hood, I wanted to share a little more about that idea and what’s powering this site.
Form Before Function
That phrase feels like a cop-out, but it sums things up nicely. So far, photos and a few text and code heavy posts are all that’s here. That could easily change and I wanted to remain flexible as to not feel constrained by whatever elaborate design I could come up with.
I don’t know exactly what I want out of this site yet, only that I want to blog, share photos, talk about some code, and share thoughts on links.
Under the Hood
Because it’s what I’m familiar with, I opted to use WordPress once again. Coupled with the awesome plugin support and flexibility of WordPress as a CMS, it was a no-brainer for me. Here’s a look at what I’m using with WordPress to power this site.
Categories, Not Custom Posts
Just a quick note to begin here: WordPress 3.x allows for custom post types. I’ve used them before, but decided to avoid them this time around and instead keep things simple to start. As I said, I want the form of this blog to come as naturally as possible.
To customize how each category’s post shows up, I threw in some conditionals for the loop:
Plugin: WP Tweet Button
To encourage sharing of the articles I (will) write, I’ve added the Twitter Tweet button via this handy plugin. It gives you a few options, including: automagically adding it to posts, custom recommendations per post, and more.
Check it out if you haven’t yet. I did try some other plugins but they all sucked. This one seemed best.
Plugin: Disable WPAutoP
I can’t begin to tell you just how frustrating WordPress’s automatic
p tags are. They wrap anything and everything, which makes for some funky styling if you’re not careful enough (e.g., images get wrapped and can leave funky spacing if floated). Install this bad boy and kiss those rogue
p tags good-bye.
CSS with Less.js
Plus, even though it compiles the CSS in the
head of your page, it stores it in a HTML5 local database. Hot.
Chili: A jQuery Syntax Highlighter
Not sure if there is a better one out there, but it seemed solid to me after a quick tour around Google. I’ve love some suggestions for alternatives; my only complaint is it’s ugly default styling. Will definitely need to dive in and change that up more in the future.
canvas. It’s developed by Dave Shea (@mezzoblue) and is just getting started. Not practical in my implementation, no, but still cool :).
Beanstalk for Low Maintenance SVN
I’m a fan of version control—if by version control you mean just one master branch of all my code so that I can quickly revert my mistakes and checkout new copies should my server get hacked or otherwise fubared. Nice to have and these guys do all the leg work; I just import my base files and they take it from there.
Also, an added bonus of using SVN was the need for using SSH to checkout my code on my server. Handle to know; I need to pick up more stuff like this.
And that’s it! I’ll keep adding features and posting about them as I go though.