WhatsApp configuration guide

META App Creation and Configuration

1. Visit developers.facebook.com
2. Click MyApps in the top right hand corner
3. Click Create App
   1. App Name: Enter the name of your company (This will be visible to guests)
   2. App Contact email: Enter the desired contact email for updates about your App
   3. Click Next
4. Use Cases
   1. Select the option for “Connect With Customers through WhatsApp”
   2. Click Next
5. Business
   1. Select your verified business profile
   2. Click Next
6. Requirements
   1. Click Next
7. Overview
   1. Click Create App
8. Your browser should be redirected into the dashboard for your App
9. Using the menu panel to the left go to App Settings > Basic
   1. Configure required fields like App Icon, Privacy Policy, and Category
   2. App ID: Save this for use later in the guide
   3. App Secret: Save this for user later in this guide
10. Using the menu panel to the left go to Use cases
11. Click on Connect on WhatsApp use case
12. Click the option “Embedded Signup Builder”
    1. Click Create Configuration in the section for “Facebook Login for business”
       1. Click Create
       2. Copy the generated Config ID for use later in this guide.
    2. Click Manage Allow List
       1. Enter the following domains
          1. Enter your branded dashboard hostname
             • Example: https://dashboard.4wifi.net
13. Click the option for Configuration
    1. Callback URL: Enter your branded splash page hostname with the destination /waba_webhook.php added to the end
       • Example: https://splash.4wifi.net/waba_webhook.php
    2. Verified Token: m4w
    3. Click Verify and Save
    4. After your configuration is verified the available webhook fields will appear below
    5. Webhook fields
       1. messages: Subscribed
14. This completes the META Developer App setup

Marketing 4 WiFi Operator Settings Setup

1. Login to your Marketing 4 WiFi dashboard
2. Using the menu panel to the  left select Operator Settings > Opeartor Customizations
   1. Main Tab
      1. WhatsApp Login Enable: ON
   2. Branding Tab
      1. Meta App ID: Enter the value collected in step 9.2 of the META App Creation and Configuration section of this guide
      2. Meta App Secret: Enter the value collected in step 9.3 of the META App Creation and Configuration section of this guide
      3. Facebook Login for Business Config ID: Enter the value collected in step 12.1.2 of the META App Creation and Configuration section of this guide
   3. Click Submit

Enabling WhatsApp as a Client

1. Login to your Smart WiFi dashboard
2. Integrations > Other Apps
3. Click WhatsApp Tile
4. Click the Login with Facebook button
   1. Click Continue to accept permissions on the pop up after logging in
5. Select your Business Portfolio and Business Account
6. Click Next
7. Use a new or existing WhatsApp number
   1. Phone Number
      1. Select your desired phone number if you have one, otherwise enter the required information to complete a New WhatsApp number verification process
      2. Click Next
      3. Enter the code you receive
      4. Click Confirm
      5. Click Add Payment Method and add your desired payment method.
         1. This must be completed before you will be able to send messages. 
      6. Click Finish
8. You should be redirected back to the Smart WiFi platform, now with your WhatsApp Settings populated
9. Click Manage Templates via Meta
   1. In META’s Message Templates page, click Create Template
      1. Select the Authentication option
      2. Click Go to template library
      3. Select the category Authentication, and subcategory Verify User
      4. Click the option login_code
         1. Name your template: login_code
         2. Code delivery setup: Copy code
         3. Click Submit
10. Return to your Smart WiFi dashboard
11. Using the menu panel to the left select Network > Hotspots
12. Click Edit for your desired hotspot
    1. Under the Login Methods, turn WhatsApp ON and click Options
    2. WhatsApp Template Name: login_code
    3. Verifcatio0n Instructions
    4. Disclosure Statement(s)
13. Click Submit
14. Using the menu panel to the left select Network > Splash Pages
    1. Edit the splash page currently in use by your desired hotspot
    2. Using the elemental selector to the right, select Social Connect Buttons
    3. Drag the Sign in by WhatsApp button onto your Splash Page
15. Your hotspot now offers WhatsApp as a login method.