> ## Documentation Index
> Fetch the complete documentation index at: https://docs.libraria.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# WhatsApp Integration

> A guide to send and receive messages from your Libraria Chatbot using WhatsApp

<Frame>
  <img src="https://mintlify.s3-us-west-1.amazonaws.com/bogpad/images/chat-integration/whatsapp-output.jpg" alt="Whatsapp output" width="300" height="600" />
</Frame>

## Step 1: Set Up a WhatsApp Business Account

1. Sign up for a [WhatsApp Business Account](https://www.facebook.com/business/m/whatsapp/business-api).
2. Verify your phone number by receiving a verification code via SMS or a phone call.
3. Complete the setup by providing the necessary business details.

## Step 2: Setup Your App in Meta

1. Create your app [here](https://developers.facebook.com/apps/).

2. For `What do you want your app to do?` Select `Other`

<Accordion title="Image Instruction">
  <Frame caption="Select &#x22;Other&#x22;">
    <img src="https://mintlify.s3-us-west-1.amazonaws.com/bogpad/images/chat-integration/select-other.png" alt="Select Other" />
  </Frame>
</Accordion>

3. For `App Type`, select `None`

<Accordion title="Image Instruction">
  <Frame caption="Select &#x22;None&#x22; for &#x22;App Type&#x22;">
    <img src="https://mintlify.s3-us-west-1.amazonaws.com/bogpad/images/chat-integration/select-none.png" alt="Select None" />
  </Frame>
</Accordion>

4. Select your Business Account that you created in `Step 1`

5. Head over to your app and add the WhatsApp and Webhook products. Look for `Whatsapp` and click `Set Up`

<Accordion title="Image Reference">
  <Frame caption="Add WhatsApp and Webhook products and Click &#x22;Set Up&#x22;">
    <img src="https://mintlify.s3-us-west-1.amazonaws.com/bogpad/images/chat-integration/meta-products.png" alt="Add WhatsApp and Webhook products" />
  </Frame>
</Accordion>

6. On the sidebar, navigate to `Whatsapp` > `API setup`

<Accordion title="Image Reference">
  <Frame caption="Navigate to &#x22;API Setup&#x22;">
    <img src="https://mintlify.s3-us-west-1.amazonaws.com/bogpad/images/chat-integration/whatsapp-api.png" alt="Navigate to API Setup" />
  </Frame>
</Accordion>

7. The phone number under `From` will be number the users will be messaging your chatbot on whatsapp. Save the `WhatsApp Business Account ID`. You will need to paste it later in the Libraria WhatsApp Integration setup.

<Frame caption="WhatsApp Business Account ID">
  <img src="https://mintlify.s3-us-west-1.amazonaws.com/bogpad/images/chat-integration/business-account-id.png" alt="WhatsApp Business Account ID" />
</Frame>

## Step 3: Create a permanent token

Permanent Access Token can be used to send and receive messages to/from the WhatsApp API without the need to refresh the token every 24 hours.

* Navigate to [Business Settings](https://business.facebook.com/settings/system-users) (opens in a new tab)
* Choose the business account associated with your app.
* Click on `Add under System Users`.
* Enter a name for the system user, assign the `Admin role`, and click `Create System User`.
* Click on `Create Asset` and select `Apps` from the asset type Tab.

<Frame caption="Add assets">
  <img src="https://mintlify.s3-us-west-1.amazonaws.com/bogpad/images/chat-integration/whatsapp-add-asset.png" alt="Add Asset" />
</Frame>

* Select your app and toggle `Manage App` (full control).

<Frame caption="Click on &#x22;Manage App&#x22;">
  <img src="https://mintlify.s3-us-west-1.amazonaws.com/bogpad/images/chat-integration/whatsapp-assign-assets.png" alt="Manage App" />
</Frame>

* Click `Generate New Token`
  * For `Token Expiration`, select `Never`
  * For `Available Permissions` select `whatsapp_business_messaging` and `whatsapp_business_management`.
* Copy and save your token on Libraria and edit your `Permanent Token` on Libraria.

## Step 4: Add the WhatsApp Chat Integration in your Libraria Account

1. Click settings under your desired library

<Frame caption="On the sidebar select your Library and click &#x22;Settings&#x22;">
  <img src="https://mintlify.s3-us-west-1.amazonaws.com/bogpad/images/chat-integration/libraria-library.png" alt="Settings" />
</Frame>

2. Navigate to integrations and click WhatsApp

<Frame caption="Select Whatsapp">
  <img src="https://mintlify.s3-us-west-1.amazonaws.com/bogpad/images/chat-integration/libraria-integrations.png" alt="Select Whatsapp" />
</Frame>

3. Paste your previously saved `WhatsApp Business Account ID` and `Permanent Token`
   ![Token](https://mintlify.s3-us-west-1.amazonaws.com/bogpad/images/chat-integration/libraria-whatsapp.png)

4. Copy the webhook URL and Token
   ![Callback](https://mintlify.s3-us-west-1.amazonaws.com/bogpad/images/chat-integration/libraria-whatsapp-callback.png)

## Step 5: Setting up your Webhook Endpoint

1. Head back to your [Meta Developer Account](https://developers.facebook.com/apps/) and select your app.

2. Go to WhatsApp ->  Configuration and click 'Edit'
   ![Webhook](https://mintlify.s3-us-west-1.amazonaws.com/bogpad/images/chat-integration/webhook-configuration.png)

3. Paste your webhook URL and Token from Libraria here.
   ![Callback URL](https://mintlify.s3-us-west-1.amazonaws.com/bogpad/images/chat-integration/webhook-url.png)

4. After successfuly saving your URL and token, click "Manage" on webhook fields and subscribe to "messages".
   ![Subscriptions](https://mintlify.s3-us-west-1.amazonaws.com/bogpad/images/chat-integration/webhook-fields.png)

Congratulations, you have successfully setup your WhatsApp Integration.

Official Meta documentation can be found [here](https://developers.facebook.com/docs/whatsapp-business-platform/get-started)
