A Highly Functional Portfolio Site
December 21st, 2012 by Gage Pacifera
I worked with Mambo Media to create a new website for local company Cascade Coil. Per our usual arrangement, Mambo provided the design and I did the coding. The site has quite a bit of functionality to it.. I’ll break down the various parts in the sections below.
Category-Style Navigation
The navigation for this site required something more than just the standard WordPress navigation options. Each of the portfolio items needed to be tagged and filed into multiple categories. For example, an item might be tagged with the location type “Government” and also might be tagged with application type “Window Treatment”. The user should be able to find the exact same portfolio item page in both of those categories. We could have accomplished this by manually putting those items into an appropriate menu structure, but with 100+ items currently on the site and with more coming, this would have been very tedious.
Instead we opted to use WordPress’ custom taxonomy functionality to dynamically populate those menus. This way, the client could enter a portfolio item and check off the various categories it fits into (or add new ones) and the menus dynamically update. The client designates a thumbnail image for each item and each category so the user sees a nice list of images to click on to drill down to the bottom item. So for example, the client might enter a portfolio item and check off “Safety and Blast Mitigation” in the Product Line taxonomy, “Government” in the Location Type taxonomy, and “Window Treatment” in the Application Type taxonomy. This results in a very easy method of entering the portfolio items and a rich, dynamic portfolio navigation structure.
Search by Taxonomy Term
The client decided it would be worthwhile to put an Advanced Search option on the site which would allow the user to search on portfolio item tags (well, terms, technically). So, for example, you could search for all items tagged with “Government” or with “Window Treatment”. That search could be inclusive (include results containing either) or exclusive (include only results with both).
The results of my efforts were successful. The user can check off checkboxes generated dynamically by the taxonomies, hit search and see a listing of all portfolio items that match the criteria. This functionality is really powerful and I hope to be able to use it in other projects.
User Registration
Users can register on the site by clicking a Join Now button and filling out a form. In addition to collecting some data related to their company and interests, the user picks a role such as Dealer or Distributor. The adminstrators on the site get an email notification when this happens, receive a link to view the submitted information, then choose to approve or not approve them. Once approved, the newly registered users can log on to the site and see restricted content. All of these users are managed in the Users section of the WordPress interface.
This functionality was made possible by the User Meta Pro plugin. It worked out pretty well for this site. I’ll review that plugin and the similar WP-Members plugin in another post.
Store Locator
I ended up using a plugin called Google Maps via Store Locator Plus to embed a store locator on the site. It works pretty well: entering store locations is fairly easy, there are some useful configuration options and the user interface is pretty decent. The most interesting part for me, though, is that the plugin author clued me in on a way to tap into the return results event to trigger a javascript action based on number of results returned. For example, if zero events are returned, you will get a different alert message above than if multiple events are returned. I would probably use this plugin again for future store locator needs, partly based on the responsiveness of the developer who currently maintains it.
Shopify Store
I created a simple custom shopify template that reflected the look and feel of the main site. The store (as of this post) has three categories of products with multiple products in each category. I had to do implement some special template code to allow for multiple variations on certain products that wouldn’t have been manageable within the normal Shopify interface. This was my first experience with Shopify and I was largely happy with its ease of use and range of functionality.. I would definitely recommend it to other clients and developers.
Other Features
There were lots of other features including carousel banner, thumbnail image gallery on the individual portfolio pages, social media integration (linkedin, pinterest, twitter), multiple contact forms, page-specific featured images, hide/show more text for glossary pages, video embeds (youtube), blog and web analytics, but the ones mentioned above I think stood out as the most interesting and important on this site.