Case Study: African Cartel & WooCommerce

This is a follow-up case study post to «African Cartel – a Listings implementation case study«.

8 months ago I wrote a post on the blog about the launch of an online project I was involved with called African Cartel – its mission to discover and showcase the art of African artists. At launch the site was built on the Listings theme with the focus being on the artists, the Cart66 plugin was used to offer the e-commerce facilities.

Since launch it has received much success, with our short film receiving over 26,000 views and even a feature on CNN’s homepage, and many iterations with it being somewhat a guinea pig for me to try a variety of e-commerce plugins, all the while not jeopardising on the user experience. I’ve test driven Cart66, WP Commerce, and Jigoshop – some on the live site, some on the development server. All of them having their individual benefits, but all of them somewhat lacking from exactly what it was we needed.

Enter WooCommerce

A couple months back with the WooCommerce plugin in final stages of development it was the obvious choice to test drive our own product for this project. My wife and her business partner provided useful user feedback on the limitations of some of the previous plugins used, and where things could be simplified and improved.

Luckily we didn’t have many products to re-create as WooCommerce products, and only a few product variations, this because we’d specifically limited the amount of products African Cartel sold due to the limitations of our previous platforms. (Side note: From last week importing hundreds of products is no longer a concern thanks to the launch of the CSV product importer extension).

Now with the site using WooCommerce we’ve almost tripled the amount of products we sell and feel confident in listing more.

We use PayPal to take payments, with the plans to allow for South African payments with an SA payment gateway soon, once a currency converter is available.

A new engine behind the website called for a new theme

Listings was a fantastic theme to use with it’s powerful content builder quickly and efficiently allowing us to create the custom post types, and taxonomies we required – with it’s focus being on listing the artists. However, once the content structure was finalised and created the only custom post type we really needed was «Artists».

With Version 2 we wanted the focus to be more on the art these artists wanted to sell, and given Listings was more suited for listing the people behind the art, with the products/art being somewhat disjointed we decided to experiment with the Argentum theme.

The theme port

Moving from the Listings theme we still needed to preserve the content structure the content builder had created for us – the «Artists» custom post type and various taxonomies to categorise the artists. De-activating Listings meant all the artists we had created and categorised disappeared from the WP backend. Luckily not from the database though, all the content was still there – just hidden.

Jeff wrote a simple, short plugin that activated the content schema and displayed it in the backend again, whilst Argentum, or any other theme was active. The realization is sometimes that certain pieces of functionality are better suited to plugins, while others to themes. We then copied a couple of the taxonomy archive and single artist template files to the Argentum theme folder.

Customizing Argentum

I loved the fact Argentum was responsive and the simple, clean, monotone styling. We felt the Listings mod we had developed for African Cartel was a little too colorful, and specifically designed around the township art, with the background image of the website portraying that. With Argentum we felt we could let the art, artist and blog content be more of the highlight and focus of the design.

The beauty of working with WooThemes is the template file structure is the same across all our themes, and the CSS is well structured and commented. I was therefore able to easily copy the top, fixed navigation of the Emporium theme into Argentum, as well defining some of my own page templates calling on layout and styling classes and IDs.

Working with LESS files

Some may have noticed, others not, that we have been experimenting with the dynamic styling language LESS in some of our latest themes to allow for easy and extensive customizations, by changing the bare minimum of CSS – in most cases just a line of code. I’d definitely recommend going to the LESS website to view and understand the benefits.

Working with LESS files meant for only a few hours to create custom page templates that were responsive. More on LESS files in a follow up blog post soon.

Helping shape WooCommerce development

One thing I’m a firm believer in is using your own product regularly on external projects with clients and other amateur WooCommerce users. This to view it with a new set of eyes and to see where it’s shortcomings are in real life scenarios. African Cartel was a prime example of this that allowed us to improve our product offering and even work on new extensions for it that we thought useful.

The Shipping Table Extension

African Cartel required that we could add a weigh based shipping table with numerous conditions for particular locations, as well as a con-current courier shipping charge. WooCommerce Shipping Table extension was used, but adding a weight table at 100g intervals for various countries was a time consuming process with a very large table required.

Using our real content, and live implementation of the extension on African Cartel we quickly realised it’s limitations and load intensity with so many table fields. Mike used this feedback to work on a version 2 of the extension with a far more intuitive and efficient interface, drastically reducing the load time, and the time spent entering the data via adding options to duplicate checked rows. View more on the table rate shipping extension here.

The Product to Media Link Extension

This extension was actually as a result of custom functionality we required for African Cartel. When in a blog post, on a page, or in our case on an artist profile page we wanted to allow particular images (art portfolio items) to be linked to products (art) in WooCommerce. It was quite a simple extension for Jeff to make, but we realised the custom functionality we required was actually quite a common, and useful feature of many other e-commerce stores, blogging about their products – linking the blog with the shopfront better. View more on the extension here.

Even more to come

With African Cartel we’ve seen the importance of interlinking different content types, e.g. artists, musicians, authors to different product types like art, music, books. We are working on an extension that makes the bridge easy. With your product you can associate a post to it that can then be displayed as a widget on your product listing page. See the below screenshots as a working example.

The next plan in the pipeline is to display an artist’s associated products as art pieces available for purchases on their individual artist listing page. But that’s a story for another blog post…

Disclaimer: The site is an ever-evolving work in progress and I’m not claiming it’s going to work flawlessly in the dreaded Internet Explorer.

About

Mark Forrester

I'm a proud co-founder of WooThemes, based at our headquarters in beautiful Cape Town. I'm also a keen photographer, goofy dad and avid sports fan.

Web|X