Vue Fb Customer Chat
Facebook Customer Chat Plugin for Vue.js
Demo
https://dmnCodes.github.io/vue-fb-customer-chat/
Installation
Install using npm
$ npm install vue-fb-customer-chat
Install using yarn
$ yarn add vue-fb-customer-chat
Usage
Setting up the Messenger
For the messenger to work, you need to enable it on Facebook first:
- Go to your Page on Facebook
- Go to
About
and copy the Page ID (https://www.facebook.com/help/1503421039731588) - Go to
Settings
>Messaging
- Complete the setup in the
Add Messenger to your website
, do not forget to add both production and local URLs
For Vue.js projects.
import Vue from 'vue'
import VueFbCustomerChat from 'vue-fb-customer-chat'
Vue.use(VueFbCustomerChat, {
page_id: null, // change 'null' to your Facebook Page ID,
theme_color: '#333333', // theme color in HEX
locale: 'en_US', // default 'en_US'
})
For Nuxt.js projects.
Create 'plugins/vue-fb-customer-chat.js'
import Vue from 'vue'
import VueFbCustomerChat from 'vue-fb-customer-chat'
Vue.use(VueFbCustomerChat, {
page_id: null, // change 'null' to your Facebook Page ID,
theme_color: '#333333', // theme color in HEX
locale: 'en_US', // default 'en_US'
})
Add plugin in nuxt.config.js file for plugins section
plugins: [
{ src: '~/plugins/vue-fb-customer-chat.js', ssr: false }
],