Step-by-Step Instructions for Building a Facebook Messenger Bot without Coding

Mehfuz Hossain
Smartloop
4 min readJul 31, 2017

--

Facebook Messenger is quickly becoming the de-facto home of chatbots. More than 300K bots already published on Facebook. Businesses are quickly moving to this platform to increase engagement and benefit from the social aspects of it making it topmost destination for bot developers.

In this post, I’ll show you how to build your own Facebook Messenger Bot. I’m going to use Smartloop for this to automate some of the things that I would otherwise have to do manually making my development flow straight forward.

Step #1 : Create the Bot

Provided you have created a free account with smartloop. Create a Facebook bot by clicking on the “ + ” thumbnail.

This will bring up the wizard to create the bot.

Create a new Bot dialog

Enter the bot title, select a platform. In this case, “facebook” and choose a language which is “English” for this post.

Press “Submit”

This will create the bot and take you to the builder once completed.

Smartloop Chatbot Builder

This will create the basic building blocks for you to give you an head-start. Next, modify the start block to something meaningful to your project this will be the first message a user will see when they first press “Get Started” in your bot.

Step #2: Create a Facebook Page

If you do not have a Facebook page then you need to Create a Facebook Page. This Facebook page is the identity of your bot including the icon and cover that will be shown as someone starts chatting with your bot.

If you are just creating the page for testing the bot, then you can skip most of the steps and you can always update it later as you make your bot public.

Step #3: Create a Facebook App

Because, I am using a tool this actually takes care of the app creation, token generation and manually configuring your webhook events.

You will just need to go to the publish page and connect to the page that you have just created by clicking the connect button (Step #8: Connect your Bot to the Facebook Page).

Step#4: Build the Bot Flow

In this step, we will create a Chuck Norris bot. First, modify the greetings message with a confirmation following a user input (either text input or quick reply) as shown below:

Based on the input ether take the user to the main or alternate flow. To do so first capture the user input:

https://docs.recime.io/builditng-a-bot.html#user-input

Next, send the user to an appropriate block of your bot based on the input:

https://docs.recime.io/building-a-bot.html#go-to-block

Here in this case, create a block named “jokes” and send the user to it based on the input value.

Inside the block, use JSON API to pull a random joke and store it in a local variable in the following way (The concept of JSON API is pretty much standard among platforms):

https://docs.recime.io/developer-features.html#json-api

Send the result value using a text element in the following way:

For alternate flow, give out a specific instruction on how to trigger the “jokes” block.

Step #8: Connect your Bot to the Facebook Page

Go to the publish tab by clicking the configure icon from the navigation page and connect to your page by clicking on the “+ Connect” button.

https://docs.recime.io/publish.html#facebook

Step #9: Test your Bot

Now at this point, your bot is successfully configured and connected to your page. Go to your page, click on “+ Add a Button” and choose Contact us/ Send a Message. In the next step, as where to send the users, choose “Facebook Messenger” to respond.

Once the button has been added, hover over it and select “Test Button”. this will bring up the bot and click on “Get started” to chat with the bot.

If you have completed the last step then you are have successfully created and published your first Facebook bot. If this article was helpful, please don’t forget to recommend in order to help others find it and learn to create their own Facebook bot.

--

--