Кнопки для Viber
Компонент Кнопки для Viber отправляет пользователю текст и прикрепленные к клавиатуре кнопки.
- Функции →
- Настройка компонента →
- Настройка Кнопок для Viber как Кнопок с подсказками→
- Как поменять цвет фона кнопки →
- Как поменять цвет шрифта на кнопке →
- Как добавить изображение на фон кнопки →
Внешний вид кнопок
Функции
1. Переход на экраны.
2. Переход на внешний URL
3. Переход на экраны в связке с компонентом «Развилка»
Настройка компонента
1. Добавьте на экран компонент Кнопки для Viber.
2. Заполните поле с текстом — этот текст будет над кнопками.
3. Добавьте нужное количество кнопок, которые будут располагаться одна под другой. Для этого нажмите на кнопку Добавить кнопку.
4. В поле Текст на кнопке впишите текст кнопки. Если отметить Скрывать текст, кнопка придет в бот без текста, но в любом случае Текст на кнопке должен быть заполнен.
5. Для того, чтобы добавить несколько кнопок в ряд, нужно нажать на Добавить кнопку в этот ряд.
Кнопок в ряду может быть не больше 6. В случае максимального числа кнопок (6 штук), ширина всех кнопок должна быть 1. Для 2 кнопок в одном ряду ширина должна быть 3. Для 3 кнопок в одном ряду ширина должна быть 2. Если кнопка в ряду одна, ширина должна быть максимальной — 6 пунктов. Если ширина в настройках кнопки будет меньше, то размер кнопки в мессенджере не будет соответствовать ширине строки ввода.
В режиме Кнопок с подсказками (когда кнопки прикреплены к клавиатуре) платформа поддерживает не более 24 рядов кнопок Viber включительно, по 1 кнопке в ряду. Если кнопки прикреплены к сообщению, платформа поддерживает не более 7 рядов кнопок Viber включительно, максимум по 6 кнопок в ряду (размер одной кнопки 1х1). Итого — не более 42 кнопок.
6. Если в настройках отметить Включить режим кнопок с подсказками, то для перехода на другие экраны нужно использовать компонент Развилка.
7. Поместите компонент Развилка под компонент Кнопки для Viber. В настройках Развилки в Значении цели впишите текст кнопки, а в поле Переход выберите из выпадающего списка нужный экран.
8. Если вместо нажатия кнопки пользователь что-то напишет боту, можно настроить Цель по умолчанию в компоненте Развилка. Тогда пользователю снова придет этот же экран с кнопками. Для этого в настройках напишите текст, который будет отправлен пользователю. и укажите этот же экран (или при необходимости другой) для перехода.
Настройка Кнопок для Viber как Кнопок с подсказками
Кнопка обязательно должна переводить либо на экран, либо на внешний URL.
1. Отключите функцию Включить режим кнопок с подсказками.
2. В настройках компонента Кнопки для Viber выберите из выпадающего списка нужный экран для перехода по кнопке.
3. Для перехода на внешний сервис отметьте Переход на внешний URL и разместите ссылку для перехода на внешний ресурс в поле Переход по URL.
4. Менять отображение кнопок в мессенджере можно с помощью функции Прикрепить кнопки к сообщению.
Так выглядят кнопки, не прикрепленные к сообщению. В примере открыто приложение Viber на компьютере и выключена функция Прикрепить кнопки к сообщению.
Так выглядят кнопки, прикрепленные к сообщению. В примере открыто приложение Viber на компьютере и включена функция Прикрепить кнопки к сообщению.
В приложении Viber на смартфоне прикрепленные кнопки будут отображаться над строкой ввода, не прикрепленные — под строкой ввода.
Прикрепленные кнопки:
Не прикрепленные кнопки:
С включенной функцией Прикрепить кнопки к сообщению можно отправлять пользователю кнопки без текста.
Как поменять цвет фона кнопки
Цвет кнопки поменяется, если добавить цветовой код в поле Цвет фона. Это можно сделать в настройках компонента.
Коды цветов можно найти в открытых источниках, например тут.
Как поменять цвет шрифта на кнопке
Цвет шрифта на кнопке поменяется, если в Текст на кнопке будет добавлен цветовой код по образцу:
<font color="#9966CC">Фиолетовый текст на кнопке </font>
Коды цветов можно скопировать отсюда.
На кнопках в чате Viber будет отображаться заданный цвет шрифта:
Как добавить изображение на фон кнопки
Изображение добавляется кнопкой Выбрать файл в настройках кнопки. После нажатия на кнопку откроется выбор любого файла из сохраненных на компьютере.
Также, на фон кнопки можно добавлять изображение по ссылке. Ссылка обязательно должна оканчиваться на png, jpg, jpeg.
В боте кнопка с изображением будет выглядеть так:
