Динамические кнопки

Динамические кнопки позволяют формировать клавиатуру не вручную в конструкторе, а из значения переменной. Это удобно, когда список кнопок заранее неизвестен и должен зависеть от данных подписчика, интеграции, вебхука или внешнего сервиса.

С помощью динамических кнопок можно:

показать персональные варианты ответа;
вывести доступные даты или время записи;
сформировать список товаров, услуг или тарифов;
показать кнопки, полученные из внешней системы;
сохранить выбранный подписчиком вариант и использовать его дальше в боте.

Как добавить динамические кнопки

Добавьте пользовательскую переменную или глобальную переменную в формате JSON
Откройте нужный шаг "Сообщения" в чат-боте.
Добавьте кнопку.
Выберите тип кнопки "Динамический блок кнопок".
Выберите переменную, из которой нужно взять список кнопок:
- переменную подписчика;
- глобальную переменную.
Нажать кнопку "Добавить"
Сохраните шаг.

При отправке сообщения Senler сформирует из него клавиатуру.

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

Формат значения переменной

В переменной должен быть сохранён валидный JSON-массив.

Внешний массив описывает всю клавиатуру. Каждый вложенный массив - отдельную строку кнопок. Каждый объект внутри строки - одну кнопку.

Пример значения переменной:

[[{"text":"Вариант A","color":"blue"},{"text":"Вариант B","color":"green"}],[{"text":"Одна в строке","color":"red"}]]

В результате будет сформировано две строки кнопок:

JSON можно вставить в поле Значение переменной одной строкой или передать как строку через API.

Поля кнопки

Поле	Описание
`text`	Текст кнопки. Обязательное поле. Если значение пустое, кнопка не отображается.
`type`	Тип кнопки. Если тип не указан, используется `text`.
`color`	Цвет кнопки.
`url`	Ссылка для кнопок с типом `url` или `open_link`. Для этих типов поле обязательно.

Типы кнопок

Во ВКонтакте в динамических кнопках поддерживаются следующие типы:

Тип	Описание
`text`	Обычная текстовая кнопка. При нажатии подписчик отправляет текст кнопки, и бот может перейти к следующему шагу сценария.
`url`	Кнопка со ссылкой. При нажатии открывается ссылка из поля `url`.
`open_link`	Кнопка со ссылкой. При нажатии открывается ссылка из поля `url`.
`location`	Кнопка для передачи местоположения подписчика.

Если указан неизвестный type, кнопка будет обработана как обычная текстовая кнопка.

Примеры JSON

Текстовые кнопки

[[{"text":"Вариант A","color":"blue"},{"text":"Вариант B","color":"green"}],[{"text":"Одна в строке","color":"red"}]]

Текстовая кнопка и кнопки со ссылкой

[[{"text":"Написать","type":"text","color":"primary"},{"text":"Сайт","type":"url","url":"https://example.com","color":"white"}],[{"text":"Документация","type":"open_link","url":"https://senler.ru","color":"default"}]]

Для ссылок можно использовать url или open_link. В обоих случаях нужно указать поле url.

Несколько рядов кнопок

[[{"text":"Ряд 1 — A"},{"text":"Ряд 1 — B"}],[{"text":"Ряд 2"}],[{"text":"Ряд 3 — ссылка","type":"url","url":"https://example.org"}]]

Ссылка и кнопка местоположения

[[{"text":"Открыть","type":"open_link","url":"https://vk.com","color":"negative"}],[{"text":"Где я","type":"location","color":"positive"}]]

Ограничения

Значение переменной должно быть валидным JSON-массивом массивов кнопок.
Внутри строк должны быть только объекты кнопок.
У каждой кнопки должен быть непустой text.
Для кнопок url и open_link обязательно поле url с корректной ссылкой.
В одной строке может быть до 5 кнопок.
Всего можно передать до 10 строк кнопок.
Динамический блок кнопок нельзя размещать в одной строке с другими кнопками.
Обычные кнопки в других строках этого же сообщения работают как раньше.

Сохранение результата нажатия в переменную

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

Это удобно, когда бот должен:

запомнить выбранную дату или время;
сохранить выбранный вариант ответа;
использовать ответ в условии;
подставить ответ в следующее сообщение;
передать выбранное значение во внешний сервис.

Пример сценария:

В переменную сохранён список доступных дат:

[[{"text":"12 июня, 15:00"},{"text":"12 июня, 16:00"}],[{"text":"13 июня, 11:00"}]]

В шаге бота добавлен Динамический блок кнопок, который берёт кнопки из этой переменной.
Подписчик нажимает кнопку 12 июня, 15:00.
Ответ подписчика сохраняется в выбранную переменную, например selected_time.
В следующих шагах эту переменную можно использовать в сообщении, условии или интеграции.

Например:

Вы выбрали: {%selected_time%}

Почему динамические кнопки могут не работать

Динамические кнопки могут не появиться, отобразиться частично или не отправиться подписчику, если значение переменной заполнено некорректно.

Необходимо проверить, следующие параметры:

в переменной указан JSON, а не обычный текст;
переменная не пустая;
JSON записан без ошибок в скобках, кавычках и запятых;
значение является массивом массивов кнопок;
внутри строк находятся только объекты кнопок;
в одной строке не больше 5 кнопок;
у каждой кнопки заполнено поле text;
для кнопок url и open_link указано поле url;
ссылка в поле url указана полностью, например https://example.com.

Если кнопки не отображаются, сначала проверьте значение переменной. Оно должно быть валидным JSON, где каждая строка кнопок - отдельный массив, а каждая кнопка - объект с параметрами.