R.E.M. Tour Website Case Study

A little bit of foresight and planning went a long way in the creation of the new tour website for rock legends R.E.M. I'd like to take a moment to share with everyone the approach we took in creating the RSS powered social media website that centralizes concert media from various sources across the web.

Website: http://tour.remhq.com

Site Architecture

Taxonomy

At the most basic level the site utilizes taxonomy as a way to categorize content (esp. media) by tour date. Using a taxonomy centric approach was not only semantic but allowed us to use the power and interactivity of other modules to make for an easy to manage and easy navigate website.

Content Construction Kit and Emfield

Using CCK and Emfield we created new content types for each type of data: video, photo, blog, twitter. The video content type had an embedded video field and the photo content type had embedded photo field. The blog and twitter content types used the body as their way to store the important feed data. The creation of different content types was an essential step in allowing us to filter the types of content easily using views, as well as providing an easy way to theme each content type.

FeedAPI

The FeedAPI is the core of the website, pulling in data and creating new nodes from data found in the RSS feeds. Using the FeedAPI module we created a new feed node for each web service (youtube, flickr, technorati, twitter) and concert date (each date has its own unique tag to distinguish the events). If you are not familiar with this module it allows you to specify which content type to use when creating new child nodes from the feed data (now you see the importance of the step above).

FeedAPI Mapper

Using FeedAPI Mapper we were able to take specific parts of data from each feed and map it to the fields of our content type. This means that with our video feeds, we could map the video url from the RSS feed to the embedded video field of our video content type.

Views and Views Panes

Throughout the site you will notice many blocks of media, these are all just different implementations of four basic views. Each view merely filters out the content to be only nodes that are published and of the particular content type: video, photo, twitter, blog. Additionally each blog has a single argument, a taxonomy term argument that allows us to specify which tour date we want to browse through. By setting the argument default to 'display all values' instead of 'return page not found' we were able to recycle the views and use them on the homepage to display most recent content (each view has a sort by node created time descending as well).

Utilizing the views panes module (packaged with Panels 2) we were able to expose our views to the panels module and link our views arguments to a panel context (discussed below).

Panels

Using the panels 2 module we were able to override the display of the standard taxonomy/term/term-id pages (as well as pathauto to give us paths like this http://tour.remhq.com/tour-date/may-24th-the-gorge-washington). To do this we created a new Panel Page with the url of (taxonomy/term/%), in the context settings I created a new argument context for the term id. Using this context allowed us to filter all of the views content on that page to be for only a particular concert date.

Also note that when adding the argument context we set the title value to "%term" which overrode the page title with the taxonomy term name.

You'll also note that we created a new homepage using the panels module as well, only there are no contexts because we wanted the views to 'display all values' as mentioned above.

Module List

Core Modules:

• Comment
• Path
• Taxonomy

Contributed Modules:

• FeedAPI (5.x-1.2)
• FeedAPI Mapper (5.x-1.x-beta6)
• Emfield (5.x-1.2)
• Panels (5.x-2-beta3)
• Views (5.x-1.x)
• Taxonomy Context (5.x-1.0)
• Mollom (5.x-1.3)
• Captcha (5.x-3.1)
• Pathauto (5.x-2.x)
• Token (5.x-1.x)

Custom Taxonomy Mapping Module:
There was one thing that I needed done in order to tie the whole taxonomy term as concert date approach together, and that was to make it so that the new nodes that the feedapi node created were categorized under the same taxonomy term as the parent feedapi node. This made it so that for each tour date we could have any number of feed nodes associated with it, subsequently all nodes created by parent feed nodes would be tagged with the proper taxonomy term (concert date).

The code below is what accomplishes this:

I created this snippet in a custom module that I named "feedapi_taxonomy", a package of the module is attached for those whom wish to use it for their own projects.

Theme

The theme used on the site is none other than a very slightly modified version of the Grid Inspired theme. It is very simple and provides an easy interface for users to navigate.

Some of the specific changes to the theme include adding padding for paragraph tags, removing the $links variable from node.tpl.php and adding a new banner across the top of the page in page.tpl.php.

Documentation and Resources

Recently there have been some screen casts and documentation that cover the use of the Feed API module and Panels 2, below are some of those resources.

• Embedded Video feeds.
• Development Seed Online Video Screencasts
• BoldSource LADrupal Panels Presentation Notes

Recognition and Thanks

This project was commissioned by Warner Bros Records; their ideas, funds and collaboration are what drove the project to completion. Thanks also to those module developers/maintainers who have put together and maintained quality contributed modules which power the website.