Table of Contents

Buttons block

Rafaela Basso Updated by Rafaela Basso

For Landbot (Web)

If there's something that makes Landbot special it is how you can use Buttons to create efficient, engaging and easy-to-follow experiences.

Buttons are elements your users can click to move on to the next block in the conversation.

Buttons Setup

To create a Buttons type block, drag and drop the green dot and select Buttons:

Then, you can add more messages to the question by clicking on the "+" symbol and create buttons by typing in anything within the pink rectangles.

Press Enter to add more buttons, and drag them to change their position.

If you click on the three dots of the top right of the block you'll open the full Buttons block configurator, which looks like this:

You'll see a bunch of things to configure here, but let's go step by step!

Advanced Buttons Editor: Here you can add content (cogwheel), re-arrange (dots columned) and delete (bin icon) buttons. Click on the cogwheel to to configure each button:

For more information, please check our Academy video here [0:15], you must be registered in our free Academy 👩‍💻

Button Style

Choose what type of media you want to add to your buttons: plain text, an icon, an emoji or an image.

Final view in Landbot 2:

(a) plain text

(b) Icon

(c) Emoji

(d) Image

Final view in Landbot 3:

(a) Plain text

(b) Icon

(c) Emoji

(d) Image

For more information, please check our Academy video here [2:28], you must be registered in our free Academy 👩‍💻

If you want to redirect your users to an external URL whenever they click a button, enter it here! Check out this article to see more about how this feature works.

Final View in Landbot 2:

Final view in Landbot 3:

Buttons options (advanced):
For more information, please check our Academy video here [1:49], you must be registered in our free Academy 👩‍💻

Buttons alignment

When you have several buttons, you may want to change their alignment from horizontal to vertical. Try the style that looks better !

Final view in Landbot 2:

(a) Horizontal

(b) Vertical

Final view in Landbot 3:

(a) Horizontal

(b) Vertical

For more information, please check our Academy video here [2:04], you must be registered in our free Academy 👩‍💻

Searchable options

When you provide +10 options, turn this feature on so users can start typing and filter among all the button showed!

Final view in Landbot 2:

Final View in Landbot 3:

For more information, please check our Academy video here [0:30], you must be registered in our free Academy 👩‍💻

Multiple choices

Let your users select more than one option by clicking on the toggle. Please see this article for more information on how to use the Multiple Choice option in your bot, and how to set it up correctly.

Final view in Landbot 2:

Final view in Landbot 3:

For more information, please check our Academy video here [1:18], you must be registered in our free Academy 👩‍💻

Save answers in the field

As in any other block, the answer (click[s]) will be stored in a variable. Set it up here!

For more information, please check our Academy video here [2:40], you must be registered in our free Academy 👩‍💻

For WhatsApp

For a list of all the blocks and current functionalities with WhatsApp bots, please check here

Since WhatsApp doesn't allow buttons, those will be displayed as a numbered list of choices, so the valid answer to this type of questions will be typing the number corresponding to your choice.

For Facebook Messenger

NOTE: For a list of all the types of content you can use in Messenger bots, please see this article.

Limitations Buttons block in the Messenger bots:

  • The Buttons will only be displayed horizontally.
  • The Buttons block in Messenger bots are not compatible with Searchable options and Multiple Choices.
  • The Buttons block in Messenger is only compatible in the Text Button format.
    That means, Icons, Emojis, Images and Hiperlinks are not compatible to Messenger bots.

How it looks in the builder:

How it looks in Messenger:

  • Despite the restriction mentioned in the item above, it possible to Manually insert emojis in the buttons, instead of using the option built in the Buttons block.
    To insert emojis, there are two options:

1. In case you are using a MAC device you can use the native emoji picker from Apple. To activate it you need to use the combination of keyboard: Control + Cmd + Space 🚀​

2. In case you are using a non MAC device on a Chrome Browser you can install a virtual emoji keyboard in Chrome store. Here is a good one. With the emoji keyboard you can introduce any emoji you want into your text. 

Please also keep in mind that depending on the device your user use the emoji you choose could appear differently 😅

This is how it looks in the builder:

How it looks in Messenger

  • The Buttons block in Messenger bots has a limitation of up to 11 buttons (default button included).
    If not all the buttons fit on the screen, you can click on the arrow pointing to the right to see more options.
Warning: If you add more than 11 buttons to the Buttons block, it will not work.

The block will not be triggered, and the bot will stop at this point of the flow.

This is how it looks in the builder:

And this is how it looks Messenger:

  • The Buttons block has a limitation of 20 characters per button. If the text inside the button exceeds this limitation, it will be cut off.

How it looks in the builder:

(within 20 characters)

(More than 20 characters)

How it looks in Messenger:

(within 20 characters)

(More than 20 characters)

Tip: Always connect the Default button to the next block. Please check out this article to see how to use the Default output correctly!

If the user does not choose a button, and types anything instead, the bot will stop.

Connecting the Default button will prevent this from happening, by allowing the bot to continue. You can even send the user back to that block, if you prefer.


How did we do?

Send a Message block - Simple Message

Welcome Message

Contact