Don’t miss our Special Offer!

Up to 50% off
Grab Amelia
Grab Amelia

WhatsApp Notifications in the Amelia WordPress Booking Plugin

Along with email and SMS notifications, Amelia allows you to configure and use WhatsApp notifications as well. They use a similar approach, but with a few differences. Let’s dive in.

Please note:

  • The WhatsApp integration is only available in Amelia Pro and Amelia Elite License plans.
  • The WhatsApp integration cannot be used to chat with your customers, but you can configure the auto-responder message.
  • As per Facebook’s Troubleshooting Guide, businesses in Turkey are able to send messages using the Cloud API, however, customers in Turkey cannot receive messages sent by businesses using Cloud API.
  • As per Facebook’s WhatsApp Pricing page, each WhatsApp Business Account gets 1,000 free service conversations each month across all of its business phone numbers. This number is refreshed at the beginning of each month, based on the WhatsApp Business Account time zone.Marketing, utility, and authentication conversations are not part of the free tier.

Video version

Setting up the app on Facebook

Visit this link to log into, or create your Facebook Developer Account. You can use your personal account, or your company’s Facebook account, you just need to log into it.

If you already have a Facebook Developer Account, you can skip the “Account Creation” section below and jump straight to “App Creation” by clicking here.

This is where you configure your phone number for WhatsApp and where you will configure your Auto-Responder messages.

https://developers.facebook.com/

Account Creation

If you’re creating a new Developer Account, once you access the link above, in the upper right corner, click on “Log In”. Since WhatsApp is now a part of the Meta family, you will be logging into Facebook:

FB-login

Once you do log in, you will be redirected back to the home page of developers.facebook.com. Again, in the upper right corner click on “Get Started”.

The 1st step is Registration, where you need to agree to Facebook’s Terms and Developer Policies:

FB-registration

The 2nd step is the account verification, which can be done either by adding a valid phone number (you will receive a verification code via SMS, so it needs to be a real number you can access), or by adding a credit card to your account.

FB-acc-verification

The next step is to verify that the email linked to your Facebook account is valid. If you need to change it, click on “Update Email” in the lower right corner, and if it’s the correct email address, click on “Confirm Email” to continue to the last step.

FB-email-confirmation

The last step is used for helping Facebook improve your experience with the Facebook for Developers account. You can select “Developer” as we did in the screenshot below, but you can, of course, select another role. When you select it, click on Complete Registration, and that’s it.

FB-description

App Creation

Within the Facebook developer account, you’ll either see a list of your apps (if you already used it) or you’ll see a blank screen as shown in the screenshot below. All you need to do is click on “Create App” either in the top right, next to the search box, or in the App list section.

FB-create-app

Select App type – Select the last option – “Other”

wa-create-app

On the next screen, select the “Business” type app option regardless if you’re a “One-man show” or an enterprise.

wa-select-app-type

Provide basic information – In here, you only need to choose the display name of your app (you can change this later). The email you’re logged in with is already populated, and the Business Account is not a mandatory option for using WhatsApp within Amelia, so even if your account is linked to a Business Account, you don’t need to select it.

FB-app-details

Facebook doesn’t allow certain terms like “whatsapp”. For example, you may not use Meta’s trademarks or brand elements (including FB, Face, Book, Insta, Gram, and Rift) or any confusingly similar terms in your app name if such term is, or could be perceived as, a reference to Facebook or its brands.

Once you click the “Create app” button, Facebook will ask for your Facebook password. Enter the password and click “Submit” to continue.

This completes the creation of the app, and now we need to add a product to the app (WhatsApp). To do that, scroll down to the end of the page and click on “Set up” in the lower right corner of the “WhatsApp” card:

wa-setup

The next screen informs you what’s included in the Business Platform API and by continuing, you agree to the Facebook Terms for WhatsApp Business and the Meta Hosting Terms for Cloud API. All you need to do is click on “Continue”:

WhatsApp-API-getting-started

