Мультилендинг — это по сути лэндинг с изменяемыми частями контента в зависимости от запроса (рекламных объявления) фактического URL через который мы попадаем на него. Могут меняться заголовки, изображения, целые блоки лэндинга, но также должны быть и неизменные части, т.к. в этом весь смысл.
Мультилендинг в виде страниц
Самый простой и быстрый способ создать мультилендинг в wordpress — завести несколько шаблонов страниц с разной конфигурацией блоков. Например первый блок у каждого шаблона отличается, остальные одинаковые (при этом все блоки подключены функцией get_template_part( ‘ ‘ );).
Мультилендинг по запросу хэша
Более продвинутый, но вместе с этим более сложный способ создания изменяемых элементов — парсинг URL. Специальным скриптом мы отлавливаем хэш в URL и в зависимости от этого динамически меняем содержание некоторых элементов средствами jQuery. Данный способ очень надуманный — не советую его применять. но упомянуть следует как альтернативный.
Мультилендинг по запросу UTM-метки
Это фактически доработанный, усовершенствованный, готовый вариант предыдущего способа (по хэшам), его используют большинство специалистов в решении данной задачи. Только в данном случаем вместо хэш, мы будем отслеживать в URL UTM-метки. UTM-метки формируются в Яндекс.Директ.
Скрипт отслеживания и обработки UTM-меток
<script type="text/javascript">
$(function () {
var utm='utm_content';
if( window.location.toString().indexOf(utm +'=') != -1) {
var number=(window.location.toString().substr(window.location.toString().indexOf(utm+'=')+ utm.length+1,50)).toLowerCase();
if( number.indexOf('&') != -1) {
number=(number.substr(0,number.indexOf('&')));
}
if(number == 'eng') {$('.multi-title').html('английского');}
if(number == 'iaponia') {$('.multi-title').html('японского');}
if(number == 'isp') {$('.multi-title').html('испанского');}
if(number == 'itl') {$('.multi-title').html('итальянского');}
}
});
</script>$(‘.multi-title’).html(‘испанского’); — мы можем использовать абсолютно любые скрипты jQuery.
Данную задачу также можно решить с помощью php — это в разы быстрее, но не всегда удобно. Пример:
<?php
$title = $_GET['utm_content'];
if($title == 'eng') {$title_text = 'английского';}
elseif($title == 'iaponia') {$title_text = 'японского';}
elseif($title == 'isp') {$title_text = 'испанского';}
elseif($title == 'itl') {$title_text = 'итальянского';}
else{$title_text = 'китайского';}
?>
<h6>Онлайн изучение <span class="multi-title"><?php echo $title_text; ?></span> языка <br>с лучшими преподавателями</h6>Данный способ создания мультилэндинга взял с сайта lozyuk.ru. Там же можно почитать более подробно про UTM-метки.
Доработанный скрипт с отлавливанием фраз из поискового запроса:
multi="перегородочные|перегородки;Перегородочные блоки\n\
перемычки;Блоки перемычки\n\
стеновые;Стеновые блоки";
$(function() {
//формируем массив с utm метками
function getURLParameter(name) {
return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search)||[,""])[1].replace(/\+/g, '%20'))||null;
}
utm=[];
$.each(["utm_source","utm_medium","utm_campaign","utm_term",'source_type','source','position_type','position','added','creative','matchtype'],function(i,v){
utm[v]=getURLParameter(v) || $.cookie(v);
$.cookie(v, utm[v], { expires: 365, path: '/' });
});
// MULTI
var ab_title = "default";
if(utm['utm_term']){
multi=multi.split('\n');
multi=$.map(multi,function(v, i){
arr1=v.split(';');
r=new RegExp(arr1[0]);
return {reg: r,val: arr1[1]};
});
multi=$.grep(multi,function(v,i){
return utm['utm_term'].search(v.reg) > -1
});
if(multi[0]){
ab_title=multi[0].val;
var target = $('.multi'); //элемент для подмены
target.html(ab_title);
}
}
});перегородочные|перегородки; — слова из поискового запроса (разделяются |, по окончании ;)
Перегородочные блоки\n\ — то, что нужно подставить в заголовок в зависимости от поискового запроса (переход для следующего условия \n\, если больше условий нет — ничего не ставим)
Парсинг utm-меток из url
Пример url c utm-метками:
https://site.ru/?utm_source=product_email&utm_medium=email&utm_term=September_15&utm_content=button_Read_more&utm_campaign=skidka_20Получить все значения url после ? можно командой:
print_r ($_GET);Получаем конкретные значения
$utm_source = $_GET['utm_source'];
$utm_term = $_GET['utm_term'];Если нужно передать их с формой добавляем их со скрытыми полями
<?php if (!empty($utm_source)): ?><input name="utm_source" class="utm_source" type="hidden" value="<?php echo $utm_source; ?>" /><?php endif; ?>
<?php if (!empty($utm_term)): ?><input name="utm_term" class="utm_term" type="hidden" value="<?php echo $utm_term; ?>" /><?php endif; ?> [site-socialshare]
