SportBusiness.com relaunch

SportBusiness Group is the world's leading supplier of information, media and B2B marketing services to the sports industry and, with its network of partners and agents, assists companies from all over the globe in achieving their business goals.

The latest incarnation (site version 11, 3rd Drupal version) of the Sportbusiness.com website has finally brought us into the world of Drupal 6. We initially moved the site over to Drupal almost 3 years ago (back in the Drupal 4.7 days) after months of data conversion from a proprietry Oracle-based CMS. We've never looked back. The upgrade to Drupal 6 has just finished; the site has been redesigned and several major changes have been implemented.

Getting up to 10,000 page impressions a day certainly doesn't make this a high-traffic site by comparison to some of the other sites we have at Electric Word plc (parent company to SportBusiness), but the visitors to the site demand equally high levels of quality and content. This was something we had to maintain from previous releases.

Challenges

One of the things I wanted to improve with this version of SportBusiness.com was to minimize the number of custom modules. This should hopefully smooth out the path for upgrading in the future. By using more contributed modules and trying to keep things simple we have reduced the amount of custom code by nearly 90%.

The structure of the site has been tidied up too (and is still in the process of being tidied). This has allowed us to make much better use of Panels, Views, Pathauto & CCK than we had before. It also makes it a lot easier to configure relevant blocks by path.

Design

I decided very early on to use the JQuery UI Themeroller for the site. This provided us with a very useful set of base classes for the look and feel of the site. On top of this, we decided to use 960.gs for the structure of the page. Between these two frameworks, the design of the site became very easy; particularly when using Drupal 6's revised theme engine.

The JQuery UI Themeroller is a very handy tool which allows real-time generation of a style "wrapper" around the JQueryUI tools such as datepickers, accordions, dialogues and tabs. Once you have configured your own settings (or modified one of the presets), you hit the download button. This gives you a CSS file which, in our case, we include at the theme level. The next step is to decide where you would like to use the elements from the Themeroller. Once you have overriden the appropriate theme functions and files, you simply add in some CSS classes such as ui-widget-content or ui-widget-header. For our theme, the main files/functions to override were the page, node, block, panels & panes, local menu tasks (eg, the view & edit node tabs) and a few other smaller ones. The result is a site which has a consistent look & feel. It also means that if you suddenly decide you don't like it, you can just generate a new theme at the Themeroller and drop the new CSS file over the old one!

When designing the site, there were several departments that needed to be kept in the loop and therefore several equally important 'purposes' for the site. Sales needed to be consulted to make sure the advertising slots and products were appropriately positioned for maximum revenue generation. Marketing also needed to be consulted when it came to things such as the prominence of lead collection boxes (for example, the "register for updates" box). The design team were involved all the way through, as SportBusiness is very brand-aware and we needed to make sure that the look-and-feel was acceptable. Editorial wanted to make sure that the content they were uploading to the site was both presentable and accessible for their readers without becoming a time-consuming chore. Finally, there was me; The Techie. I needed to make sure the decisions of sales, marketing, design and editorial did not impact negatively on the website's SEO and general usability.

With this many people involved, the project always risked death-by-committee with competing briefs jostling for position, but fortunately I believe all departments managed to get what they wanted from the site and more.

Structure

One of the goals of the relaunch was to clean up the structure. Over the past few years the site has experienced dramatic "organic growth". This has led to inconsistent URLs, poor tagging, mixed site sections and general navigation nightmares. The job is far from finished - but the first (and most drastic) stage has been completed.

Essentially we took a step back and looked at the site, not as it was, but as we wanted to it be - almost from a clean slate point of view. We went through processes of identifying content types and breaking them into sections and thus views and panels, for example the Marketplace section is made up of several node types including People, Organisations and Facts. These are then listed in views (pages and blocks) and the views combined into a panel.

We have also made heavy use of CCK's Node Reference and Node Referrer field types. Everyone knows of Node Reference; it's a very convenient way of marking one node and being related to another. The Node Referrer module is a separate contributed module which provides a "reverse look-up" on a reference producing a very effective two-way link between content.

Structure comes in several forms. We worked hard to create a coherent site in which content is collated in a way users want to read it; however the structure is also compliant with logic and SEO best practice.

By thinking through the site structure clearly, we have prepared the site to manage future development in a manner which will be far less time consuming and less painful. It will now be very easy to re-purpose pieces of content through multiple distribution options, including RSS, Twitter, syndicated content, e-mail, mobile and a subscription or pay-wall option in the future, should this be required.

Hosting

We run all our sites, including www.pponline.co.uk, www.sportsinjurybulletin.com, www.teachingexpertise.com, www.mychild.co.uk and www.tvsportsmarkets.com, on 2 dedicated servers hosted with Rackspace. Rackspace are not the cheapest company in the world, indeed they are often the first to admit it, however after over 3 years of hosting with them we have never had a problem of any great inconvenience or fault. Our two dedicated servers have split roles. One is an Apache 2.2 server with a Dual AMD Opteron 2216 HE Dual Core CPU (so 4 cores in total). The other is a MySQL 5 and Apache Solr server running an Intel Xeon L5335 (2.00GHz) which is a quad-core CPU. Both servers have 4GB RAM.