The next screen takes you to the Quickstart section where, clicking on the “Start Using the API” button you access the page where the data needed to test the app resides – a Temporary Access TokenPhone Number ID, WhatsApp Business Account ID, and Curl of sending messages.

Please note: You will need the Phone Number ID and the WhatsApp Business Account ID later when you configure WhatsApp integration in Amelia. To skip to this step, please click here.

App-testing

In the “From” section, you will see a test number assigned to your account (this number cannot be used in production).

In the “To” section, you will see a drop-down menu that will be empty when you expand it. You can click on “Manage phone number list” and add up to 5 phone numbers to receive free test messages.

Please note: WhatsApp will send a confirmation code to the phone number, so you can’t actually add this number until you enter the 5-digit verification code you receive in the WhatsApp account linked to the phone number you provided.

Once you add your personal number for testing, you can click on the blue “Send message” button in the lower right corner under Step 2 and you should receive a WhatsApp message similar to this:

WhatsApp-test-success

After you receive the text message, you can scroll down in the Facebook for Developers page; skip steps 3 and 4 and click on “Add phone number” in the bottom right:

Add-phone-number

This will bring up a modal where you add your business name (this is the name your customers will see on WhatsApp when they receive a message from you), business email (needs to be a valid email, since you’ll need to confirm it), your country, and your business’ website.

When you’re done populating this, click on “Next” in the bottom right corner.

Add-phone-number-modal

The next pop-up will ask for the timezone, business category, and business description. Fill in the details carefully and click the “Next” button in the bottom right corner.

Business-description

Enter your business’ official phone number that will be used for Amelia.

Bear in mind that this can’t be the number that’s already using WhatsApp, so it has to be a number that’s new to WhatsApp.

If you enter a number that’s already being used by WhatsApp (regardless if it’s a personal or a business account), once you link it here – you won’t be able to use it on a mobile device anymore, so we strongly recommend obtaining a new number for this integration.

You can enter your Business’ landline number also, you just need to select the “Phone Call” radio button below in order to activate it.

If you’re using a mobile number, you can also select the “Text message” option, and you will receive the verification code.

Please note that this is the number your customers will receive messages from.

Once you click on “Next” in the bottom right corner of the pop-up, you will receive the verification code.

verify-business-number

After you click on “Next”, you will receive an OTP message from WhatsApp to your WhatsApp business number. Enter the verification code (OTP number) and click the “Finish” button. Your number will be verified at this stage and it will be linked with your WhatsApp business account.

At this point, you’ve configured the phone number you’ll use for WhatsApp messaging if you want to actually chat with your customers, but in order to integrate it with Amelia, you will need a permanent access token.

In the “Getting Started” section, at the top, you will notice a “Temporary access token”, and a message that says “This token will expire in 23 hours”. This can’t be used in Amelia since if, for example, you want to send the message after 23 hours from NOW pass, the current access token will not work and you will need to log into the Facebook for Developers page again and click on the “Refresh” button in order to create a new token.

Instead of doing that, we need to create a token that never expires.

temporary-token

While logged into your Facebook for Developers account, access the Business Settings Page.

Under the “Users” section in the left sidebar, click on “System users”. You will see a blank page where you need to click on “Add” to add a user:

System-users

You will be prompted with Facebook’s Non-discrimination policy which you have to review and accept. Once you scroll through this modal and review the policy, click on “I accept” in the bottom right corner of the pop-up.

Please note: You may be periodically asked to review this policy to maintain compliance.

non-discrimination-acception

On the next screen, you’ll see a “Thank you” message from Facebook, and you only need to click on “Done” in the bottom right to continue creating a new user.

Enter the username and select the role “Admin”. Once you’re done, click on “Create system user”:

create-admin-user

You may, again, be prompted with Facebook’s Non-discrimination policy which you have to review and accept.

After you accept the policy again, you’ll see the newly created Admin user. In the right section of the screen, click on the “Add Assets” button.

add-assets

In the pop-up that appears, click on Apps, then select the App previously created for WhatsApp integration, enable the Full Control (“Manage App”) slider, and click on “Save Changes”.

