Article Teaser
Julia, Frontend Developer

By Julia

January 26, 2023

How to start A/B testing with Optimizely Experimentation and Magento (Adobe Commerce)

A/B testing (also known as split testing or bucket testing) allows you to show different versions of your page to different users and then check which one works best. Running A/B tests helps you to get to know your customers, improve user experience and find the best ways to convert. How can you start doing A/B testing on your Magento (Adobe Commerce) store? One of the best tools that can help you with it is Optimizely Experimentation.

Basic integration is effortless to do and all you need is an Experimentation account. Then, in the Experimentation panel, you can find a special code snippet. All you need to do is paste it into the head tag of your page. Ta-da! You can start experimenting! You may need to do more in the future if you want to do more advanced segmentation to create audiences or use custom events to track the results of your experiments… but it’s more than enough for a start.

You can create your first experiment:

image3 (3).png

If you added a snippet and correctly targeted your page in the experiment settings, then you should see your page in the Experimentation panel. You can now create your first change inside the variation. There are a couple of change options. We will be changing an existing element here but you can also insert some HTML/image or make a redirect:

image4 (2).png

image5 (3).png

In this example we will be doing a very simple thing for the ecommerce page: changing the text on the “Add to cart” button and tracking clicks against it. You need to select the element first. You can do it by simply clicking on the element in the preview but you can also manually type in the selector. Then change the HTML content:

image7 (2).png

There is a lot you can do by using the Experimentation UI without writing any code (things like background, font size and color, border) but you can also add some class or inline styles.

You still need to somehow measure the effects of your experiment. In this case you may simply enable the tracking of clicks on the changed element. In your change options go to the “Track Clicks” tab and enable “Track clicks on this element”. That’s all you need for now:

image1 (6).png

You can add more variation or target only a specific audience (if you don’t do it, everyone will be targeted and the variation and the original will be shown randomly to the user) but what we’ve already done is enough to see Optimizely Experimentation in action and to get some results from our A/B test. Publish and start your experiment. You should be able to see your changes are live on your page. Some users will see the original version:

image6 (2).png

And others will see the variation with the “Buy now!” text instead of “Add to cart”:

image8 (2).png

After some users visit your page you will be able to see the results. You will see how many people saw each of the variations and how many of them actually clicked the button (what the conversion rate is):

image2 (4).png

There is much more you can do with A/B testing but, as you can see, launching your first test with Optimizely Experimentation and Adobe Commerce is extremely simple. The results are visible immediately so you can quickly and easily check what works best for your business.

From our experience, Optimizely Experimentation is a great way to increase the conversion rate directly. We are exploring A/B testing in our clients' projects in a few projects and always see huge improvements. Active searching new possibilities to increase sales in ecommerce is a key part of our work. And Optimizely tools give you that chance.

Would you like to innovate your ecommerce project with Hatimeria?

Author
Julia, Frontend Developer
Julia
Senior Developer

A mountain lover and code climber. She can reach any peak and conquer any coding challenge. Loves ramen, reading books and watching TV series. Wins every Hatimeria competition.

Read more Julia's articles

Our Latest Thinking

Interested in something else?

Office

Meet the team

Learn more about company and the team.

Join Us

Join us

Make an impact on your career.