I’ve hardly slept over the last week bashing my fingers against my keyboard trying to get this site out as quickly as possible. The site is called fani.am, (That’s Fan i am), which is a 2010 World Cup Accommodation site. This one really challenged me with some of the intricate post associations I had to string together, and with the addition of a couple of extra plugins to add some key features I’m really excited about this one.

Take a quick look Design and I’ll explain a bit about what’s under the hood of this one.

Homepage of the fani.am fan accommodation site

I really enjoyed designing this one and also trying out a few CSS3 features like rounded corners & Text Shadows. IE6 users, there’s a special treat for you as well.

Custom Fields

The most hectic part of this site by far was the wordpress wrangling which takes place in the background. Using loads of WordPress custom fields, some for data and some for associating certain post types like matches, with accommodations and with the teams playing the matches, we were able to weave separate categories of posts into an intuitive mixture of information. Custom field have been managed entirely by the flutter plugin’s write panels, which helped make this site extremely easy for novice user to populate with content.

Fan i am Team Facts sidebar widget

Conditional Statements

Using WordPress conditional statements, as well as some conditional Custom field statements we were able to easily pull the correct set of posts for each team, venue or accommodation. The sidebar also gets populated with related widgets displaying content for each type of page you arrive on.

Associated Matches, accommodations & attractions

Dealing with images

I was a little disappointed about the current state of the built-in WordPress gallery system. You’re still not able to easily pull individual images based on their order in the gallery and can only really pull an entire gallery. The attached image plugin helped pull the first gallery image which was great. Flutter’s image management and upload functionality was ok but could do with the auto generation of thumbs & other sizes which the built in WordPress image uploading performs. Flutter’s image crop & resize functionality just doesn’t work at the moment, though the rest of it’s functionality, mainly write panels played a hige role in this website’s configuration.

This site relies heavily on plugins for various features, which is one of the great things about WordPress. I know some geeky developers who swear they never use plugins, and that’s fine with me, though I or one love the fact that so much freely available functionality is just lying around ready to take advantage of.

Plugins I’ve used & abused Include:

• Flutter – custom write panels
• Live Coundown Timer – counting down time to the Kickoff
• My Favourite Posts – allows user to add their favourite accommodations to a sidebar bucket
• Send to a Friend
• Tweet News – Footer feed of tweets about FIFA
• Google News – feed of news about the world cup from google
• Twitter Widget Pro – Worked better than Twitter Tools
• IE PNG fix – no need to fiddle with code
• Sidebar Login – check the login panel top right
• Cforms II – contact & booking forms
• DISQUS – Advanced commenting system
• WP Table Reloaded – Check the Match Schedule (quick & easy manageable tables)

So far it’s been a really great project and Phase 2 promises to include some even more exciting social media additions. What do you think of this one?