В Tidio вы можете изменить положение виджета между правой и левой частью интерфейса администратора Tidio. Если вы хотите переместить и отобразить виджет немного выше или ниже, это можно сделать, применив собственный код CSS, который мы объясняем в этой статье.
Обратите внимание, что для разных версий вашего виджета в Tidio предусмотрены разные варианты: версия для ПК, мобильная версия и боковая панель.
В этой статье вы узнаете:
Горизонтальное положение (слева/справа)
Вы можете изменить левое/правое положение виджета чата на рабочем столе, перейдя в раздел настроек.> живой чат> Внешний вид в интерфейсе администратора Tidio, где вы можете найти опцию размещения виджета (на вкладке «Внешний вид» ):

Совет: Если вы хотите, чтобы виджет появлялся на определенной странице только в определенное время дня, вы можете объединить изменение позиции со сценарием JavaScript, который будет проверять время и соответствующим образом обновлять CSS.
Вертикальное положение (высокое/низкое)
Если вы хотите переместить значки чата немного выше или ниже, потребуется реализация собственного CSS-кода. Применение кода позволит вам переместить виджет чата на заданное количество пробелов.
Если вы не уверены, где разместить код или получить доступ к его источнику, мы рекомендуем обратиться к своему веб-разработчику, чтобы помочь вам с реализацией.
Как использовать CSS-код
Чтобы переместить виджет, добавьте код, показанный ниже, в заголовок сайта, прямо над тегом.< /голова> кронштейн
Первая строка #tidio-chat iframe активирует размещение виджета как на настольных, так и на мобильных устройствах.
Вторая и третья строки позволяют перемещать виджет только на мобильных устройствах (обходят первое правило), а также позволяют указать предполагаемый размер экрана. Если вы хотите переместить виджет только для мобильных устройств, измените только эти строки — или посмотрите код выше — если вы хотите переместить чат только на рабочий стол.
Значение смещения представлено ‘px’ .
Направление движения определяется первым значением в скобках { }:
top — означает «далеко от вершины»
дно — означает «далеко от дна»
слева — означает «далеко от левой стороны»
правый – означает «далеко от правой стороны»
Использование отрицательного значения пикселей (например, установка его на -100 пикселей) приведет к перемещению его в противоположном направлении, поэтому, если вы введете в коде дно: -100 пикселей, чат сместится на 100 пикселей вниз на сайте.
Практический пример: если у вас есть рекламный баннер вверху сайта, вы можете с помощью CSS переместить виджет вниз, чтобы он не скрывал баннер.
Дополнительная настройка
Помимо изменения местоположения виджета, есть и другие варианты настройки виджета Tidio. Эти варианты включают в себя:
- Изменить цвета: вы можете изменить цвета виджета, чтобы они соответствовали общему дизайну вашего веб-сайта.
- Изменение размера: вы можете изменить размер виджета в соответствии с местом его размещения.
- Добавление логотипа. Вы можете добавить в виджет свой личный логотип, чтобы усилить свой бренд.
- Настройка приветственных сообщений: вы можете настроить собственные приветственные сообщения, которые будут получать пользователи при открытии виджета.
изменение цвета
Чтобы изменить цвета виджета, перейдите в раздел «Настройки» .> живой чат> Отображается в интерфейсе администратора. Там вы можете выбрать разные цвета фона, текста и кнопок виджета.
Изменить размер
Изменение размера виджета также производится в этом же разделе. Вы можете установить высоту и ширину виджета в соответствии с тем, где вы хотите его разместить.
Добавление логотипа
Чтобы добавить логотип, найдите опцию добавления логотипа в интерфейсе администратора Tidio. Загрузите свой логотип и сохраните изменения.
Настройка приветственных сообщений
Чтобы настроить приветственные сообщения, перейдите в раздел Настройки .> живой чат> Уведомления в интерфейсе администратора. Там вы можете добавлять персонализированные сообщения, которые будут получать пользователи.
Краткое содержание
Изменение положения и настройка виджета Tidio — это простой процесс, который может улучшить взаимодействие с пользователем на вашем веб-сайте. Следуя инструкциям в этой статье, вы сможете настроить виджет в соответствии со своими потребностями и потребностями ваших пользователей.
Если у вас есть дополнительные вопросы или вам нужна дополнительная помощь, не стесняйтесь обращаться в службу поддержки Tidio или к профессиональному веб-разработчику.