I’m Mark Atkinson and I run Red Giant Design – a digital marketing and design studio from sunny Durban, in South Africa.
We recently redeveloped one of our biggest online stores to date, BFore.co.za. BFore sells cell phones with airtime, tablets, televisions and other home electronic goods online to consumers in South Africa.
Thanks to WooCommerce, our client now has a website with functionality that is far superior to that which they had when we initially developed the site using Virtuemart 2 and Joomla.
Over the past year, we’ve really come to enjoy using products from WooThemes, especially WooCommerce. I honestly can’t praise the product enough and I’d even pick it over something like Magento.
Why we switched to WooCommerce
As mentioned, the site based on Virtuemart 2 left a whole lot to be desired – their support even more so. The BFore team often wanted simple features added for the convenience of both their staff and their customers which took us an absolute age to implement on our side. All of these were features, for example being able to edit a customer’s shipping address in the backend, that you would expect in a good online shopping facility, which weren’t there in Virtuemart 2.
We wanted our client to be able to use a system that was practical and powerful, while still being able to provide the most user-friendly interface for customers. Because we had used WooCommerce on a few sites prior to this redevelopment, we were confident in the fact that it could produce the goods. So we switched.
Plugins and extensibility
Virtuemart also doesn’t come close to the number and quality of third party plugins that WooCommerce is able to offer, paid or premium. It’s so frustrating sifting through plugin directories looking for extensions that should actually be part of the core in the first place.
As BFore is a South African e-commerce store, we required a number of plugins which were specifically tailored to a South African market. As WooThemes is partly South African, we were delighted to see that they have a range of South African plugins ready and waiting, such as the Payfast plugin.
A focus on SEO and analytics
As I head up the online marketing stuff within Red Giant, I’m extremely focused on the SEO, user experience and analytics capabilities of whichever e-commerce platform we use for clients websites.
Virtuemart 2 posed several issues in this department. There was no easy way to track goals and events. There were major canonical issues and site speed was also a bit of a letdown. The checkout was a mess and we required a large amount of resources to get into a useable position.
Enter WordPress and WooCommerce, in combination with the WordPress SEO by Yoast plugin. What a pleasure.
With barely any customization on our behalf, the site is SEO friendly and all the issues we had before are resolved. No more duplicate content, no more canonical issues, an easy to use single-page checkout, and built in tracking via Google Analytics.
We managed to reduce the number of URLs on the site from 3819 to just 394. That’s a 90% reduction! I think that in itself speaks volumes for the efficiency of the WooCommerce code and structure.
Site speed is no longer an issue thanks to the W3 Total Cache plugin for WordPress. It will soon be even better as we’re planning on distributing content using a CDN.
One thing that I was surprised to see with WooCommerce was the built in Schema.org microdata. I didn’t expect it to be there, but boy was I glad it was.
Challenges we needed to overcome
Despite WooCommerce being an absolutely phenomenal system, there were many curveballs thrown at us (there always are) which needed to be dealt with. Some of the challenges we experienced with the redevelopment of BFore were:
Developing a custom payment plugin
BFore recently signed on with CreditCart, a system that allows customers to pay for their purchases over up to 24 months. We needed to code a custom payment plugin to integrate CreditCart with WooCommerce. This took quite some time to implement, but is now in place and working wonderfully!
The Release of WooCommerce 2.0
WooCommerce 2.0 was released midway through our development of the new site. This was something that we hadn’t anticipated, but figured we needed to implement anyway to future-proof the site. Certain nuances in WC 2 took some time to wrap our heads around and delayed our development by a week or so, but were eventually sorted out.
Working with the WARP Framework
We based the site off of Yootheme’s Warp framework which we enjoy using for its efficiency. Little did we know that when WC 2.0 was released it would wreak havoc with the functionality of the site after the upgrade. As there seems to be no commitment by Yootheme to make Warp compatible with WC 2, we had to make several edits to the theme ourselves.
Thanks to the WooCommerce extension directory, we were able to add a number of really amazing features to BFore’s site which wouldn’t otherwise have been possible with a relatively limited budget.
I’m convinced that we’ve probably bought and implemented 70% of all the extensions for WooCommerce, but some of the new features that are really game-changing in terms of the customer experience through BFore are:
The potential uses for this plugin are mind-blowing. I’m sure we are only scraping the surface, but we use Follow-up Emails to send emails asking customers to review their products a month after they’ve purchased them, as well as to send cart abandonment emails offering customers a discount coupon if they go back and complete their orders.
Reviews for Discount
User-generated content is great for SEO and encouraging reviews is something we’ve always wanted to do for BFore. What better way to do this than with a combination of Reviews for Discount and Follow-up Emails!
Better customer account functionality
BFore’s customers can now log into their accounts, view all their orders and all order notes added by BFore’s team, as well as pay for orders that remain unpaid using the Payfast plugin! Customers are emailed (or sent an SMS thanks to the Twilio SMS plugin) whenever their order status is changed or an order note is updated.
It’s all so practical.
Other Awesome Plugins
As I mentioned, we probably bought most of the extensions available for WooCommerce. Some of the more important ones that we’re using are:
- Dynamic Pricing – This allows BFore a whole lot more control over category-based discounts and opens up options that previously weren’t available.
- Subscribe to Newsletter – Bfore always wanted their customers to be able to sign up directly to their Mailchimp lists when purchasing. We were really glad to find this plugin available for WooCommerce.
- Local Pickup Plus – Bfore’s customers are able to collect certain products from depots around South Africa so they need to be able to select a pickup address during checkout. This is a function that we had to code manually for Virtuemart 2.
- Product Enquiry form – All part of helping us improve the user experience.
- WooCommerce Waitlist – BFore’s suppliers are often out of stock and they prefer not to take orders during this time. Instead, they can now offer potential customers the option to sign up to a waitlist, whereafter they will be notified if the product becomes stocked again. We’re also using this plugin to add a nifty new “feature” to BFore where we’re listing upcoming products for customers to join a waiting list. This is quite nice in an industry where new highly anticipated products are talked about and released often. (Cellular devices mainly)
- Ajax Layered Navigation – When you’re selling something like televisions, it’s really useful for a customer to be able to filter your products by attributes such as screen size or panel type. Ajax layered navigation is perfect for this and, once again, represents a feature that was missing from Virtuemart 2.
- WooCommerce Tab Manager – I feel it’s important not to bloat your descriptions with surplus information such as technical specifications. This plugin allowed us to create custom specifications tabs for the products that needed them, so we could separate that information.
My only gripe
As I’m sure you can tell from the above, I feel that WooCommerce is hands down one of the best e-commerce solutions around. Our development process was a thousand times easier than the initial development and the end result has been a very happy client for us.
The one inefficiency that we really would like to see bettered in future versions of WooCommerce is the interaction between order status updates and the emails that are sent to the customer, as well as improved ability to customize this. Although this was somewhat dealt with in WC 2, I feel it could still be improved upon. The emails sent tend to be inconsistent and it’s not always obvious what is going to be sent to the customer when taking the payment method and order status into account, especially when resending customer invoices.
Other than that, we really have no complaints whatsoever. We will continue to support WooThemes and WooCommerce while they continue to produce great products and offer top notch support.
BFore was, and continues to be, a really challenging project for us to work on. Now that we use WooCommerce, it’s become rather fun!
I’m always happy to chat about our work or interesting challenges. You can get in touch with me on Google+ or via our website, redgiantdesign.co.za with any related questions or thoughts. (Also be sure to post your thoughts in the comments below)
The site doesn’t appear to be responsive. I was wondering what the decision behind that was?
Also I got a warning saying I need to use a modern browser even though I’m using Google Chrome.
“The site you are visiting can only be viewed using a modern browser. Please upgrade your browser to increase safety and your browsing experience. Choose one of the browsers above. If you don’t care click here”
This happened when clicking on https://bfore.co.za/product/apple-iphone-4s/
Any site that uses the outmoded WARP framework isn’t responsive because the framework isn’t. It sounds like they used what they were comfortable with instead of going with something like Bootstrap, Foundation, etc instead.
The warp Framework is responsive and is on of the best framework on the market.
I believe I’ve confused WARP with Gantry. My mistake. Apologies..
Oops! I’m wrong again. Looks like Gantry is responsive too now but only as of March 2013 (very recently). Ha, ha. I’m glad to be wrong about both. Last time I looked an Gantry and WARP was probably in the non responsive days. Thanks for calling me out on this, I’ve got some “old” frameworks to re-review! 🙂
The warp master theme is great framework to use. You should give it a try.
The site will be responsive within the week. It’s something we delayed the implementation on because only a very small minority of visitors to the site are accessing it and buying from a mobile device. (Mobile isn’t as big in South Africa as it is overseas)
That said, we are still working on the responsive properties. (Also, Warp is responsive, just not to the extent that we’d like it to be. We tweak the framework to make it work for us and have done so on a number of WooCommerce sites)
I’m very interested in the error message you picked up. We all use Chrome and have never seen that issue. Were you using Chrome on a mobile device or Chrome on a PC? I’ll definitely look into that.
On my desktop PC using windows 7 pro.
I’d be interested in a follow up article on what you do to make the site responsive. Currently imo woocommerce and woothemes is really lacking on this front.
I’m curious to what you mean by we’re lacking in responsiveness?
A lot of our themes, since Buro, have been responsive and WooCommerce itself is responsive. Your theme, of course, has to be responsive for WooCommerce to be responsive as well.
Just curious to what you mean by lacking?
Off the top of my head the biggest problem is with using a lightbox on mobiles. Perhaps this isn’t so much a responsive issue as a mobile / touch device design issue.
Also the woothemes website isn’t at all responsive which I would expect from a company selling themes.
Responsiveness is one of the reasons that I moved one of my client’s e-commerce (WooCommerce + Stripe + 80% of the WooCommerce commercial plugins) to Superstore. I want the thing to render elegantly on any chrome, not just W7 desktop or the iPad.
Both WooCommerce 2.0 and newer themes are responsive, so I too would love to know what the OP is talking about.
To me this would somehow be more a Joomla vs. WordPress choice and I’d be curious about what made you change from your “rule of thumb” you explain in this interesting post : http://www.sitepoint.com/wordpress-v-joomla-the-winner/
[quote]As a general rule of thumb, when I’m developing a site that relies heavily on content — something like a blog/content curation website or a news website — I will generally look to WordPress. For just about everything else (usually more complex sites) I tend to use Joomla.[quote]
eCommerce most likely falls into complex site category rather than blog/content
Follow-up Emails does indeed have astounding potential, and I’m really happy to see it getting highlighted. I raised a feature suggestion a while back and it was implemented almost before I could blink – astounding service.
This is very good timing – I’m thinking about moving a site over from Joomla/Virtuemart to WordPress/WooCommerce at the moment.
My biggest worry is migrating the data from Joomla to WordPress (content items, posts and Vituemart products). Did you use a migration plugin to handle this or was this done manually? The site I want to do it on has 300+ pages/posts/products, so manually isn’t really an option!
Any advice or thoughts would be welcomed.
We have just shifted a site from Joomla 1.5 and Virtuemart to WooCommerce (and a non-responsive WooTheme) and had to do it all by hand. There didn’t seem to be a decent/reliable plug in or Joomla extension to handle it.
OK, there were only about 30 products in the shop, which made it less of a ball ache, but the results in terms of better shop, increasing sales, better SEO and in the end a happier customer were wll worth it – and I think we are barely scratching the surface on what WooCommerce can do!
I wish to show thanks to the writer for rescuing me from this particular instance. Because of looking out through the world-wide-web and getting concepts which were not pleasant, I thought my life was well over. Being alive minus the approaches to the difficulties you’ve fixed through your site is a crucial case, and the kind which might have in a wrong way damaged my entire career if I had not come across your web page. Your good ability and kindness in playing with all the details was very useful. I’m not sure what I would have done if I had not discovered such a solution like this. I can also at this point look ahead to my future. Thanks so much for the impressive and sensible help. I will not think twice to endorse the website to any person who would like care about this subject matter.
With this case study, I’m wondering if anyone at Woo is working on a Virtuemart to Woocommerce migration plugin. This may be something for affiliated woo workers to do, but honestly… I trust Mike Jolley or another name I know works with Woo than a random dev.
I replied above about this. Our solution was a system called Cart2Cart. 🙂
I’m wondering the same thing, I have a client who is using Joomla / Virtuemart and wants to move to WordPress / Woocommerce. Is there a migration plugin available?
I replied above about this. Our solution was a system called Cart2Cart. 🙂
Nice work. i have a question, how you showing testimonials in a random order, is this woo testimonial plugin or any other?
It’s a different plugin, called Testimonials Widget: http://wordpress.org/extend/plugins/testimonials-widget/
how you added this Product Enquiry option?
Thank you. Can you please provide some more details about what you do with caching of pages when users are logged in?
Great article. I am very interested in your experience with CDN. I also run WP and woo commerce and would love to use CDN but want to be sure that CDN doesn’t break woo.
Very interesting. I use Virtuemart 2 and I am able to edit the shipping address inside the backend. I am asking myself how you did create more than 3800 url for a page which contains barely more than 350 – 400 products.
how you added this Product Enquiry option?