Что это такое
Мультивариантное тестирование — это метод проверки нескольких версий элементов на одной странице (например, заголовки, изображения) для определения наиболее эффективного варианта.
Для чего это нужно
Тестирование помогает понять, какой элемент лучше конвертирует. Желательно ограничиться 2-3 вариантами, чтобы не усложнять анализ результатов.
Материал с канала: Кристина Кон
Как настроить тестирование
Вставка скрипта на сайт
Добавьте следующий код в файл index.php перед тегом </body>:
[CODE]<script src="script.js"> </script>
<script>
$(document).ready(() => {
setTimeout(() => {
let subid = "{subid}",
utm_header_gg1 = res_random;
console.log(subid, utm_header_gg1);
$.ajax({
url: 'mvt.php',
type: 'post',
data: {
subid: subid,
TEST_ELEMENT: utm_header_gg1,
},
success: response => console.log(response)
});
}, 5000);
});
</script>[/CODE]
Этот код отправляет данные о показанном элементе на сервер для анализа.
Логика скрытия элементов
Создайте файл script.js с этим кодом:
[CODE]function getRandomElement(arr) {
return arr[Math.floor(Math.random() * arr.length)];
}
let obj_random = ["VARIANT_1", "VARIANT_2", "VARIANT_3"];
let res_random = getRandomElement(obj_random);
if (res_random == 'VARIANT_1') {
$('.CLASS_2, .CLASS_3').addClass('invisible');
}
if (res_random == 'VARIANT_2') {
$('.CLASS_1, .CLASS_3').addClass('invisible');
}
if (res_random == 'VARIANT_3') {
$('.CLASS_1, .CLASS_2').addClass('invisible');
}[/CODE]
Скрипт выбирает случайный вариант контента и скрывает остальные.
Отправка данных в аналитическую систему
Создайте файл mvt.php для передачи данных:
[CODE]<?php
function updateParams($params) {
$subid = $_POST['subid'];
if (!empty($subid)) {
file_get_contents('http://ваш-адрес-кейтаро/?_update_tokens=1&sub_id=' . urlencode($subid) . '&' . http_build_query($params));
}
}
$event_source_url = (isset($_SERVER['HTTPS']) ? 'https://' : 'http://') . $_SERVER['HTTP_HOST'];
updateParams(array(
'sub_id_19' => $_POST['TEST_ELEMENT'],
'sub_id_22' => $event_source_url,
));
?>[/CODE]
Этот файл отправляет данные о тестируемом элементе в систему аналитики.
Стили для скрытия блоков
Добавьте в style.css этот код:
[CODE].invisible {
display: none;
}[/CODE]
Итог
Теперь ваш сайт готов к тестированию. Тестируйте разные элементы и выбирайте лучшие решения на основе данных.
Тестируем, тестируем и ещё раз тестируем: Контролируемое тестирование: Как эффективно тестировать новые офферы и кампании, если у вас уже есть успешная?
