Задать вопрос
@deniskins23
javascript

Какой скрипт вставить для динамического контента?

Доброго времени суток!С праздниками всех!Кто может подсказать - жутко нагрели голову. Есть лендинг, из него хотят сделать мультлендинг, чтобы по переходу с рекламы по utm-метке, в зависимости от того, с какой метки пришел посетитель, заголовок h1 на сайте менялся. Маркетолог дал такую метку https://site.ru/?utm_source=yandex&utm_medium=cpc&... (изменил только название сайта). И я не пойму, по каким параметрам тут вообще можно что-то менять?Искал решение в сети, есть скрипты, но они с абсолютно другими параметрами в метке. Кто может подсказать?Горит очень.
  • Вопрос задан
  • 224 просмотра
1 комментарий
Подписаться 1 Простой 1 комментарий
Решения вопроса 2
potapchino
@potapchino
это вам дали шаблон сылки. вместо фигурных скобок {}, там будут значения меток, типа:
https://site.ru/?utm_term=глажка котов

spoiler
;(function(){
//   [1]
//   берем содержимое адресной строки (все что идет после знака «?», включая сам этот знак)
  const url = location.search;

//   [2]
//   теперь нужно эту строку (пример):
//   '?utm_source=yandex&utm_medium=cpc&utm_campaign=ооо_рога_и_копыта&utm_term=глажка котов'
//   распарсить в объект:
//   {
//     utm_source: 'yandex',
//     utm_medium: 'cpc',
//     utm_campaign: 'ооо_рога_и_копыта',
//     utm_term: 'глажка котов'
//   }
//   напишем для этого функцию: 
  function parseUrlSearchParams(url) {
    return url.replace('?', '').split('&').reduce((res, mark) => {
      const [key, value] = mark.split('=');
      return (res[key] = value, res);
    }, {});
  }

//   [3]
//   далее берем со страницы нужный вам заголовок h1 или что вам там нужно
  const htmlElement = document.querySelector('h1.my-super-seo-header');

//   [4]
//   далее собственно меням содержимое тега, на значение нужной вам utm-метки (к примеру это utm_term):
  htmlElement.textContent = parseUrlSearchParams(url)['utm_term'];
//   было:
//   <h1 class="my-super-seo-header">мойка собак</h1>
//   стало
//   <h1 class="my-super-seo-header">глажка котов</h1>

//   все
})();

и я думаю вам нужно уточнить у ваших маркетологов по каким правилам менять текст заголовка. т.е. не тупо менять на значение метки, а типо: если значение метки - 'глажка котов', то меняем текст на: 'Гладим котов быстро и качественно'. и так для всех возможных значений меток
Ответ написан
4 комментария
4 комментария
REKTOR_RG
@REKTOR_RG
Значит я это делаю так:
В ссылке можно передать аргументы (наверно не раз встречали ссылку вида my.site/something?id=45445, и даже сами сейчас прислали такую ссылку). К чему я собственно веду, там например мы можем передать какую-то цифру которой соответствует определённый текст.
Допустим у нас будет такая ссылка: https://site.ru/?type=1
Теперь в JS читаем значение type. Так как в JS нет готовых инструментов для этого, поступим просто. Затребуем необходимость указывать параметр type первым. И так, есть код, который при условии параметра type первого в списке возвращает его значение:
var type = "0";
if(window.location.href.split('/')[window.location.href.split('/').length-1].split('=')[0].replace("#","").replace("?","")=="type") 
{
type = window.location.href.split('/')[window.location.href.split('/').length-1].split('=')[1].replace("#","");
}

Теперь перейдём к html, и найдём нужный заголовок, укажем ему id="titletype"
<h1 id="titletype">Добро пожаловать!</h1>
Ок, вернёмся к скрипту:
var type = "0";
if(window.location.href.split('/')[window.location.href.split('/').length-1].split('=')[0].replace("#","").replace("?","")=="type") 
{
type = window.location.href.split('/')[window.location.href.split('/').length-1].split('=')[1].replace("#","");
}
if(type=="1") document.getElementById("titletype").innerHTML = "Спасибо за регистрацию!"
if(type=="2") document.getElementById("titletype").innerHTML = "Благодарим, что доверяете нам!"
/*И так далее*/

Конечный результат:
<h1 id="titletype">Добро пожаловать!</h1>
<script>
var type = "0";
if(window.location.href.split('/')[window.location.href.split('/').length-1].split('=')[0].replace("#","").replace("?","")=="type") 
{
type = window.location.href.split('/')[window.location.href.split('/').length-1].split('=')[1].replace("#","");
}
if(type=="1") document.getElementById("titletype").innerHTML = "Спасибо за регистрацию!"
if(type=="2") document.getElementById("titletype").innerHTML = "Благодарим, что доверяете нам!"
</script>
Ответ написан
15 комментариев
15 комментариев
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Junior JavaScript Developer
КРАФТТЕК • Санкт-Петербург
от 60 000 до 80 000 ₽
JavaScript разработчик
вАйТи
от 5 000 до 25 000 ₽
JavaScript Fullstack
OnClass
от 200 000 до 600 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Настроить контекстную рекламу в google adwords вертикаль gambling
16 апр. 2024, в 21:33
80000 руб./за проект
Проверка домена на санкции и ограничения Яндекса
16 апр. 2024, в 21:33
500 руб./за проект
Разработка импульсного блока питания
16 апр. 2024, в 21:31
10000 руб./за проект
Ещё заказы