Persistent Menu
By adding the following lines of code in the webchat's object, you can enable a persistent menu. You can redefine the label for closing the persistent menu with closeLabel
. Default text is 'Cancel'
.
Example:

The persistent menu accepts the same properties as Botonic Buttons, e.g.: payload
and url
.
To darken the webchat in the background and focus on the persistent menu only, you can use a Dark Background. It can be defined under the properties theme.darkBackgroundMenu
or theme.menu.darkBackground
.

src/webchat/index.js
Button
You can customize the persistent menu button with the theme.customMenuButton
or theme.userInput.menuButton.custom
properties.
Example:

To do so:
- Add an image for the button in the Assets folder.
- Create a
custom-menu-button.js
file. - Customize the button as shown in the example below.
src/webchat/custom-menu-button.js
Menu
In order to have your entire persistent menu customized, first you will need to create a button for each of the options. To do so, you can create a component like this one:
src/webchat/custom-persistent-menu-button.js
Then to customize the persistent menu, you must use the theme.userInput.menu.custom
or theme.customPersistentMenu
property.
To do so:
- Create a
custom-persistent-menu.js
file. - Customize the menu as shown in the example below.
Example:
