Integrate with Facebook Messenger so your users can chat with your inGenious AI chatbot through Facebook Messenger. Make sure you have created:
- Your inGenious AI chatbot.
- The Facebook app and Facebook page you’ll connect the chatbot to.
Facebook Admin required
You’ll need to be an Admin of the Facebook app and page to complete the integration steps.
- Add the Facebook Page Access Token to inGenious AI.
- Add the inGenious AI Callback URL and token to your Facebook App.
- Add the Facebook App ID and App Secret to inGenious AI.
- Configure the primary and secondary receivers for the Facebook Page.
- Configure your Greetings Message and Persistent Menu in inGenious AI.
- Whitelist any domains your chatbot uses in scripts or webviews in inGenious AI.
- Select any permissions your chatbot needs from Facebook Messenger, and enable handover or a custom avatar.
- Save your integration settings.
Let’s look at each of those steps in detail.
Before you start…
This process involves some back-and-forth between your inGenious AI chatbot settings and your Facebook Developer page. It’s much easier if you get yourself set up first:
- Open inGenious AI
- Turn on the Facebook API integration for your chatbot:
- Open the chatbot you want to integrate and click Settings.
- Click Integrations.
- Toggle the Facebook Messenger Integration on.
- In another tab, open your Facebook Developer page and select the App you want to integrate.
Open Notepad or another text editor so you can copy multiple things at once.
For more help setting up your Facebook App, see the Facebook Developer Documentation.
Step 1: Add the Facebook Page Access Token to inGenious AI
To add the Page Access Token:
- In your Facebook Developer page, click the arrow next to Messenger in the left menu.
- Click Settings.
- Scroll down to Access Tokens.
- Select the Facebook Page you want to integrate.
A Page Access Token is created.
Note: Make sure you’re an Admin for the page you want to integrate. Only pages you’re an Admin for are displayed in the list.
- Click the access token to copy it to your clipboard.
- In inGenious AI, paste the access token you copied into the Page Access Token field.
Step 2: Add the inGenious AI Callback URL and token to your Facebook App
To add the Callback URL and token to your Facebook App:
- In inGenious AI, copy the Callback URL and Callback URL Verify Token to Notepad.
- In your Facebook Developer page, click Webhooks in the left menu.
- Click Edit Subscription.
- Paste the Callback URL and Verify Token.
- Click Verify and Save.
Step 3: Add the Facebook App ID and App Secret to inGenious AI
To add the App ID and App Secret:
- In your Facebook Developer page, click Settings in the left menu.
- Click Basic.
- Copy the App ID and App Secret to Notepad.
- In inGenious AI, paste in the App ID and App Secret.
Step 4: Configure the primary and secondary receivers for the Facebook page
Configure the primary and secondary receivers for the Facebook page to allow your chatbot to hand over control of the chat to a person or another service.
- In your Facebook Page, click Settings in the left menu.
- Click Advanced Messaging.
Your inGenious AI chatbot should appear under Connected Apps.
- Under App Settings, click Configure.
- Select your inGenious AI chatbot as the Primary receiver.
- For the Secondary Reciever, select either:
- Page Inbox to allow a person to chat using the Facebook Page inbox.
- Another service to send the chat to.
- Click the x in the top right to close the window. Your changes are automatically saved.
Step 5: Configure your Greetings Message and Persistent Menu in inGenious AI
The Greetings Message is sent when users interact with your chatbot on Facebook for the first time. Write a short message to welcome a new user and tell them how to get started.
The Persistent Menu is displayed at the bottom of the Facebook chat window. You can create menu buttons that open a website or send the chatbot to a specific passage. Click a menu button to edit the text, change what it does, or delete it.
If you want to add emojis to your message or buttons, you can search for the emoji you want to use on https://emojifinder.com and paste it in.
Step 6: Whitelist script and webview domains in inGenious AI
If your scripts or webviews call any domains outside of the provided libraries, you need to add them to Facebook’s whitelist so Facebook will allow the call.
Paste each domain your chatbot will use on a new line.
Step 7: Select permissions, avatar and handover
Enable any permissions, handover or custom avatar your chatbot needs.
If your chatbot requires access to a user's information on Facebook, such as their timezone, gender or language, toggle these permissions on. The user will be prompted to grant these permissions before they can talk to your chatbot on Facebook Messenger.
If you want a person or another service to be able to take over the chat and talk to the user, toggle Enable Handover on.
For more information on allowing handover in Facebook Messenger, see the Handover Protocol in the Facebook Developer Platform Documentation
If you want to present a custom avatar in Facebook Messenger, toggle Customise Chatbot Avatar on, and:
- Select the image you want to use either by URL or your chatbot media library.
- Type the profile name you want displayed in Facebook Messenger.
Step 8: Save your settings
When you have finished, scroll down the page and click Save. Your chatbot is now integrated with Facebook.