Blog look different? At first glance, not by much, but I’ve just completed a massive cleanup of the back-end, replacing the old HTML/CSS with the 960 Grid System, starting with the 960bc (blank canvas) WordPress theme. While I was at it, took the opportunity to search/replace out a bunch of old non-semantic code buried in the posts, updated or replaced a lot of plugins, and killed off a few old features that had out-lived their usefulness.
The biggest news: After years of preaching the HTML validation gospel to students, I still hadn’t gotten around to trying to make my own platform validate… but the Foobar Blog finally does! Well, almost. There will always be 3rd party code outside your control that can’t be hammered into shape. The biggest offenders here are embedded Flickr slideshows and WordPress’ own embedded Gallery feature. Ugh. But aside from that, we’re pretty darn close to clean. Everything I can control validates at least.
The old design had accreted slowly over the years, from a patchwork of parts built and gathered. Original intention was to go for a clean break and adopt a modern 3rd-party theme, but the more I searched, the more I felt like I loved the “Cheap Thrills” design that’s evolved here (not available for download, sorry). So I decided to port Cheap Thrills to 960. It wasn’t all roses, since the divs in this theme hug each other so tightly, while 960 assumes margins everywhere. A lot of fiddling with negative margins, and I haven’t solved the equal height divs problem quite yet. Will do soon.
New in this pimplementation:
- Much wider content area. Goal is to be able to show full-width video and slideshows, plus code samples that don’t fold to the next line or stretch out of the content space.
- Syntax highlighting for code samples (example)
- Tag cloud (see sidebar) – I’ve been tagging random articles for a long time but didn’t want to display a cloud until there were enough of them to warrant it. Still haven’t gone through and tagged the entire site history, but the cloud is picking up steam.
- General cleanup. Cruft removal. So. Much. Cruft.
- Somewhat wider sidebar – more room for Image from Nowhere and Recent Comments. Some of the old Images from Nowhere look a bit stretched but future ones will be generated larger.
- Replaced my old handmade RSS-based Twitter integration with Twitter for WordPress. Super clean – much better for DIY theme builders than the usual TwitterTools.
- The old Democracy plugin for polling appears to have been abandoned. Replaced it with the much cleaner WP-Polls, which also meant manually copying all of the old Poll data into the new system (ugh!). See the Pollster section.
- Replaced the old contact form in the shacker contacter with the much simpler Contact Form 7.
- Nips and tucks galore.
Process took way longer than expected of course – everything does – but these things had been gnawing away at me for a long time now. Feels great to have it all done. Haven’t done any cross-browser testing yet – let me know if something doesn’t look right for you.
Can’t say enough good things about 960 Grid. We’ve standardized on it at work, and it really does make life easier. Not without its warts, but much more pleasant than the YUI grid it replaces.
Looks good! Even under windoze. Although very funny that your comment systems doesn’t like brief comments.
Thanks for the Windows report – just what I needed. Too-short comments look like spam… :(
Hey Scot, what plugin are you using for the syntax highlighting? And what theme/stylesheet for the highlighting? I’m doing my own remake (on the Aldosoft site that has languished for years), and wider content areas with syntax highlighting for code samples is one of my high priority goals.
Hey Michael – I’m using WP-Syntax with its default stylesheet. You just tell it what language you’re using as an attribute on the pre tag and it does the rest. Effortless!
Just relaunched aldosoft.com, like you, I had been neglecting it, in my case shamefully. I ended up using WP-Syntax also, but I looked at a lot of other syntax highlighting options. WP-Codebox is similar, and has more features, but the code is not as clean and clear. Syntax Highlighter Evolved is an unofficial Automattic release, it’s basically the code in use on wordpress.com. It’s beautifully written, the best of those built on the JavaScript-based highlighter by Alex Gorbatchev, but JS-based highlighting has some usability issues. More importantly, I didn’t like any of the themes. ;-)
Cheers, and thanks for the pointer!
Thanks for the roundup Michael – you did way more research than I did (I just installed the first one I found, was happy with it, and moved on). Aldosoft.com looks great!
Hey Scot, glad you got some good use out of my 960bc theme for WordPress.
Enjoy!
Hey Troy – Thanks so much for the 960 baseline theme for WP! It rocks.