The standard Usabilla widget is a useful tool to invite your visitors to participate in one of your tests. Thanks to the kind tip of one of our users you can now also use a new widget to set up a quick A/B/n test in Usabilla! Use this widget to invite your users to participate in a random test out of two or more of your Usabilla tests. You just specify which tests to use and every time the widget pops up, we randomly select one of these tests. With this simple widget you can set up a A/B/n Usabilla test for any webpage, image, or sketch in just a few minutes.
1. Look up the ID’s of the tests you want to combine in your A/B/n test
You can find the ID of your test in the dialog “Invite Participants” on the test details page:
2. Change the ID’s in our sample code to your own test ID’s
In the following sample code we’ve provided two test ID’s (’4740521494d3d89aff0cbe’, ’16219895084d3d8e04471f9′). You can replace these ID’s with the ID’s of your own tests.
<script type="text/javascript">
var uwc = {
id: [
'4740521494d3d89aff0cbe', // SAMPLE: Change this to the ID of test A
'16219895084d3d8e04471f9' // SAMPLE: Change this to the ID of test B
],
title: 'What do you think of our website?',
description: 'Participate in a short visual survey and help us to improve our website.',
button: 'Give feedback',
label: 'in just 3 minutes'
}
</script>
<script type="text/javascript" src="http://cache.usabilla.com/widget/ab.js" /></script>
In case you want to add a third (or fourth) test, you can modify the code as follows:
<script type="text/javascript"> var uwc = { id: [ '4740521494d3d89aff0cbe', // SAMPLE: Change this to the ID of test A '16219895084d3d8e04471f9', // SAMPLE: Change this to the ID of test B 'the ID of your third test' // SAMPLE: Change this to the ID of test B], title: 'What do you think of our website?', description: 'Participate in a short visual survey and help us to improve our website.', button: 'Give feedback', label: 'in just 3 minutes' } </script> <script type="text/javascript" src="http://cache.usabilla.com/widget/ab.js" /></script>
3. Add the widget code to your webpage
When you add the adapted widget code to your website, the widget will be loaded automatically on each visit. You can add the code anywhere in your HTML, but preferably just before the </body> tag.