На главную

Туры по продукту и «Покажите»

Проводите посетителей по странице шаг за шагом: туры как списки шагов, запуск из кода и указатель ассистента «Покажите».

Показывайте вместо объяснений: тур ведёт посетителя по вашей странице шаг за шагом. Страница слегка затемняется, кольцо выделяет нужный элемент, рядом — облачко с текстом и кнопками Zurück (назад), Weiter (далее) и Beenden (завершить).

Создание туров

В /app/projects/{id} на вкладке Тексты и формы, раздел Туры по продукту, туры вводятся как JSON. Сохранение пустого поля удаляет все туры.

[
  {
    "id": "erste-schritte",
    "name": "First steps",
    "steps": [
      { "selector": "#konto", "title": "Your account", "text": "Change your details here." },
      { "selector": ".rechnung", "text": "And the invoices are here.", "placement": "top" }
    ]
  }
]

У тура есть:

id — обязателен и уникален. Строчные буквы, цифры, - и _, начинается с буквы или цифры, до 48 символов. Им запускается тур.
name — название для вас.
steps — от 1 до 30 шагов.

У шага есть:

selector — обязателен. CSS-селектор элемента страницы, до 300 символов.
text — обязателен. Текст облачка.
title — необязательный заголовок.
placement — bottom (по умолчанию) или top. Это пожелание, не обещание: если сверху не помещается, облачко уходит вниз.
i18n_weiter, i18n_zurueck, i18n_fertig, i18n_ende — необязательные свои подписи кнопок «Далее», «Назад», «Готово», «Завершить».

Ограничения: до 20 туров на проект, всего 32 КБ. При сохранении аккаунт проверяет JSON и называет ошибку, если что-то неверно.

Запуск тура

Туры запускаются из кода, например кнопкой «Начать тур» или после первого входа:

ReactiveChat('tour', 'erste-schritte');

Вызов возвращает true при запуске, иначе false. Завершение:

ReactiveChat('tourStop');

Посетитель завершает тур через Beenden, на последнем шаге через Fertig (готово) или Escape. Счётчик показывает текущий шаг.

Если элемента нет

Если виджет не находит элемент шага, например его нет на странице или он скрыт, шаг пропускается. Если нет всех элементов, тур не запускается и возвращается false. Поэтому проверяйте селекторы именно на странице запуска тура.

Оформление

У туров фиксированный нейтральный дизайн, независимый от фирменных цветов и своего CSS. Ширина облачка до 320 px. Без своих подписей кнопки на всех языках называются «Beenden», «Zurück», «Weiter», «Fertig». Поэтому для туров на английских или польских страницах задавайте i18n_* в каждом шаге.

«Покажите»

В ответе ИИ-ассистент может указать на элемент страницы, например кнопку «Добавить в корзину». Для этого после первого открытия чата виджет читает видимые элементы управления текущей страницы.

Если элемент хорошо виден, он выделяется кольцом, рядом — первое предложение ответа. Чат остаётся открытым.
Если элемент перекрыт или посетитель на телефоне, у сообщения появляется кнопка Покажите. Только нажатие показывает элемент.
Любое касание, Escape или прокрутка прочь завершают показ.

Чат никогда не закрывается сам из-за этого.

Чтение страницы и вместе с ним «Покажите» отключаются в коде встраивания:

data-rc-dom-spiegel="false"

Отдельные участки исключаются через data-rc-private или data-rc-ignore. Подробнее: Знания и источники.

Обновлено: 2026-10-25