: How can I test different types of buttons with Google Analytics Tests? A few years ago I did A/B testing with Google where I put javascript into my page and it displayed two or more versions
A few years ago I did A/B testing with Google where I put javascript into my page and it displayed two or more versions of a code snippets.
So I had ONE url with e.g. different buttons (green and red one).
But now there are Tests at Google Analytics where I can test different URLs.
My problem is that I have a Magento shop where I want to test two different types of buttons on product pages.
Can I test such changes with Google Analytics Tests?
More posts by @Murphy175
2 Comments
Sorted by latest first Latest Oldest Best
i would setup such test with event tracking, so i would have for red button and green button different event tracking codes, like.
Red button: <a href="ab.com/c.html" onClick="_gaq.push(['_trackEvent', 'abtest', 'window.location.href', 'red_button', 1, false]);">abc</a>
Green button: <a href="ab.com/c.html" onClick="_gaq.push(['_trackEvent', 'abtest', 'window.location.href', 'green_button', 1, false]);">abc</a>
I found an answer at Google Developer Docs. Short version:
You define your tests, implement Googles test code and your variations.
<!-- Load the Content Experiment JavaScript API client for the experiment -->
<script src="//www.google-analytics.com/cx/api.js?experiment=YOUR_EXPERIMENT_ID"></script>
<script>
// Ask Google Analytics which variation to show the user.
var chosenVariation = cxApi.chooseVariation();
</script>
And your code for variations:
<!-- Load the JQuery library -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script>
// Define JavaScript for each page variation of this experiment.
var pageVariations = [
function() {}, // Original: Do nothing. This will render the default HTML.
function() { // Variation 1: Banner Image
document.getElementById('banner').src = 'bay-bridge.jpg';
},
function() { // Variation 2: Sub-heading Text
document.getElementById('heading').innerHTML = 'Look, a Bridge!';
},
function() { // Variation 3: Button Text
document.getElementById('button').innerHTML = 'Learn more';
},
function() { // Variation 4: Button Color
document.getElementById('button').className = 'button button-blue';
}
];
// Wait for the DOM to load, then execute the view for the chosen variation.
$(document).ready(
// Execute the chosen view
pageVariations[chosenVariation]
);
</script>
And be sure to fire a pageview after this, so that all the data are send to Google.
Terms of Use Create Support ticket Your support tickets Stock Market News! © vmapp.org2024 All Rights reserved.