Should have a dedicated WhatsApp number (it shouldn’t be linked to any existing WhatsApp personal or business account)
Should have a Facebook Business Portfolio (Business Verified) in the Facebook Business Manager account
Should have admin access to the Facebook Business Manager
Step 1: In your web browser, copy and paste "https://developers.facebook.com" into the address bar, press Enter, and then click the "Get Started" button located at the top right corner of the page.
Step 2: Verify the developer account by entering the mobile number in the field, as highlighted in the image below. Click "Send Verification SMS" once done.
Step 3: Enter the Code from the SMS sent to the mobile number and click the button "Continue" to proceed.
Step 4: Review your email address, tick the checkbox and then click the "Confirm Email" button.
Step 5: Choose the role that best describes you and click "Complete Registration".
Step 6: Once registration is complete, you'll be redirected to the apps page. Click the "Create App" option.
Step 7: In the pop up that appears, click the "Create app" button to proceed further.
Step 8: Under the App Details section, enter your app name and set "ulgebra@zoho.com" as the contact email so Ulgebra can receive important updates about your app, including renewals and permission requests.
Then, click the "Next" button to continue.
Step 9: Under the Use Cases section, scroll to the bottom, select the "Other" option, and then click the "Next" button to continue.
Step 10: Under the Business section, choose "Business" as the app type. Click the "Next" button to proceed.
Step 11: Now, review your app name and contact email, select the business portfolio you’d like to connect to your app, and then click the "Create App" button.
Step 12: Click "App Settings" in the left side navigation menu, then select "Basic". You'll be redirected to the basic settings page.
Step 13: In the settings page that appears, copy and paste the following details in the appropriate fields, as highlighted in the image below.
App domains - ulgebra.com , sms.ulgebra.com
Contact email - ulgebra@zoho.com
Privacy Policy URL - http://ulgebra.com/privacy-policy
Terms of Service URL - http://ulgebra.com/terms
Step 14: Scroll down on the basic settings page and fill in the following details in the appropriate fields, as highlighted in the image below.
User data deletion - Select "Data deletion instructions URL"
Category - Select "Messenger bots for business"
App icon - Upload an icon for your business (image size should be between 512 × 512 pixels and 1024 × 1024 pixels).
Step 15: Scroll down further on the basic settings page and Click the button "Add Platform".
Step 16: In the pop up that appears, choose the option "Website" and Click the "Next" button to proceed further.
Step 17: Copy and paste the following link into the Site URL field:
https://sms.ulgebra.com/send-sms?appCode=whatsappforpipedrive&disableSAASSdk=true&force-ui-view=CONVERSATIONS
Now, click the button "Add or update instructions" to provide the test instructions.
Step 18: In the pop up that appears, copy and paste the instructions provided below into the appropriate fields, as highlighted in the image.
Where can we find the app?
https://sms.ulgebra.com/send-sms?appCode=whatsappforpipedrive&disableSAASSdk=true&force-ui-view=CONVERSATIONS
Provide instructions for accessing the app so we may complete our review.
1. Go to https://sms.ulgebra.com/send-sms?appCode=whatsappforpipedrive&disableSAASSdk=true&force-view=CONVERSATIONS
Login with below credentials to access the app
Username: <TYPE YOUR ULGEBRA LOGIN MAIL ID>
Password: <TYPE YOUR PASSWORD>
WHATSAPP_BUSINESS_MANAGEMENT:
----------------------------------------
2. You can now view the page with WABA phone numbers at the top left corner as a dropdown and my customers who messages to my business in the chat list.
WHATSAPP_BUSINESS_MESSAGING:
--------------------------------------
3. You can choose any chat and view my customer messages and you can even attempt to send WABA template message.
4. If you send a message to my WABA number which is displayed at the top left corner you can receive the message at the chat list and continue the conversation.
HOW DO WE USE FACEBOOK LOGIN:
-------------------------------------
The facebook login authorization part was done by me already and if you want to re test the same functionality, you can click the profile icon at the top right corner and scroll down to find 'Re-Authorize WhatsApp WABA' and click to initiate. Then you have to enter this APP ID (INSERT_APP_ID) then click authorize now which will open facebook login dialog with requested permissions.
This is how our app works with this facebook app.
Note: We are not using facebook login for entering the app but we are using facebook login to get permissions from which we can use the WABA APIs which are used for this chat app functionality. We cannot build this app without the WABA API and we need facebook login to get Oauth-token.
Note: Fill in your username and password in the instruction provided after pasting it, as highlighted by the arrow in the image below .
Step 19: Enter "It's free" for the questions highlighted in the image below. Click the "Save" button to submit it.
Step 20: Click the "Save changes" button to save the entered information in the page.
Step 21: Select the "Dashboard" option from the left side navigation menu, and then click the "Set up" button under the WhatsApp section, as highlighted in the image given.
Step 22: Click the button "Continue" to proceed further.
Step 23: Go to the App Review section from the left side navigation menu and select Permissions and Features.
In the search bar at the top, type “whatsapp”. Locate the permission “whatsapp_business_messaging” and click the button "Request advanced access"
Step 24: Scroll down the page to the next search bar and type “whatsapp” again. Locate the permission “whatsapp_business_management” and click the button "Request advanced access".
Step 25: Navigate to the "App settings" page from the left side navigation menu and click the "Basic" button. Then, click the "Show" button to view the App secret.
Step 26: A pop up to re-enter the password appears. Type your facebook account password and click the "Submit" button.
Step 27: Copy the App ID and the App secret, as highlighted in the image attached below.
Step 28: Copy and paste the link "https://sms.ulgebra.com/send-sms?appCode=whatsappforpipedrive&disableSAASSdk=true&convId=916381504050%3A%3A393667180416&force-ui-view=CONVERSATIONS" on a new tab in your browser.
Click the circular icon, as highlighted in the image below.
Step 29: You will redirected to the WABA configuration page. Paste the App ID and App secret key copied from the basic settings page in the respective fields and click the "Generate Token" button.
Step 30: Scroll down the WABA configuration page to find the credentials for Authorization. Copy the Verify token and Webhook URL. Keep this tab open in your browser to do further changes required for the set up.
Step 31: Return to the tab with the facebook.developers.com/apps page open. From the left side navigation menu, navigate to the WhatsApp section and click "Configuration".
Then, paste the Webhook URL and Verify Token (copied from the WABA configuration page) into the respective fields shown in the image below. Once done, click the "Verify and Save" button.
Step 32: Now, scroll down on the page to find the row "messages" and then enable it to make it as subscribed.
Step 33: Scroll down on the page further and click the button "Manage phone numbers"
Step 34: You will be redirected to Meta’s WhatsApp Manager page. From the left side navigation menu, select “Phone numbers” under the "Account tools" section.
Next, go to the URL at the top of the page, scroll to the far right, and copy the ID number that appears after the “asset_id=”.
Step 35: Return to the tab with the WABA configuration page open. In the Facebook WABA ID field, paste the ID number copied earlier from Meta’s WhatsApp Manager page. Then, click the button "Generate Token".
Step 36: Scroll down the WABA configuration page to find the credentials for Authorization and copy the OAuth URL.
Step 37: Return to the tab with facebook.developers.com/apps page open and click the "Dashboard" option on the left side navigation menu.
Now, scroll down the page to find the "Facebook Login for Business" section and click the button "Set up".
Step 38: On the left side navigation menu, Select the "Facebook Login for Business" section and click the "Settings" option.
Step 39: Scroll down on the Settings page and paste the OAuth URL copied earlier into the "Valid OAuth Redirect URIs" field, as shown in the image below. Click the button "Save changes" at the bottom right corner of the screen.
Step 40: Navigate to the tab with WABA Configuration page open. Click on the “Copy” button to copy the generated code, and then send the code via WhatsApp to Ulgebra at the number given below:
+917397415648
Kindly wait until we deploy your code and send you a confirmation. Please proceed with the remaining steps only after you receive our confirmation.
Step 41: Go to the developers.facebook.com/apps page and navigate to the App settings section on the left side navigation menu and click the "Basic" option. At the top of the page, locate the App ID and click on it to copy.
Step 42: Copy and paste the link "https://sms.ulgebra.com/send-sms?appCode=whatsappforpipedrive&disableSAASSdk=true&convId=916381504050%3A%3A393667180416&force-ui-view=CONVERSATIONS" on a new tab in your browser.
Paste the App ID you copied in the previous step into the provided field, then click the "Authorize Now" button.
Step 43: In the pop up that appears, click the button "Save".
Step 44: Choose the option "Opt in to all current and future WhatsApp accounts" and click the button "Continue".
Step 45: Click the button "Continue as" to proceed further.
Step 46: You’ll be redirected to the WABA inbox page. From there, click the profile icon in the bottom-left corner to navigate to the settings page.
Step 47: Return to the tab with developers.facebook.com page open. Click the "Dashboard" button on the left side navigation bar.
Now, Toggle the App mode button to Live, as highlighted in the image below. The set up for WABA is now complete.