We had already optimized these two servers using technologies such as XCache for PHP op-code caching and a small amount of variable caching, MySQL Query Caching and so on. We have used Boost on www.pponline.co.uk previously, however we experienced some issues with it regarding authenticated/anonymous users having login problems. For this reason, we have decided that it is not necessary for www.sportbusiness.com.

In the month of July 2009, between all the sites across our servers (the majority of them Drupal 5 & 6), we dealt with around 500Gb of bandwidth, nearly 9 million page impressions and almost 42 million hits and July was a quiet month, previously we have seen 31 million page impressions and 68 million hits!

Modules Used

With around 90 modules enabled on the site, I won't list them all here but the main ones are as follows…

The usual suspects…

• Views 2
• Panels 3
• CCK 2 (along with Date, FileField, ImageField, Email & Link)
• Token

Some less common, but still handy…

• Advanced Poll
• Google Ad Manager (heavily tweaked; patches to be submitted soon)
• Nice Menus
• WebForm
• VotingAPI
• ShareThis
• JQuery Update
• JCarousel
• ImageCache
• Mollom
• NodeQueue
• ImageAPI
• Google Analytics

Some SEO & Usability Modules…

• Global Redirect
• Page Title
• Node Words
• Custom Breadcrumbs
• PathAuto

Some less known, but DAMN handy modules…

• ImageCache Profiles - allows user profile images to be plugged through ImageCache.
• InsertView - provides an input filter for embedding a view directly into content.
• NodeReferrer - provides a "reverse look-up" for Node Reference CCK fields.
• Views Attach - provides a psuedo field which attaches a view to a content type. Handy for an "Other News On This Day" type feature.
• UserQueue (heavily tweaked - some patches already submitted and awaiting review). Ever wanted to create an arbitrary list of users? We did (for the Our Team page). UserQueue is like NodeQueue but for users. The biggest tweak I've submitted is Views 2 integration.
• FancyBox - This mostly worked out of the box. It's basically a very nice Lightbox alternative.
• MimeMail - A module for improving the emails Drupal can send. It also contains a VERY handy module for converting CSS in HTML emails into in-line styles.

Custom Modules

As I said earlier, we reduced the custom modules down by 90% in size (lines of code). So what's left?

• A Worldpay handler - this is for purchasing our reports online.
• A module-less installer - this is simply there as an aid to updates. It means updating/changes to the site can be coded into an update hook and be done in seconds rather risking downtime/oddities in the site during updates.
• Octopus integration - This simple module provides a bridge and local caching mechanism between the site and the Octopus MT video service.
• Mail Exporter - I considered using SimpleNews for this, but it didn't quite fit the bill. Instead, our daily news email is a combination of Mini Panels, Views, MimeMail and the custom module. This custom module helps bind everything together (ie, providing an interface for marketing to pull the daily email HTML out for use in our 3rd party mailing system and passing the HTML output of a Mini Panel into the MimeMail Inline CSS module).
• A custom CCK Field - This was more a proof of concept than anything really - it has allowed us a CCK field which we can embed into node types which links into the Google Ad Manager. More on this later...

Some of the things we're most proud of

From a technical point of view, I'm really proud of:

1. The integration of user profiles into the content. I'm happy with the way the user images appear on news items and in their profile. I particularly like the Our Team page. Views 2 and UserQueue made our lives so much easier!
2. The integration of Google Ad Manager. I was dubious about this at first; my previous experience with Google Ad Manager almost caused my head to explode - it's not exactly what I'd call simple! However, my colleague, Adam Colthorpe (who project managed the new site), worked through the limited documentation and, with some modification to the module which I shall soon provide as a patch, we have a very useful advertising system on the site now which provides several targetable sections. Ad Manager ads can already be targeted by geographic location, time (both local and visitor), browser, OS… On top of this, I have just created the new CCK Ad field onto the site (which I shall, again, provide as a patch to the Ad Manager module). This allows an embedded Ad field which also picks up on the Taxonomy terms of the node. These get passed over to Google Ad Manager as Custom Targeting Keys (vocabs) and values (terms) which then allows the advertiser to target their ads to specific or groups of taxonomy terms.
3. The beginnings of a mobile site. I'm a big fan of the iPhone and have made a start on http://m.sportbusiness.com/ using iWebKit as a base.
4. Integration of the Advanced Poll module & Google Charts API. Combining the results of the two patches I have submitted for AdvPoll (Improved theming & Implementation of CCK hooks for field weighting) we can now output the result of Advanced Polls using the Google Chart API. This produces a very professional looking chart with VERY little effort on our part.

Plans for the future

With the new platform we now have, moving forward should be much easier. A better structure and future business model will open up new streams of revenue and techniques for using the site. We have plans for increasing the use of the meta data around the site to power searches and aggregation of content, both internally and externally.

Screenshots

Obviously the best way to see the site is to go to it, however here are a few screenshots of the site (including an admin page for exporting emails!). Click them to see a larger view.

Frontpage	News Article	Our Team
Video in Fancybox	Marketplace "Hub"	Export email admin page

Footnote

This site was developed in-house at Electric Word PLC by Nicholas Thompson and project managed by Adam Colthorpe. Electric Word PLC is a London based publishing company who also produce many other titles in both online and print forms.