Connect your app to WhatsApp Business

1. 1

   Make sure you have a Meta account with permission for your WhatsApp Business account, an existing WhatsApp Business account and phone number, and permission to create connections in your Lovable workspace.

   These are necessary prerequisites to successfully connect your WhatsApp Business account.

2. 2

   Go to 'Connectors' in your Lovable dashboard and select 'WhatsApp Business'.

   This is where you initiate the connection process for WhatsApp Business.

3. 3

   Click 'Add connection' and give your connection a display name, like 'WhatsApp Support'.

   This name helps you identify the connection within Lovable.

4. 4

   Choose who in your workspace can use this connection (only you, specific people, or the entire workspace).

   This controls access to the connection and its associated data for security and collaboration.

5. 5

   Click 'Connect' and follow Meta's guided signup process, signing in, selecting your business account and phone number, and reviewing permissions.

   This authorizes Lovable to access your WhatsApp Business account through Meta's official process.

6. 6

   Once connected, ask Lovable in your project chat to link your project to this WhatsApp Business connection.

   This makes the connection available for your specific project to use.

7. 7

   In your linked project, ask Lovable to add incoming messages and delivery tracking (e.g., 'Add a WhatsApp Business inbox that stores incoming messages, lets our team reply, and shows delivery status for sent messages.').

   This sets up your app to receive customer messages and track message delivery status.

8. 8

   Publish your app after Lovable builds the message receiver.

   Publishing makes the changes live and enables your app to start receiving messages.

9. 9

   Send a WhatsApp message from another phone to your connected business number and check if it appears in your app, then reply from the app and confirm the reply arrives on the phone.

   This verifies that your connection and message receiver are working correctly.

Connect my Lovable app to WhatsApp Business so I can receive customer messages, send replies, and manage message templates. I have a Meta account, an existing WhatsApp Business account and phone number, and permission to create connections. Please guide me through the setup.

Meta Embedded Signup

A guided process from Meta (the company that owns WhatsApp) that helps you securely connect your WhatsApp Business account without needing to manually create developer apps or copy secret codes.

Customer-service window

A 24-hour period after a customer sends you a message, during which you can send free-form replies without needing a pre-approved template.

Message template

A pre-approved message format from WhatsApp that you must use to send messages outside the 24-hour customer-service window, like order updates or appointment reminders. These are reviewed by Meta before you can use them.

Webhook

A way for one app to send automatic updates to another app when something specific happens. In this case, Lovable handles setting this up with Meta so you don't have to.

• Forgetting to turn off two-step verification in WhatsApp Manager if your number is not yet connected to the WhatsApp Cloud API, which will prevent setup.
• Not selecting the correct project under 'Incoming messages' in the WhatsApp Business connection settings, causing messages to not appear in your intended app.
• Trying to send free-form messages outside the 24-hour customer-service window, which will be rejected by Meta; you must use an approved message template instead.
• Creating a new message template without providing sample values for all variables, which can lead to Meta rejecting it with an 'INVALID_FORMAT' error.
• Expecting incoming messages and delivery updates to go to multiple projects at once; only one project can receive them at a time.
• Using an older 'React + Vite' project, as it cannot receive incoming messages through this connector.
• Forgetting that deleting a connection in Lovable does not automatically unregister your phone number or revoke Lovable's authorization at Meta; you need to manage those separately in Meta.