Othello is a completely free, out-of-the-box solution for wordpress and is perfect for entry level users. That’s not to say it’s basic however, in-fact it’s far from it.

Othello boasts advanced css3 webkit/mozilla features, wordpress widget support, banner advertising space, basic SEO optimisation & a simple set up process.

Technical features

• For WordPress 2.7.1 and above
• WordPress widget enabled
• Default widgets pre-styled (excluding the calendar widget) for fast set-up
• Based on the 960 grid system but written in em’s for better accessibility
• Written in valid xhtml strict and styled using css2/3
• Advanced webkit and mozilla features including animated transitions, rounded corners, opacity and rgba colours
• Semantically structured with basic SEO requirements met
• Latest versions of Safari, Firefox, Chrome, Opera, & Internet Explorer are supported
• Internet Explorer 6 is supported in a visually limited, but still usable fashion.
• Basic accessibility requirements met and in most places exceeded
• Plays well with plugins
• Released for free under creative commons license, share and share alike.

Setting it up

Othello is built to work almost straight out of the box, however there are still a few steps to undertake to get it up and running.

1. Open up the header.php file and add your own 468×60 banner. Save
2. Replace the default logo (logo-simple.gif) in the /img/ folder with your logo.  Save.
3. Upload the Othello theme folder to wp-content/themes.
4. Upload the included plugins to wp-content/plugins.
5. Login to wordpress and activate the theme.
6. Activate the required plugins.
7. Open settings and select Similar Posts.
8. Set your preferences, 3 posts works well. All other defaults can stay as they are.
9. If you haven’t already, activate your widgets.
10. Get adding content, you’re ready to go.

You can Download Othello now from this page >>

{Below are some previews from Othello Version 1}

Logo and newest post listing

Sidebar widgets

Footer with meta content

Comment levels

Easy to alternate backgrounds

The winners are

1. Al Garnsworthy
2. Matt Jukes
3. Stuart Connellan

Congratulations guys, I’ll be in touch with your winnings shortly, thanks once again.

If you’re reading this please add a comment with a valid email address to this post (below) so I can send you a copy of the theme. Also, as promised, if you’d like me to add your logo into your copy of the theme for you please let me know (and also tell me where I can find a copy of it).

Thank you once again

So what was the problem?

By default wordpress adds in several extra lines of code for using things like Really Simle Discovery, Windows Live Writer and the wordpress version. Thats all fine and dandy if you use those tools or want your wordpress version on display (which to me is a bit of a security risk anyway), but want if you don’t? Functions.php to the rescue then.

In essence, the functions.php file acts a bit like a plugin; you might have had a play around with it if you’ve ever set-up a wordpress blog that uses widgets. We can use this file to change what wordpress outputs into the wp_head tag.

Here’s how

If you want to remove anything from the wordpress head you need to write in the following format between php tags as below:

<?php remove_action('wp_head', 'title of what needs removing'); ?>

So to remove the Really Simple Discovery Code add:

<?php remove_action('wp_head', 'rsd_link'); ?>

To remove the Windows Live Writer add:

<?php remove_action('wp_head', 'wlwmanifest_link'); ?>

And to remove the wordpress version add:

<?php remove_action('wp_head', 'wp_generator'); ?>

Of coure if you want to add more than one you can always put as many as you need between on set of < ?php?> tags.

Happy blogging

Now I’ve been through the validation process with most of our sites as I feel it’s important to get your code as valid as possible. However, I also feel there’s a limit to what you can do sometimes, and it’s usually due to some third party.

Problem 1

Third-party plugins and widgets such as twitter can screw up your validation

I found this problem via validation and it was fairly easy to fix. Because twitter wasn’t printing the code to the page using the recommended unordered list snippet, and hence it wasn’t validating as there were no child tags. I got round this by making a copy of the javascript file and putting the unordered list tags in there.

Problem 2

If your wordpress site uses lots of plugins there’s a chance they will invalidate your site

I don’t want to point any fingers here as I love the fact there are amazing plugins out there for free. However, some will invalidate your code. I’m not a php guy so I don’t really like picking stuff apart too much so I have to live with this problem.

Problem 3

Sites developed that put the user’s content at the core often result in invalid code.

I think this is a real sticking point. If you’re aggregating a lot of user provided content (i.e forum, blog feeds) valid code is not really in your control. If user’s are in control of what html they can add then it’s fair to say the code probably won’t ever be 100% valid.

So what does that mean for code validation?

I think it’s important to get your own code validating. Make sure that what you write is solid and if you’re like me and you use third party plugins, try and choose up-to-date ones or adapt them if you know how.

Validation is important, but what’s more important is that your site is usable, structured and well thought out. Lets face it, most users won’t be checking your xhtml/css validation.

P.S – This site validates in most places. The css has elements of webkit within it so doesn’t validate right now!