WordPress (plus WooCommerce) and Shopify are two of the most popular out-of-the-box e-commerce website solutions out there. Both platforms let you to sell products on the internet without needing to design your own website. But no matter which route you go, good analytics will always be necessary to spot trouble spots in user traffic, and to identify areas for potential growth. With their widespread use, I wanted to re-do my old analytics implementations (this post and this post) in both WordPress and Shopify and give my take on the two platforms.
Set-up/Installation
Winner: Shopify
In terms of getting off the ground with an e-commerce store, Shopify is the more straightforward of the two. It is specifically designed for e-commerce whereas WordPress is a more wide-ranging platform that has been adapted for e-commerce through plug-ins, the most popular among them being WooCommerce. To get set-up with WordPress + WooCommerce, you have to find somewhere to host your site, install WordPress on the server, and configure all the additional necessary plug-ins. Since I was just playing around, I ran everything through MAMP on localhost. Since I’ve set up my own server quite a few times at this point, I didn’t find this too difficult, but there’s no doubt that Shopify makes the process more simple by hosting the site for you.
Integrating with Google Analytics Suite
Winner: Close, but WordPress
Both WordPress and Shopify offer pretty easy integration of the Google Analytics Suite into your e-commerce site. The awesome plug-in, GTM4WP, is great for getting all three of the products I wanted (Tag Manager, Analytics, and Optimize) up and running on WordPress without having to touch any code. Shopify lets you add GA through a configuration on their preference panel. For GTM, you have to directly edit your site’s theme.liquid file. But even once you do this, GTM won’t fire on your checkout page unless you’re a Shopify Plus customer who is allowed to edit your checkout.liquid file as well.
Enter the workaround found by the very knowledgable Julian Jeunemann (founder of the fantastic resource Measureschool) for getting GTM to fire properly on all Shopify pages (including the checkout page). The workaround involves adding the GTM container script as custom javascript to run as part of Shopify’s existing GA integration. The solution seems to work; the GTM tag fires on the checkout page (though you need to remove it from the head tag in the theme.liquid file so that GTM doesn’t fire twice on all pages). Meanwhile, Google Optimize can be implemented through GTM—though I found that the Optimize tag mysteriously wouldn’t fire on the checkout page. So using the workaround is fine as long as an A/B test doesn’t depend on the checkout page.
Given the somewhat hack-y workaround required to get the Google Analytics Suite going in Shopify, I’m gonna have to go with WordPress for more seamless Google integration with GTM4WP.
Flexibility/Customization
Winner: WordPress
I wanted to try a different A/B test this time round in place of the red button/green button experiment from my prior post. This time I imagined an A/B test where an e-commerce site would test the presence of a coupon code on its checkout page to see whether it would boost their revenue. Like before, I used selenium to simulate traffic to my site and make sure everything was being tracked properly in GA.
To make things a bit more challenging, I wanted to generate a random coupon code for each user rather than just use the same code for everyone. In WordPress, coupon codes are stored in a backend database; in order for a code to be properly applied, it must be written to the database when it’s generated. Luckily, I could use a plug-in, PHP Code Widget, to 1) randomly generate the coupon code when the checkout page loads, 2) write it to the database, and 3) display it to the user.
An extra step is required so that when a user enters the coupon code, the event can be properly tracked by Google Analytics and propagate forward to Google Optimize for the A/B test. Basically, each user’s coupon code must be passed to GTM so that GTM can verify the code was entered correctly. I pass the coupon code to GTM by pushing to the dataLayer via javascript. Fortunately, with the PHP code widget, I can execute javascript in PHP with a simple echo call:
echo "dataLayer.push({'coupon_code': '$coupon_code' });";
When WordPress renders the page, this script gets written into the HTML page source and is run in javascript by the browser. Now GTM knows the user’s unique coupon code. From there, a trigger is set in GTM that fires when a user submits the coupon code. A custom javascript variable configured in GTM verifies whether the code was entered correctly and the resulting value (either true/false) is passed onto GA as a Goal that is then used as the target metric in a Google Optimize A/B test.
Trying to replicate this same experiment in Shopify is a challenge. Displaying widgets in Shopify is an add-on feature you have to pay for (in WordPress it’s free). And trying to generate coupon codes individually for each user at page-load time seems to involve wading far too deep into Shopify’s closed source theme files (which they can change on you at any time). This level of customization/flexibility just isn’t what Shopify is built for. Personally, I prefer WordPress for the extra visibility it gives you under the hood. You might lose some convenience that way, but you gain much more control.
Cost
Winner: WordPress
This might be the most important consideration for most—and the area in which I think WordPress really comes out ahead. With WordPress, you still have to pay someone to host your site, but use of the platform itself is free. GoDaddy has introductory hosting plans as low as $7/month and yearly SSL certificates for $38/yr (SSL certificates are crucial for a secure store). Shopify’s most basic plan, by contrast, is $29/month—but then you’ll have to pay for any plug-ins you need to get the functionality you want. So if you want to keep your website administration costs slim, WordPress is the way to go.