error
Произошла ошибка...
Для генерации кода необходимо внести данные во все обязательные поля.
Понятно
success
Код успешно скопирован!

Как вставить код в Taptop?

  1. Откройте настройки страницы в Taptop

  2. В блоке «Перед тегом body» вставьте сгенерированный код

  3. Опубликуйте страницу

  4. Проверьте работу расширения на опубликованном сайте

Frame
Расширение не работает? Прочтите раздел «Решение возможных проблем» в документации, перепроверьте все шаги инструкции или обратитесь в поддержку.
Понятно
logo_taptop_black
Компания
Компания
О нас
База знаний
Контакты
Обучение
Обучение
Курс для новичков
Курс для экспертов
Тарифы
Шаблоны
Эксперты
Расширения
Сделано в Taptop
soc-white-telegram
soc-white-vk
soc-white-youtube
soc-white-dprofile
soc-white-vc
soc-white-behance
Отдел продаж
Войти
Зарегистрироваться
Войти
Заказать сайт
Зарегистрироваться
Расширения
>
Название расширения

Замена контента под разных посетителей

Расширение показывает разный контент на сайте в зависимости от геолокации пользователя или UTM-меток в URL. Эти метки указывают, откуда пришёл посетитель: реклама, соцсети, e-mail. Это позволяет персонализировать сайт для разных регионов и управлять контентом для рекламных кампаний. Вместо создания отдельных страниц под разные аудитории, можно показывать нужный текст или блоки на одной странице, например, телефоны для регионов или акции по локации. Это делает сайт более гибким и адаптивным без дублирования страниц.
Подключить по инструкции
Смотреть пример
Taptop
Автор
Coins icon
Бесплатно
Цена
Clock icon
10 мая 2025
Обновлено
warning
Для подключения расширения необходим компьютер
Вы просматриваете страницу с мобильного устройства. Чтобы подключить расширение к Taptop, пожалуйста, откройте эту страницу на компьютере и следуйте инструкции.

Как работает расширение

Расширение анализирует UTM-метки в URL-адресе и IP-адрес пользователя и выполняет следующие действия:

  • Замена текста — подстановка разных значений в заданные шаблоны текста в зависимости от UTM-параметров.

  • Управление блоками — показ или скрытие определённых блоков на странице на основе UTM-параметров.

  • Правила по IP — персонализация контента в зависимости от страны, города или региона посетителя.

Как работать с инструкцией

Для настройки расширения вам нужно:

  1. На платформе Taptop — создать необходимые блоки и шаблоны текста, настроить названия CSS-классов, а также вставить полученный код в настройках страницы.

  2. В генераторе кода (в правой части страницы) — настроить параметры мультилендинга и сгенерировать код.

Установка расширения на сайт

Шаг 1: Подготовьте контент на сайте в Taptop

Перед тем как настраивать параметры в генераторе и вставлять код на сайт, подготовьте элементы на странице:

  • Для замены текста: Добавьте в текстах шаблоны вида %%ключ%% там, где нужно будет менять текст в зависимости от UTM-параметров. На следующем шаге вы настроите в генераторе кода правила, по которым эти шаблоны будут заменяться на нужные тексты.

    Пример: Позвоните нам: %%phone%%

  • Для управления блоками и правил по IP: Задайте для блоков, которыми будете управлять, уникальные CSS-классы. С помощью этих классов вы укажете в генераторе кода, какие блоки показывать или скрывать.

💡 Чтобы присвоить класс элементу:

  1. Выберите элемент, а затем на панели стилей в поле Источники стилей введите нужное название класса и нажмите Enter.

    Введите название класса

  2. Класс будет присвоен элементу и отобразится в поле Источники стилей.

    Класс присвоен элементу

⚠️ Рекомендуем заранее продумать логику ключей и показа блоков — это упростит настройку в генераторе.

Шаг 2: Настройте параметры в генераторе и сгенерируйте код

  1. Перейдите к генератору (в правой части страницы с данной инструкцией).

  2. Заполните нужные правила (подробная инструкция ниже):

    • замена текста;

    • условия видимости блоков;

    • правила по IP.

  3. Нажмите кнопку “Сгенерировать код”. Код будет автоматически скопирован в буфер обмена, и вы увидите уведомление.

Шаг 3: Вставьте код на сайт

  1. Перейдите в Taptop и откройте настройки страницы: на вкладке Страницы нажмите иконку шестеренки рядом с названием нужной страницы.

  2. В блоке "Перед тегом <body>" вставьте сгенерированный код.

  3. Сохраните изменения на странице и опубликуйте ее (Ctrl+Shift+S).

Подробная инструкция по настройке параметров в генераторе

Опция 1. Замена текста

Позволяет автоматически подставлять нужные значения в текст с помощью шаблона в зависимости от UTM-параметров.

Как настроить:

1. Перейдите на вкладку "Замена текста".

2. Заполните настройки для правила:

  • Ключ — будет использоваться в шаблоне на странице как %%ключ%% (например, %%phone%%).

  • Текст по умолчанию — значение, которое будет использоваться, если не сработает ни одно UTM-правило.

3. Заполните поля в блоке “UTM правила”:

  • Выберите параметр URL (например, utm_source, utm_medium и т.д.).

  • Укажите ожидаемое значение параметра.

  • Введите текст, который будет подставлен при совпадении параметра URL с указанным значением.

