Requirements
One of the requirements up front was for the site to continue to operate with WordPress as its engine. WordPress is a popular content management system and, although originally designed for bloggers, it can be used for any type of site. The benefits to the continued use of WordPress for this project included: first, not having to worry about a potentially different URL structure by switching to another CMS, and second, WordPress, with the help of a couple of plugins, is really SEO-friendly without having to do much tweaking.
There was only one other requirement. The writer, familiar with WordPress but not a web developer, had to be able to do everything from the simple WordPress administration panel.
The Design Process
Razorlight Media was given two potential logos for the site that had already been designed by another firm and had to build the mockups around one of those two logos.
We played around with different design possibilities for a few hours and finally settled on which logo to use. We created two different homepage mockups around the chosen logo to act as two different design directions for the client to choose from. Park City, Utah is all about nature and being out in the crisp mountain air and so we thought it was important to incorporate as much of that in the feel of the site is possible. That’s why we chose the earthy-tone color scheme and why we went with the huge masthead image of the snow skier on the homepage.
The client ended up choosing the first design as a site theme and the remainder of the page mockups were created in Photoshop along those same lines. After each was approved by the client the process of converting them to XHTML web pages began.
The Development Process
We had to solve a couple problems out of the gate with this project. First of all, WordPress wasn’t designed to be used as a general-purpose CMS. It’s really meant for blogging, however, the client’s experience with WordPress meant we would have to do it anyway.
The WordPress Loop
WordPress’ core display area is driven by “the loop,” which is meant to be used to loop through and display all the posts on a blog. Since this site wasn’t going to be a blog, we had to utilize a number of different loops to create each of the content areas on any given page.
The homepage actually consists of five separate loops: the first three are for each one of the 3 drop down menu sections, Sleep, Eat and Fun. The fourth loop displays the three listings in the Featured Condos sidebar. And the fifth loop displays the two featured listings beneath the welcome text.
Other places you’ll see the loop in action are the more photos section of the individual listings (with more than one photo) and in the footer links on individual listing pages linking similar pages together for SEO purposes.
The Drop Down Menus
The drop down navigation is built by looping through each of the top-level categories (Sleep, Eat, Fun) and then, looping through any nested child-categories within those and displaying any listings that were found as list items in the menu structure. The main challenge here was that WordPress doesn’t have a simple function for looping through categories and their contents in this way, so we had to write some custom functions to pull this information from the system the way we needed it.
The great thing about this menu structure is that it’s really fool-proof. Under the Sleep menu for instance, there’s a child category called “Condos”, and a grandchild called “Featured Condos.” The client can add a listing to any one of these categories and the listing will appear the the correct place in the drop down menu. Also, the client can move, add and delete categories and the menu structure updates automatically. It’s a really simple system based entirely off of WordPress’ category hierarchy, plus a few custom functions.
Additional Listing Photos
Each listing automatically pulls the first photo to be used as the large header for that listing. The client has the option to upload more photos to any listing and those photos will automatically be added to the right sidebar under “more photos” as seen here: http://www.parkcitycondolodging.com/eat/featured-restaurants/featured-restaurant-1/ .
Also, the client can crop and resize any of the photos once uploaded, saving the need to buy expensive photo-editing software.
Finishing touches
Finally, we created winter and summer versions of the right sidebar advertisement to attract vacationers during any season.
