Customer Chat SDK

https://developers.facebook.com/docs/messenger-platform/discovery/customer-chat-plugin/sdk/


The Customer Chat JavaScript SDK allows you to control certain behaviors of the customer chat plugin such as opening and closing the dialog. These controls are dynamic and can be triggered without a page refresh.

Contents

Including the SDK

To use the Customer Chat SDK, you have to request Facebook JavaScript SDK via //connect.facebook.net/en_US/sdk/xfbml.customerchat.js.
If you have already included Facebook JavaScript SDK on your page, don't include it twice. Simply replace js.src with the URL above.
(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/sdk/xfbml.customerchat.js";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
For instructions on including the SDK, see Facebook JavaScript SDK Quickstart.

Rate Limit

Each function in Customer Chat SDK is limited to 1 call per 5 seconds.

Supported Controls

Showing the Plugin

Call this function to show the plugin on your page. You can use the shouldShowDialog parameter to decide if the dialog should also be shown.
For the plugin to stay hidden on initial page load, you have to set xfbml as false when initializing the SDK. Then you can call FB.XFBML.parse() to control when Customer Chat is loaded.
FB.CustomerChat.show(shouldShowDialog: boolean);

Hiding the Plugin

Call this function to hide the entire plugin on your page.
FB.CustomerChat.hide();

Showing the Dialog

Call this function to show the plugin dialog.
FB.CustomerChat.showDialog();

Hiding the Dialog

Call this function to hide the plugin dialog.
FB.CustomerChat.hideDialog();

Updating Greeting Text/Ref

This function allows you to update the greeting text and/or the ref params as specified in the Customer Chat reference. Call FB.CustomerChat.update with a JSON object with the new values.
These updates will not take effect after users enter a conversation with your business.
FB.CustomerChat.update({  
  logged_in_greeting: 'Hello There!',
  logged_out_greeting: 'Log in to Chat with Us',  
  ref: 'coupon_15',
});

Subscribing to Events

Plugin Load

This function provides the ability to subscribe to the plugin load event. It is emitted when the Facebook JavaScript SDK has been initialized and the plugin is about to load. The callback function is a required parameter.
At this point, the plugin is not necessarily mounted in the DOM. Calling the above plugin control functions might result in exceptions.
FB.Event.subscribe('customerchat.load', callback());

Plugin Show

This function provides the ability to subscribe to the plugin show event. The callback function is a required parameter.
FB.Event.subscribe('customerchat.show', callback());

Plugin Hide

This function provides the ability to subscribe to the plugin hide event. The callback function is a required parameter.
FB.Event.subscribe('customerchat.hide', callback());

Dialog Show

This function provides the ability to subscribe to the dialog show event. The callback function is a required parameter.
FB.Event.subscribe('customerchat.dialogShow', callback());

Dialog Hide

This function provides the ability to subscribe to the dialog hide event. The callback function is a required parameter.
FB.Event.subscribe('customerchat.dialogHide', callback());

Comments

Post a Comment

Popular posts from this blog

How to Add Categories and Tags for WordPress Pages

Image
https://www.wpbeginner.com/plugins/how-to-add-categories-and-tags-for-wordpress-pages/ Categories and tags help you sort your content and make it easier for users to find what they are looking for. When creating a WordPress post both categories and tags can come in very handy for organizing your content. In past we have covered how to use  Categories vs Tags . By default both categories and tags are only limited to posts, so when you create a new page in WordPress, you will notice that there is no option to add categories or tags to your WordPress page. Recently one of our readers asked us if there was a way to have categories and tags work with both post and pages. Like we always say, there’s a plugin for that. In this article we will show you how to add post tags and categories for WordPress pages. Video Tutorial Subscribe to WPBeginner If you don’t like the video or need more instructions, then continue reading. First thing you need to do is install and a...
Read more

GALLERY AND ALBUM MANAGEMENT

Image
- Add new album with name and description and album cover - Edit album name and details also album cover - Dynamic album and galley auto crop thumb images - in gallery upload multiple images with auto generate unique image name - In gallery change images or delete images - Album wise gallery management - Easy page number wise navigation buttons Download full source code ========================================================= https://www.dropbox.com/s/2hp4uqbqa64... fix bugs ================================================ go to & try it https://drive.google.com/file/d/0B0aa...
Read more

Customer Chat Plugin (beta)

Image
The Messenger Platform's customer chat plugin allows you to integrate your Messenger experience directly into your website. This allows your customers to interact with your business anytime with the same personalized, rich-media experience they get in Messenger. The customer chat plugin automatically loads recent chat history between the person and your business, meaning recent interactions with your business on messenger.com, in the Messenger app, or in the customer chat plugin on your website will be visible. This helps create a single experience for your customers, and enables you to continue the conversation even after they have left your webpage. No need to capture their information to follow up, just use the same conversation in Messenger. Contents Feature Support Browser Support Message Type & Template Support Including the SDK Localization & Internationalization Setting Up the Plugin Customizing the Plugin Using the Setup Tool Disabling the Per...
Read more