React wrapper for the Facebook Messenger Plugin
npm install react-messenger-pluginComponent wrapper for Facebook Messenger plugins
``shell`
npm install --save react-messenger-plugin
To use the Messenger Plugin, you will need an App Id and a Page Id. You can find create an app here and you will find your page Id at the bottom of your Facebook page settings.
You can then use the plugin.
`jsx
var React = require("react");
var render = require("react-dom").render;
var MessengerPlugin = require("react-messenger-plugin");
render(
pageId="
/>,
document.body
);
`
| Name | Type | Required? | Default | Description |
| --- | --- | --- | --- | --- |
| appId | string | yes | - | Your Facebook app id |
| pageId | string | yes | - | Your Facebook page id |
| version | string | no | v2.6 | The Facebook API version you are using, See documentation. |data-ref
| passthroughParams | string | no | - | Equivalent of . Used to pass state with the authentication. See documentation. |send-to
| type | string | no | | Type of plugin. Must be either send-to (Send-to-Messenger plugin) or message-us (Message-Us plugin). |blue
| color | string | no | | Color of the button. Must be either blue or white. |standard
| size | string | no | | Size of the button. Must be either standard, large, or xlarge. |
| asyncScriptOnLoad | function | no | - | Callback triggered when the SDK script is loaded. |
If you already have the Facebook SDK loaded in your page, you can use the unwrapped component and pass the SDK to it.
`jsx
var React = require("react");
var render = require("react-dom").render;
var MessengerPlugin = require("react-messenger-plugin/lib/MessengerPlugin");
render(
pageId="
FB={window.FB}
/>,
document.body
);
``
---
Inspired by react-google-recaptcha