Early last week my wife, Xenia, and I launched an online project that we’d been working on behinds the scenes for a while. African Cartel is an online marketplace for African artists, with the first feature being on a group of disadvantaged, pre-dominantly Zimbabwean artists who’s livelihood and income revolves around selling their township paintings at a traffic light intersection in Cape Town, South Africa. These artists are known as the robot artists.
My involvement with African Cartel was developing a website to house the artist listings, short film, art pieces, and e-commerce facilities to sell the art, whilst Xenia wrapped her head around the logistics of it all. I thought it would be a good idea to write a blog post about how I went about building the site, based on products we’d developed at WooThemes. I am fully aware some will perceive this as a shameless self-promotion, but to those genuinely interested in how we built the site please grab a cup of coffee and enjoy the read.
The website foundations
African Cartel is obviously built upon the hugely flexible, ever growing content management system that is WordPress. Furthermore, the front-end of the site uses our directory based theme Listings to showcase the artists. Once I installed the Listings theme I navigated to the content builder of the theme, where I changed the default custom post type it creates from the generic «Listings» name to «Artists». I then re-named and created some more custom taxonomies to define those artists. An «image» custom field was used to house the artist profile photo, whilst I created another image custom field for the artist type taxonomy.
Once I was happy with the data structure I moved on to creating a child theme which would house the styling/layout customizations to the theme that I wanted to implement to Listings.
A Listings child theme
I closely followed a tutorial Magnus had written on creating child themes for our WooThemes to create the African Cartel theme. Now if I needed to update the
Listings theme powering our site I could easily by overwriting the entire theme folder, without removing any of my customizations as they resided in their own safe folder.
As you can see below the Listings theme looks vastly different to the end result of our African Cartel child theme. Most of these changes were simply new styles overwriting Listings element styling in the cascading stylesheet of the child theme.
Other additions/changes to the theme were:
- An includes/film.php file that is pulled through onto the home page and displays information about our featured short film on the robot artists.
- A new custom-coded page template for the Robot Artists short film.
- A custom image behind each «Artist Type» in the home page categories panel, which used the image custom field I added using the content builder.
- Additional shorter columns in the «Latest Listings» module and on various search results/archive pages.
More technical additions
I then entrusted the more particular customizations I wanted implemented to Jeff, our core developer at WooThemes, given my more limited code knowledge. You could use any of our affiliated woo workers or post a job on our job board though.
We decided the most efficient way of adding art to each artist was for the artist to be a custom post type, and each image uploaded using the «Add an image» button in the WYSIWYG editor to be an art piece. The art would then display in the image slider of the single-listing.php template file.
Jeff added the new loopedslider product gallery (with some tweaks to show captions) to showcase latest, random art pieces / media library items on the home page, and created custom page templates to pull through all art/images in the media library (excluding the artist profile images). It then also intelligently allowed site visitors to drill down into more specific art galleries, i.e. all the art/images associated to particular taxonomies (for example: all the art falling under the Wire artists, or Township Painters).
Given all the delays with WooCommerce, and the urgency needed in getting the African Cartel site live I did some extensive research into other WordPress e-commerce plugins that we could possibly use on the site. At WooThemes we are firm believers in using our own products, but also the importance of researching, testing and using other commercial developer’ products.
Cart66 integrated perfectly with Listings – allowing us to create products in the Cart66 backend module then adding them to pages, posts or artist custom post types via the WYSIWYG editor, similarly to how our shortcodes generator works.
The problem was associating products to particular images within the artist custom post type – a limitation of Cart66. Again Jeff saved the day and wrote a custom class/function allowing one to associate Cart66 products with images/art.
Now we have the facilities to sell art, all the while retaining our quite particular site structure, using PayPal checkout facilities. I also used some PayPal code to allow for the ability to take donations for the art workshop we hope to create for our robot artists.
Other third party plugins
We installed Rocket Genius’s brilliant Gravity Forms, that works with all of our themes to create custom contact form’s for particular artists and pages. This plugin really works flawlessly with WordPress and our themes, and it’s intuitive interface, along with compatibility with the e-commerce plugin we chose (more on that below) made for a very easy decision for why we should use it.
As you can see the site is very niche in the functionality it offers and the layout of particular modules, but using a WooTheme saved huge amounts of time, money and resources in getting the site 75% there. Then fishing around for a solid e-commerce plugin, and tweaking it slightly saved even more time and resources.
The eventual development time on the site was only a couple of days, whilst the custom design tweaks took another few. All in all a deceptively cheap website to get up and running.
Feel free to browse the site, post any questions you might have, and support the artists if you feel so inclined.