Oil States

Summary

A new website for Oil States and an unusual content structure.

Tools

Built in WordPress CMS. Otherwise everything is custom.

Challenges

There were certain restrictions such as some graphic elements and the content structure. Some of these introduced potential user experience issues that we needed to work through and find solutions to.

Probably the most challenging issue was that the client needed the most of the content to be editable from a single location (referred to as ‘parent pages’), but also wanted multiple ‘version’s of the each ‘page’ throughout the website, with the breadcrumbs and urls showing the pages as actually ‘living’ at that place, not just linked to from a ‘master page’. Also, while they needed reusable content, they requested the ability to have some reusable content on one ‘identical’ page and not on another. This all created quite a conundrum.

Another difficult piece was the home page slider. It needed a full width slider in the background, connected to and moving with a synced slider on top of the content.

Successes

Using flow charts and graphs, I planned out a compromise to provide them as much of what they requested as possible.

To accomplish the reusable content I set up a custom post type with a custom taxonomy.

Then on each individual page I allowed the admin to filter posts from that custom post type by taxonomy term, and then choose which of the posts tagged by that term they wanted to show on that page. The posts were displayed as an accordion.

This left multiple instances of each page with slight variations, requiring more than usual time to edit the non-reusable blocks, but allowing the reusable blocks to be edited in a single location.

To create the home slider I combined two owl carousels and synced them to each other via callback events.

The map I built on this website is one of my favorites to date as I tried a slightly different method from before and it loads faster.

 

Personal Notes

I really enjoyed the way the map turned out.

Credits: This project was done while working for Savage Brands as Lead Web Developer. It was designed by Edmee Micheli.
Visit: http://oilstates.com/