Create your bot
Basics - Essentials to build a bot
Variables in Landbot - Getting Started
Landbot system Variables
Builder's keyboard shortcuts and mechanics! 🏗
Guidelines 🚀 5 best practices for chatbot design in Landbot 🤖
How to "debug" (troubleshoot) your bot's flow to spot possible errors (for non coders)
Build a bot
Blocks and flow operations
AB Test block (randomize flow)
Default Output Explained
How to open new a URL in another tab (window)
How to set up Multiple Choice questions
Chat with humans
Conditions block II (with Dates, Usage and Agents variables)
How to ask a question based on a variable not being set (empty url params) (v3)
Global Keywords 🌍
Keyword Options 🔑 Assign keywords to buttons (WhatsApp and Facebook)
Jump To block
Get started with the Formulas block
Formulas - Comparison
Formulas Blocks Dashboard
Formulas - Array
Formulas - Date
Formulas - Object
Formulas - Logical
Formulas - Math
Formulas - Regex
Formulas - String
Multi-Question block (Create a Form)
Question: Address block
Question: Autocomplete block
Question: Date block
Question: Email block
Question: File block
Question: Name block
Question: Number block
Question: Phone block
Question: Picture Choice block
Question: Rating block
Question: Scale block
Question: Text block
Question: URL block
Question: Yes/No block
Send a Message block
Send an Email block
Set Variable block
Bricks Workarounds (ready to use)
How to link your Calendly account and prepare your agenda
Age Calculator Brick Workaround
Get a timestamp according to a defined TimeZone
Simple cart v0.2
How to extract data with Google Maps API and Calculate Distances
How to set the flow according to Open/Closed Business Hours
How to avoid visitors selecting specific days of the week
Chats - Livechat and Human Takeover
Design (bots for Web)
Share & Embed
Integrations with Landbot
Get data filtered from Airtable with a Brick- Shop example
20 different ways to GET and filter data from Airtable
How to add/update different field types in Airtable (POST, PATCH & PUT)
How to Create, Update, Retrieve and Delete records in Airtable (POST, PATCH, GET & DELETE)
Get more than 100 items from Airtable
Integrations > Dialogflow Block
How to extract parameters from Dialogflow response with Formulas
Dialogflow Integration Dashboard
Dialogflow - How to get JSON Key
External API REST
Dynamic Data (Arrays)
How to TEST your Http Request (Webhook block)
Webhook Blocks Dashboard
How to POST, GET (and more) with Landbot
Google Cloud Functions
Google Sheets (Insert, Update and Get data)
How to use Google Sheets to create a simple verification system for returning visitors
How to Upload Document & store link
Add a timestamp to a Google Spreadsheet
How to give unique Coupon Codes (with Google Spreadsheets)
Google Sheets Integration Dashboard
How to insert a new row with data and formulas in Google Sheets
How to use Google Spreadsheet as a Content Management System for your bot
Google Tag Manager
GTM - How Track Google Analytics Events in Landbot with Google Tag Manager
Landbot in your web with Google Tag Manager
How to upload a file to Google Drive using Integromat
Integromat Automation Integration
How to extract data from an external source with Integromat and use it in Landbot
Account Settings and Billing
Teammates - Add extra agents (seats) to your Account
Subscription Section (v3)
Payment FAQ 💳
Fair Use Policy
Privacy and Security
Landbot Channels - Whatsapp, Messenger and APIChat
The Ultimate WhatsApp Guide 🇬🇧
Facebook Business Verification - Best Practices 🇬🇧
Parent Bot/Linked Bot (WhatsApp) 🤖
WhatsApp Testing Section 🧪
Opt-in, Templates and Campaigns
What is the Opt-in process? ✍️
How to get Opt-ins (Subscribers) for your WhatsApp 🚀
WhatsApp Opt In Template ✅
WhatsApp Campaigns 💌
HSM Templates for Whatsapp 💬
WhatsApp Bot Creation
Creating bots for WhatsApp 🙌
How to preview WhatsApp and Messenger bots
Types of content you can use in WhatsApp 🖼
How to capture and use the first user's interaction (input) in Whatsapp/Messenger
How to direct a user through a different bot flow on their second visit (for WhatsApp/Messenger)
Unblock user of error message loop and redirect to restart bot
The Facebook Messenger Ultimate Guide
Types of content you can use in Messenger bots 🖼
How to Preview a Messenger bot
API Chat (for Developers)
How to create an API chat bot and set up the Hook Url
Building a Slack APP Bot with Landbot APIChat and Node JS
Build a Telegram Bot with Landbot APIChat and Node JS
Metrics and Data Management
How to export the data from your bots
...❶, 🔟, 💯 ways to analyze your data 📈
Bot's Analyze Section
For Developers & Designers
CSS and Design Customizations
Open LiveChat bot as soon as page loads (3 ways)
How to launch a Landbot by clicking a button
Modifying Embed Size
How to embed a pop bot with automatic load and button
How to trigger events and/or pass values from Landbot to the container site
Change Landbot custom CSS dynamically from parent page onload
Customizing the bubble/widget (Livechat & Popup)
How to use Google Fonts in Landbot
Hide time stamp (under avatar)
Detect if a visitor is on Mobile/Tablet or Desktop
Landbot v3 - Web CSS - RTL
How to remove Landbot branding
How to hide elements in the Bot design
Customized display in the bot
Add a Chart (with Chart JS library) in your Landbot
How to display an HTML Table and a List in Landbot v3 web
Pop up modal to embed third party elements
Progress Bar Workaround
Different ways to embed Videos in Landbot
How to embed a .gif file inside a message
Display video and hide button to continue until video has ended
Components CSS Library
Components CSS Library Index
Background Class CSS
Identify Blocks CSS
Buttons Class CSS
Header Class CSS
Media Class CSS
Message Bubble Class CSS
Miscellaneous Classes CSS
Get started guide for CSS Design in Landbot
CSS Customization Examples: "Back to School" Theme
CSS Customization Example: "Lead Gen"
CSS Customization Examples: "Minimalist" Theme
Workarounds and How To's
Building Tips & How to's
How to add a Click-to-Call/Email/WhatsApp button
Send variables from your page (the container site) to your embedded Landbot
How to build an event registration Landbot (to be used in one screen by many attendees)
How to redirect user to another url in your site with Livechat open to continue conversation
How to let user select a time of booking (with a minimum 45 minutes notice)
Get Index Array selection Whatsapp
Get the array's index of the user selection and extract information from array
How to encode a variable
How to calculate the number of days between two selected dates
How to access keys and values, in object variables
How to redirect visitors to a URL (web only)
Workarounds & Codes
Proactive message on mobile
Different ways to format numbers with JS
How to not display Proactive Message to repeating Visitors
Random 4 digits Number
Set the flow depending on the url path (for embedded landbots)
Trigger a Global Keyword with JS (web v3)
Generate a URL that has variables from user answers
How to set up questions with a countdown
Introducing a new Landbot Community 🎉
How to migrate your bot from Landbot v2 (legacy) to Landbot v3
Introducing Landbot 3! 💬
Migrate your web bot from the Old Builder to the New Builder (Landbot 2 and 3)
Landbot Affiliate Program
Security Update - HTTPS URLs only
NGOs and Educational Organizations Discounts
Table of Contents
Updated by Rafaela Basso
Group blocks into Bricks to create a whole different experience in your bot!
What are Bricks?
In the beginning, we only had blocks to create our bot flows 👇
But now we can create groups of blocks that will considerably reduce the size of your flows and keep it organized... a Brick 🤟
So, the best part about Bricks is how flexible they are...
- 📂 Bricks are like Folders: You can add a number of blocks (o Bricks within Bricks) to organize your bot flow.
- 🔌 Bricks are like Plugins: Plugins, that you add to your bot for new functionalities without the need of building it from scratch, these are our Bricks Workarounds.
- 🏃♂️ Bricks are like Shortcuts: Don't repeat again the same blocks, just save them inside a Brick, and add it to your bot whenever you need it!
But for now you can do it only within the bots of your account.
How to create a Brick from scratch
- To create a new Brick before adding blocks to it, you have two different options:
- Clicking on the Brick icon within the chatbot builder and selecting Create a brick:
- Dragging and dropping the green dot of any block and selecting Brick as the block type:
- Clicking on the Brick icon within the chatbot builder and selecting Create a brick:
- Now, you'll see the just created Brick in the canvas. If you hover it, you will see a button to Edit this brick. Click there to start editing:
Bricks basic set up
Once you enter the Brick editor, you will see that it has two main elements:
- First Message: Click on the signed space to create the first message ("Click to create the first message of this Brick"). The Brick has to start from that point, so you must click on the indicated space to add a new block.
The Brick must start in the first message, but you can connect any block after that.
- Output: You must add an "exit" so that the path leaving the flow inside the Brick can be connected to the main flow. Each exit point of the Brick is called an Output.
Once you've added the blocks needed, connect the last block to the Output.
- Add more Outputs: You can add extra Outputs if you have more than one flow inside the same Brick, by clicking on Add another output.
This is how it will look like inside the Brick:
- Give a name to each Output: You can change the name of the Output, to make it easier to identify it from the Main flow:
- Back to the bot: Once you're done, click on Back to bot on the top-right corner to move back to the original flow:
As you can see, it has three Outputs created. Remember to connect every Output to a block in the main flow to make sure the bot flow continues.
How to create a Brick from a Group of blocks
It is also possible to create a Brick out of a group of blocks we already have in the bot flow, by selecting these blocks adding them to a Brick.
You just have to select them and click on the button Create Brick, which appears on the bar on the top of your bot when you select blocks.
But you can copy the blocks from inside the Brick and Paste them in the main bot flow to do this.
Select, Unselect, or Delete a Group of blocks
How to Select a group of blocks
You can select more than one block, just by selecting it in the top left corner.
How to unselect a group of blocks
In case we are done with the selection, we just need to click on NONE.
Delete a group of Blocks
In case we need to delete a group of Blocks, just select as many as you want to and click Delete on the top bar.
Copy and Paste a group of blocks
Copy a group of Blocks
This is handy when you want to create another flow or repeat many blocks at once.
Paste a group of Blocks
You can paste previously copied blocks in two ways
- From the Top menu: just click on Paste and the block will be pasted on the right side of the flow.
- Right button in Mouse/Trackpad: Instead of using the top bar, you can just click with the right button of your mouse/trackpad to see the option to copy and paste.
Create a Brick from selected blocks
If you are not sure how to select a group of blocks, please see the steps above 👆
This is the quickest way to create a brick, without the need to start from scratch.
However, you have to be aware of 2 things:
- The connections (arrows) coming to the blocks will disappear, and this action cannot be undone, so you will need to reconnect the Brick.
- Once the Brick is created you need to create a start message from scratch. Create the first block by clicking on the First message of the Brick, and connect this first message to the rest of the flow from the Brick.
If you want to add more information to your Bricks to help with your organization, you can do that in the Bricks Settings.
To do so, when inside the Brick you just have to click on Brick Settings, where you can add a:
- Name - Under "Edit the brick name" you'll be able to assign a name to your brick to make it easier to find it later.
- Description - Below "Add a short text to describe your brick" you can add a little description that will help you - and others - find out what this brick is about.
- Category - As it says, here you can assign categories to the brick.
Don't forget to click on Save Changes to save the new settings.
We have created some Workarounds and included them in Bricks, so that you can just import the Brick Workaround into your bot and adapt it to your case.
You can check out all the information about them in this article 🚀
It is also possible to create a Template out of a Brick you have created, and import this Brick Template into your bot or other bots from your account.
Please check out this article to see how to do this.