Team Members: Integrating Facebook Chat Widget or Button

Be instantly available to your site visitors with Facebook Chat options!

1-Nov-30-2023-09-51-13-5506-PMFacebook chat! Simply the best way for your business to communicate in real time with your visitors.  

Facebook has developed a Messenger Chat system that makes it easy to integrate chat services on your listing pages.  

Use it as a widget or as a clickable button below your profile image!

  1. Facebook does sometimes make changes to their UI.  Facebook provided instructions for configuring and white-listing chat on your site can be found here.
  2. Use of the Facebook Messenger Chat system requires use of a Facebook business page.  This is not available for connection to your personal Facebook profile.
  3. The Facebook Chat system when in use on your site will appear similarly to the example below.

IMPORTANT NOTES: 


  1. Facebook does sometimes make changes to their UI.  Facebook provided instructions for configuring and white-listing chat on your site can be found here.
  2. Use of the Facebook Messenger Chat system requires use of a Facebook business page.  This is not available for connection to your personal Facebook profile.
  3. The Facebook Chat system when in use on your site will appear similarly to the example below.
2-Nov-30-2023-09-51-23-4958-PM

Obtaining your Facebook Page ID#

Before you can enable this feature as a button or as a widget, you'll need to create an ID to use from your Facebook profile.  To use this feature, you must have a Facebook Business page. 

Step 1:

Whitelist your website domain in your Facebook Business account. 

Go to Facebook Business page and click Settings in the side menu.

3-Nov-30-2023-09-51-31-7029-PM

Select New Page Experience on the left.

4-Nov-30-2023-09-51-39-3767-PM

From here, click Advanced Messaging.

5-Nov-30-2023-09-51-46-3610-PM

Scroll down to the Whitelisted domains section, then insert your site URL and click the Add button.

6-Nov-30-2023-09-51-56-7461-PM

STEP 2: 

Obtain your Page ID from your Facebook profile.  

Navigate to your Facebook Business Page and click the About button.

7-Nov-30-2023-09-52-02-6745-PM

Select Page Transparency and Copy your page ID.

8-Nov-30-2023-09-52-09-4341-PM

Using Facebook Chat as an on page chat widget

Navigate to your AF Editor for your selected team member. 

9-Nov-30-2023-09-52-16-6927-PM

Go to the "Call to Action Tab" in the AF Editor and toggle the button to Enable FB messenger.

10-Nov-30-2023-09-52-24-2673-PM

Now enter the Page ID.

11-Nov-30-2023-09-52-31-4735-PM

Be sure to save your work! 

12-Nov-30-2023-09-52-40-2095-PM

The Facebook chat button will appear in bottom right corner!

13-Nov-30-2023-09-52-46-7992-PM

Further Education: