Quick Actions are buttons that can be added to the chatbot conversation. They are mostly used as conversation starters. You can choose a predefined message when the button is clicked. You can create Quick Actions sets, which are sets of Quick Actions that are each represented as a button.
Rather than text messages, you can also trigger custom behaviors using Snippet Callbacks.
Triggers
Each set is linked to one chatbot (Chatbots) and has a Trigger that decides when its buttons show up:
- On Start: when the conversation starts, as conversation starters.
- On Messages Count: once the conversation reaches the number of messages set in Count.
- On Keywords: when the visitor’s message contains one of the Keywords. Without Repeat, each keyword shows the buttons only once in a conversation.
- Always: after every reply.
- None: the set is kept but never shown.
Each Quick Action has a Type (Message sends a predefined message, Callback runs code, see below), a Label, an optional Icon, a color (Variant) and an optional Class Name for your own CSS.
Snippet Callback
You can run custom code directly on your live website’s frontend when a Quick Action is clicked.
If you were doing this without the Quick Actions add-on, you’d manually declare your shortcut using the “callback” parameter, and pass your JavaScript code as a string: it would execute as soon as the shortcut is triggered.
With the Quick Actions add-on, the proper way is to use Code Engine:
- Create a new snippet in Code Engine.
- Set its type to Callable, since it will be executed “when called”.
- Set the target to JS. This tells Code Engine to declare the function in the browser.
- Make sure the function takes no parameters, since none will be passed when the shortcut is clicked.
The snippet will only appear as selectable in the Quick Actions settings if all of the above is configured correctly.
Now we can save our function and set our Quick Action to “Callback” type. In the Callback section, we are able to choose our snippet.
Go in your browser and open the dev tools; this will let you know if your code is running correctly (assuming you have some console logs) or show you if an error has been found during the execution.