Full-control

The next pop-up will inform you that a new asset has been added, and all you need to do is click on “Done”.

After that, in the left sidebar, under “Accounts”, click on “WhatsApp accounts”. Select the previously created business app (in our example, it’s named “Amelia”), and then click on one of the “Add People” buttons:

add-people

In the pop-up that appears, select the system user previously created, and then enable the “Full Control” option again and then click “Assign” in the bottom right corner:

whatsapp-assign

You’ll see a prompt that confirms that 1 Person has been added to the WhatsApp account, so just click “Done”.

After that, go back to the “System Users” section in the left sidebar (agree to Facebook’s Non-discrimination policy if prompted again), and click on the “Generate new token” button:

generate-token

Select the App from the drop-down menu, and scroll down. You will see a few notices, and below them, you’ll see the list of available permissions.

Scroll down and enable these two permissions:

  • whatsapp_business_messaging
  • whatsapp_business_management

After you select them, click on the “Generate token” button in the lower right corner of this pop-up.

generate-token

Finally, you’ll see the token that will not expire and that will be active forever, unless you click the “Revoke Token” button.

You can also verify the token scope from the Facebook token debugger tool and check the scope of the token added successfully or not.

Please note: Facebook will not remember this token, so copy it and save it someplace safe.

Permanent-token

WhatsApp Settings in Amelia

Now that we have a permanent token in Facebook for Developers, we can go back to the WordPress site. Under Amelia/Notifications click on the “WhatsApp Notifications” tab.

In there, you’ll need to paste the Phone Number IDPermanent access token, and your WhatsApp Business Account ID.

These can be found in your Facebook for Developers account, under Apps, previously mentioned here.

Amelia-WhatsApp-config

Once you save the configuration, you’ll be taken to message templates, that are similar to Email and SMS notifications.

The only difference is that WhatsApp templates can’t be configured in Amelia, but instead, you need to configure them in your Business Settings Page.

In the left sidebar, click on the three lines and then click on “WhatsApp Manager”:

whatsapp-manager

In the “Overview” section that appears next, click on the three dots on the right of the WhatsApp account you previously created, and then click on “Manage message templates”:

On the following page, you can create new templates that will be utilized in Amelia. Click on “Create Template” in the top right corner to begin.

When setting up a template, ensure the category is “Marketing“. Once it expands, select the “Custom” radio button.

Next, provide a name for the template (you can use the same names seen in Amelia, such as “customer_appointment_approved”, “employee_appointment_pending”, etc.) and select the language used in Amelia.

Once configured, click “Continue” in the top right corner to proceed.

Please note:

  • The name of the template needs to be lowercase without spaces. You can try adding them, and Facebook will automatically modify uppercase to lowercase, and replace spaces with an underscore.
  • The languages you select in the template need to be included in Amelia also. The default language is set in Notifications/WhatsApp Notifications when you access settings, but if you added more languages in Amelia’s General Settings, they will be available as well, so you can add these languages when creating templates in WhatsApp.
wa-new-template

Templates in WhatsApp follow a similar structure to creating templates for Email and SMS notifications, with a few key differences.

The primary distinction is the configuration of variables (placeholders) in the template, which can only be numerical. As illustrated in the screenshot below, these placeholders are formatted as {{1}}, {{2}}, and so forth, resembling Amelia’s placeholders enclosed in percentage symbols.

It’s crucial to understand which variable corresponds to which placeholder in Amelia. For instance, {{1}} in WhatsApp corresponds to %service_name% in Amelia.

While the Header and Footer sections are optional, the Header can include variables while the Footer cannot. If you choose to add a Header, select “Text” from the drop-down menu and input your header text as demonstrated in the example below. Note that the Header section only accepts “Text”, so you can either utilize this or omit the header entirely.

WhatsApp also requires you to define the examples for the placeholders, as it helps them speed up the validation of your templates.

Once you’ve created the template, click the “Submit” button located in the upper right corner.

