Prerequisites
Before you begin, make sure you have:- A valid Facebook account
- A Facebook Page you own or administer
- A ChatbotX installation with a publicly accessible URL (required for both the webhook callback and the OAuth callback when connecting your Page)
If you are developing locally, you will need a tunneling tool such as ngrok to expose your local server to the internet.
Step 1: Create a Facebook App
1
Create a new app
Go to the Facebook Developer Portal and click Create App.
2
Enter app details
Enter your App name and contact email, then click Next.
3
Select a use case
When asked for a use case, select Other.
4
Choose app type
For the app type, choose Business.
5
Finish creation
Review your details and click Create App to finish.
6
Get your App ID and App Secret
After creating your app, go to Settings → Basic to find your App ID and App Secret. You will need both values in the next step.
Step 2: Configure Credentials in ChatbotX
A Super Admin must enter the Facebook App credentials in ChatbotX before the integration can work. Complete this step immediately after obtaining your App ID and App Secret.1
Open Integrations
In your ChatbotX installation, navigate to:Then select Messenger.
2
Open Integrations
In your ChatbotX installation, navigate to:Then select Messenger.
3
Enter your App credentials
4
Save
Click Save. Facebook Messenger will now be available as a channel when creating chatbots.After saving, ChatbotX will display a Webhook URL. Copy and keep this URL, you will need it when configuring the webhook in Step 4.
Step 3: Configure Facebook Login
1
Add the Facebook Login product
From your app dashboard, add the Facebook Login product.
2
Configure Facebook Login settings
In the Facebook Login settings:
- Enable Web OAuth Login
- Enable Login with JavaScript SDK
- Add your self-hosted domain to Allowed Domains for the JavaScript SDK
Step 4: Configure the Facebook App
1
Add your app domain
Under Settings → Basic, add your ChatbotX installation domain as an app domain.
2
Add the Messenger product
From the Products section, add Messenger to your app.
3
Configure the webhook
In the Messenger settings, configure the webhook:
- Callback URL: Use the Webhook URL generated by ChatbotX in Step 2 (for example,
https://app.yourdomain.com/integrations/messenger/callback) - Verify Token: Enter the Webhook Verify Token value you configured in the ChatbotX Integrations settings (Step 2)
4
Create a Messenger chatbot in ChatbotX
In ChatbotX, create a Messenger chatbot and select the Facebook Page you want to connect. See Connect Facebook Messenger for step-by-step instructions.
Step 5: Test before Going to Production
Facebook does not forward page messages to your webhook until your app is approved for production. Use the steps below to test your integration first.1
Connect your Facebook Page
In the Messenger settings, click Connect next to the page you selected for your ChatbotX chatbot.
2
Add subscriptions
On the connected page, click Add subscriptions.
3
Select subscription fields
Subscribe to the following fields and save:
4
Send a test message
Send a test message to your page from your personal Facebook account. It should appear in ChatbotX shortly after.
5
Verify locally (if applicable)
If you are running locally, confirm that requests are arriving at the
/bot endpoint in your ngrok terminal.Going to Production
Before your app can receive messages from real users, Facebook must review and approve it.1
Submit for App Review
Follow the Facebook App Review process to get your app verified.
2
Request advanced access
Request advanced access to the permissions below:Required permissions
Optional permissions
API Version
ChatbotX supports Facebook API v25.0. Make sure your app is configured to use this version.- Update the API version under Settings → Advanced in your Facebook app.
- Verify that your webhook subscription version is also set to v25.0 under the app’s Webhooks settings.
