There are 2 main ways to test product page changes:
- Split URL Tests (users redirect)
- On-Page Tests (no redirect)
Testing tools like VWO and Google Optimize allow you to do both types of tests.
For Shopify, Split URL tests for products can be tricky to set up. This is the best way we’ve found how:
1) Duplicate Your Product
Go to the product in the back end that you want to perform a test on. Under the product title, click “duplicate”. You can call the 2nd product anything you want (it won’t actually matter to people on the front end, which we will go over in a later step).
Call it something like “Original Product – V2” or “Original Product – For Testing”
After duplicating your back end will have both products in a list. Next we will give the duplicate product its own template, so you can make any necessary changes for the test.
Setting up 2 products for testing
2) Make a Testing Product Template
Your products are most likely using a template called product.liquid. To check, go to any product page and look at the bottom of the right sidebar, you should see this box (if you don’t see the box your are definitely using product.liquid only):
To set up a second product template to use, first go to your live theme and click “Edit Code”
Once in the theme code, click “add new template” on the left side, select “product” from the dropdown menu, and name the template “testing” for example.
Once the template is created, it will look exactly like your product.liquid template.
3) Assign Your Testing Template to the Testing Product
Navigate to the product you set up for testing (the one you made from duplicating the main product in Step 1.
Find the block named “Theme templates” on the sidebar, and change the template to the one you set up. This will be the name you gave in Step 2.
Click Save to update the product.
4) Point To Your Main Product
When you create 2 products that are really supposed to be 1, you get some weird data from Shopify.
Reports like “Sales by Product” will be messed up since the Titles, Product IDs and Variant IDs of the 2 products are different.
To avoid this, we will make the “product.testing.liquid” file point to your original product.
This way, any sale made during the testing period will attribute to the main product, keeping your data clean. (woo!)
To do this, find the handle of your original product.
Navigate to your original product on your domain, and take a look at the URL. The text after “/products/” will be your handle. In our case “original-product” is the handle.
Now comes the cool part, we will force any product that uses our “product.testing” template to be viewed as our original product.
First, navigate to the “product.testing” template you set up earlier.
Next copy & paste this line of code at the very top:
{% assign product = all_products[‘original-product’] %}
Replace ‘original-product’ with the handle of your original product.
5) Set Up Your Test
With the 2 products set up, and the duplicate product assigned to the original. You should be good to go for your test.
Make any changes/adjustments to the testing template, and refer to your testing platform to set up your split URL (A/B) Test!
This tutorial will work for most Shopify themes. If you need any design, development, or conversion rate optimization help – contact us at [email protected].