wa-template-preview

Each template you create will undergo review by WhatsApp, typically taking about an hour for approval. An approved template will display a green status, marked as “Active – Quality pending“, while a template under review will appear gray with the status “In review“, as shown in the screenshot below:

wa-template-review

Please note:

  • Once a template is approved, it can no longer be edited. Only rejected templates can be edited. If you need to modify the template once it’s approved, you will need to delete the old one and create a new template.
  • WhatsApp doesn’t accept line breaksTAB, and 4 spaces put together, so avoid using them in the template. Line breaks will be replaced with a semi-colon ( ; ).

Linking variables with Amelia Placeholders

Back in Amelia/Notifications/WhatsApp Notifications (once you refresh the page), when you click on the “Template name” drop-down, you will see the list of all templates created in the app (both approved and pending ones):

Amelia-template-selection

Select the template you want to associate with the Amelia template you clicked on (or created) and then you can continue linking the variables to placeholders.

Placeholders for Headers and placeholders for the message body are separate, so {{1}} in the header is not the same as {{1}} in the message body. All variables you added to the message template in WhatsApp will be added below the header and the message body, so you can link them.

First, the {{1}} variable needs to be linked to Category/%service_name% (in this example) in the header:

Linking-header-variables

Then, below that, you can see the message template pulled from WhatsApp, and below the template, you will be able to link the variables with placeholders in Amelia:

Linking-body-variables

When you’re done linking the variables to placeholders, scroll all the way down and click on the “Save” button in the lower right corner, to save the notification template.

Now, as in all other notifications, you can test the messages. Click on “Send Test WhatsApp Message”, enter the phone number you want the message to arrive to, and select the template you want to test.

The test message that you receive will replace the placeholders just like Email and SMS test notifications do – with test data (John Doe for the customer name, Richard Roe for the employee name, etc).

Amelia-test-message

Enable the Auto-Responder message

Since WhatsApp integration can’t be used to chat with your customers, you can configure the Auto-Responder message, so your customers are aware of this.

Back, in Amelia/Notifications/WhatsApp Notifications, you need to access Settings in the top right corner. In there, you will see the details you already entered (Phone Number ID, Permanent Access Token, and the WhatsApp Business ID) on the left.

On the right, you’ll see an auto-generated WhatsApp Webhook Verify Token (please note that this token can be changed manually), the WhatsApp Auto-reply message (which you can also modify, and use Amelia’s placeholders), and the WhatsApp Webhook Callback URL.

WA Settings

First, copy the WhatsApp Webhook Verify Token and go to your Developers Console.

In the left-hand side menu, expand WhatsApp and click on Configuration. On the right, in the Webhook section, on the far right, click on Edit.

WA_config

This will open a window where you can paste the WhatsApp Webhook Verify Token you previously copied from Amelia.

Then, go back to Amelia and copy the WhatsApp Webhook Callback URL and paste it into the first field in Meta for Developers:

wa_webhook_paste

Once you paste this data, click on Verify and save.

This will close the modal and refresh the Configuration page.

Now, you need to click the Manage button, next to the Webhook fields.

wa_manage

In there, look for messages in the first column, and then click on Subscribe on the far right, in the same row:

wA messages subscribe

You will see a green message at the top of this window which will let you know that you successfully subscribed to messages.

You can also click on Test in the 3rd column to test this message, and if the test goes through fine, the green message on the top will refresh and tell you that the message was successfully tested.

wa subscribed

That completes the configuration of the auto-responder message, so you can click on Done in the bottom right corner, and close the Meta for Developers window.

Now, it’s up to you to edit the auto-responder message in Amelia, if you haven’t already.

Please note:

  • It is strongly advised to create a dedicated WhatsApp account with your business phone number.
  • You can use the Test Account that WhatsApp creates, but you will not be able to modify the name that appears in your customers’ WhatsApp, so they will see a non-reachable phone number as shown in the screenshot above, without the ability to respond (as you won’t be able to receive this message on an actual account without adding a real phone number here).