4. Опционально — если вы хотите использовать несколько UTM правил для одного текста, нажмите кнопку "Добавить UTM правило" и заполните соответствующие поля.

💡 Если вы хотите настроить замену для нескольких разных текстов, нажмите кнопку "Добавить замену текста". Будет добавлено новое правило, для которого нужно будет сделать все вышеперечисленные настройки. Вы можете добавить столько правил, сколько вам нужно.

Пример:

  • Создали замену с ключом: phone

  • Текст по умолчанию: +7 (800) 555-35-35

  • Добавили UTM-правило:

    • Параметр URL: utm_source

    • Значение параметра: telegram

    • Текст замены: +7 (999) 111-11-11

Пример настройки параметров

На странице используется шаблон: Позвоните нам: %%phone%%

Запись в редакторе

Если посетитель зайдет с Telegram (utm_source=telegram), он увидит: "Позвоните нам: +7 (999) 111-11-11"

Utm-метка в адресной строке
Текст изменился в соответствии с нашим условием

Если посетитель зайдет с другого источника, он увидит: "Позвоните нам: +7 (800) 555-35-35"

Текст по умолчанию

Опция 2. Управление блоками

Позволяет показывать или скрывать блоки на странице в зависимости от UTM-параметров.

Как настроить:

  1. Перейдите на вкладку "Управление блоками".

  2. Заполните “Настройки по умолчанию” — укажите, блоки, которые будут показаны/скрыты, если не сработает ни одно правило UTM. Для этого введите названия CSS-классов этих блоков (без точек в начале) через запятую (например, sale-block, discount-block).

  3. Заполните поля:

    • Параметр URL — UTM-параметр из списка.

    • Значение параметра — ожидаемое значение параметра.

    • Показать блоки — список CSS-классов блоков, которые нужно показать.

    • Скрыть блоки — список CSS-классов блоков, которые нужно скрыть.

💡 Если вы хотите настроить управление блоками для нескольких разных UTM-параметров, нажмите кнопку "Добавить правило видимости". Будет добавлено новое правило, для которого нужно будет сделать все вышеперечисленные настройки. Вы можете добавить столько правил, сколько вам нужно.

Пример:

  • Добавили правило:

    • Параметр URL: utm_campaign

    • Значение параметра: sale

    • Показать блоки: discount-block, timer

    • Скрыть блоки: regular-price

Пример настройки параметров

Если посетитель зайдет с параметром utm_campaign=sale, будут показаны блоки с классами discount-block и timer, а блок с классом regular-price будет скрыт.

Опция 3. Правила по IP

Позволяет настроить отображение контента в зависимости от местоположения посетителя.

Как настроить:

  1. Перейдите на вкладку "Правила по IP".

  2. Заполните данные о локации:

  • Страна — название страны на английском (например, Russia, Belarus) или ”*” для любой страны. Нажав на значок лупы, вы можете выбрать страну из списка.

  • Город — название города на английском или ”*” для любого города.

  • Регион — название региона на английском или ”*” для любого региона.

  1. Настройте параметры замены текста для выбранной локации:

    • Ключ — будет использоваться в шаблоне на странице как %%ключ%% (например, %%phone%%).

    • Текст по умолчанию — значение, которое будет использоваться, если правило не сработает.

    • Текст замены, который будет подставлен, если локация пользователя совпадает с указанной.

  2. Опционально — если вы хотите настроить замену для нескольких разных текстов, нажмите кнопку "Добавить замену текста" и заполните соответствующие поля.

  3. Настройте видимость блоков для выбранной локации:

    • Укажите, какие блоки показать/скрыть для посетителей из данной локации, введя названия их CSS-классов (без точки в начале) через запятую.

💡 Если вы хотите правила для нескольких локаций, нажмите кнопку "Добавить IP правило". Будет добавлено новое правило, для которого нужно будет сделать все вышеперечисленные настройки. Вы можете добавить столько правил, сколько вам нужно.

Пример:

  • Создали IP-правило:

    • Страна: Russia

    • Город: * (любой)

    • Регион: * (любой)

  • Добавили замену текста:

    • Ключ: region

    • Текст по умолчанию: в вашем регионе

    • Текст замены для IP-правила: в России

  • Настроили видимость:

    • Показать блоки: russian-content

    • Скрыть блоки: international-content

Пример настройки параметров

  • Посетители из России увидят: "Доставка в России бесплатная!"

  • Остальные посетители увидят: "Доставка в вашем регионе бесплатная!"

Пример комплексного использования расширения

Представим, что у вас есть страница с акцией, которая отличается в зависимости от источника трафика и региона посетителя:

  1. Замена текста для UTM:

    • Ключ: discount

    • По умолчанию: 10%

    • UTM-правило для VK: если utm_source=vk, то 15%

    • UTM-правило для Telegram: если utm_source=telegram, то 20%

  2. Управление блоками для UTM:

    • По умолчанию показываем блок standard-offer

    • Если utm_campaign=blackfriday, показываем блок black-friday-offer и скрываем standard-offer

  3. Правило по IP:

    • Для России показываем информацию о доставке по России, ключ delivery_info

    • Для других стран показываем информацию о международной доставке

Таким образом, посетитель из России, пришедший с Telegram во время акции "Черная пятница", увидит скидку 20%, информацию о доставке по России и специальное предложение "Черная пятница".

https://taptop.pro/f/multilanding-generator.js

<multilanding-generator></multilanding-generator>