KumiSystems/Chatwoot
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

chore: Update documentation in sdk, channels (#1094)

Browse source 
Fix channels/whatsapp-sms-twilio.md
This commit is contained in:
Bharat Patodi 2020-07-26 12:18:54 +05:30 committed by GitHub
parent 0f2d3418f9
commit 858b72a404
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 34 additions and 36 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

41
docs/channels/website-sdk.md
View file

@ -1,36 +1,35 @@
--- ---
path: "/docs/website-sdk" path: '/docs/website-sdk'
title: "Sending Information into Chatwoot" title: 'Sending Information into Chatwoot'
--- ---
Additional information about a contact is always useful. The Chatwoot Website SDK ensures that you can send additional information that you have about the user.
Additional information about a contact is always useful, Chatwoot website SDK ensures that you can send the additional info you have about the user. If you have installed our code on your website, the SDK would expose `window.$chatwoot` object.
If you have installed our code on your website, SDK would expose `window.$chatwoot` object. In order to make sure that the SDK has been loaded completely, please make sure that you listen to `chatwoot:ready` event as follows:
Inorder to make sure that the SDK has been loaded completely, please make sure that you listen to `chatwoot:ready` event as follows
```js ```js
window.addEventListener('chatwoot:ready', function() { window.addEventListener('chatwoot:ready', function () {
// Use window.$chatwoot here // Use window.$chatwoot here
// ... // ...
}) });
``` ```
To hide the bubble, you can use the following setting. Please not if you use this, then you have to trigger the widget by yourself. To hide the bubble, you can use the setting mentioned below. **Note**: If you use this, then you have to trigger the widget by yourself.
```js ```js
window.chatwootSettings = { window.chatwootSettings = {
hideMessageBubble: false, hideMessageBubble: false,
position: 'left', // This can be left or right position: 'left', // This can be left or right
locale: 'en', // Language to be set locale: 'en', // Language to be set
} };
``` ```
### To trigger widget without displaying bubble ### To trigger widget without displaying bubble
```js ```js
window.$chatwoot.toggle() window.$chatwoot.toggle();
``` ```
### To set the user in the widget ### To set the user in the widget
@ -40,33 +39,33 @@ window.$chatwoot.setUser('identifier_key', {
email: 'email@example.com', email: 'email@example.com',
name: 'name', name: 'name',
avatar_url: '', avatar_url: '',
}) });
``` ```
`setUser` accepts an identifier which can be a `user_id` in your database or any unique parameter which represents a user. You can pass email, name, avatar_url as params, support for additional parameters are in progress. `setUser` accepts an identifier which can be a `user_id` in your database or any unique parameter which represents a user. You can pass email, name, avatar_url as params. Support for additional parameters is in progress.
Make sure that you reset the session when the user logouts of your app. Make sure that you reset the session when the user logs out of your app.
### To set language manually ### To set language manually
```js ```js
window.$chatwoot.setLocale('en') window.$chatwoot.setLocale('en');
``` ```
To set the language manually use the setLocale function. To set the language manually, use the `setLocale` function.
### To set labels on the conversation ### To set labels on the conversation
Please note that the labels will be set on a conversation, if the user has not started a conversation, then the following items will not have any effect. Please note that the labels will be set on a conversation if the user has not started a conversation. In that case, the following items will not have any effect:
```js ```js
window.$chatwoot.addLabel('support-ticket') window.$chatwoot.addLabel('support-ticket');
window.$chatwoot.removeLabel('support-ticket') window.$chatwoot.removeLabel('support-ticket');
``` ```
### To refresh the session (use this while you logout user from your app) ### To refresh the session (use this while you logout the user from your app)
```js ```js
window.$chatwoot.reset() window.$chatwoot.reset();
``` ```

29
docs/channels/whatsapp-sms-twilio.md
View file

@ -1,6 +1,6 @@
--- ---
path: "/docs/channels/whatsapp-sms-twilio" path: '/docs/channels/whatsapp-sms-twilio'
title: "How to create a Whatsapp/SMS channel with Twilio?" title: 'How to create a Whatsapp/SMS channel with Twilio?'
--- ---
**Step 1**. Click on "Add Inbox" button from Settings > Inboxes page. **Step 1**. Click on "Add Inbox" button from Settings > Inboxes page.
@ -13,17 +13,17 @@ title: "How to create a Whatsapp/SMS channel with Twilio?"
**Step 3**. Configure the inbox. **Step 3**. Configure the inbox.
These are input required to create this channel These are the inputs required to create this channel:
<div class="table table-striped"> <div class="table table-striped">
| Input | Description | Where can I find it | | Input | Description | Where can I find it |
| -- | -- | -- | | ------------ | --------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------- |
| Channel Name | This is the name inbox, this will used across the application | N/A | | Channel Name | This is the name inbox, this will be used across the application. | N/A |
| Channel Type | Select SMS if you are integrating SMS channel, select Whatsapp if you have a verified Whatsapp number in Twilio | N/A | | Channel Type | Select SMS, if you are integrating an SMS channel. Select Whatsapp, if you have a verified Whatsapp number in Twilio. | N/A |
| Phone Number | This is number you will be using to communicate with you customer, this has to be verified in Twilio | Enter your number as in Twilio Dashboard | | Phone Number | This is the number you will be using to communicate with your customer. This has to be verified in Twilio. | Enter your number as in the Twilio Dashboard |
| Account SID | Account SID in Twilio Console | Login to Twilio Console, you would be able to see Account SID and Auth Token | | Account SID | Account SID in Twilio Console | Login to Twilio Console. Here, you would be able to see the Account SID and the Auth Token |
| Auth Token | Auth token for the account | Login to Twilio Console, you would be able to see Account SID and Auth Token | | Auth Token | Auth token for the account | Login to the Twilio Console. Here, you would be able to see the Account SID and the Auth Token |
</div> </div>
@ -37,19 +37,18 @@ These are input required to create this channel
![finish_inbox](./images/twilio/finish_inbox.png) ![finish_inbox](./images/twilio/finish_inbox.png)
If it is an SMS Channel then you don't need to do anything else, you will start receiving the messages in the dashboard whenever a customer sends you one. If it is an SMS Channel, then you don't need to do anything else. You will start receiving the messages in the dashboard whenever a customer sends you one.
If you are connecting a **Whatsapp** channel, you have configure a callback URL in the Twilio inbox. If you are connecting a **Whatsapp** channel, you have to configure a callback URL in the Twilio inbox:
- Login to your Twilio Console. - Login to your Twilio Console.
- Go to `Programmable SMS > Whatsapp > Senders` - Go to `Programmable SMS > Whatsapp > Senders`.
- You will be able to see your phone number. Click on it, it will display a field like the one below. - You will be able to see your phone number. Click on it, it will display a field like the one shown below.
![twilio_console](./images/twilio/twilio_console.png) ![twilio_console](./images/twilio/twilio_console.png)
- Provide `https://app.chatwoot.com/twilio/callback` as the value for `WHEN A MESSAGE COMES IN` input. - Provide `https://app.chatwoot.com/twilio/callback` as the value for `WHEN A MESSAGE COMES IN` input.
**Step 7**. If you want to update the agents who have access to the inbox, you can go to Settings > Inboxes. **Step 7**. If you want to update the agents who have access to the inbox, you can go to Settings > Inboxes.
![inbox_settings](./images/twilio/inbox_settings.png) ![inbox_settings](./images/twilio/inbox_settings.png)