WhatsApp Commerce Suite — Installation and configuration guide
Installation, Meta Cloud API setup, webhook, and getting started with the 4 modules: catalog, conversation, abandoned cart, payment.
Overview
DataFirefly WhatsApp Commerce Suite turns WhatsApp into a complete sales channel for WooCommerce, using Meta’s official Cloud API. The plugin ships 4 independently togglable modules: Meta Commerce catalog sync, conversational ordering, abandoned cart recovery, and signed payment link.
Requirements: WordPress 6.2+, WooCommerce 8.0+, PHP 7.4+, a WhatsApp Business account with a verified number in Meta Business Suite, and a site served over HTTPS (mandatory for the Meta webhook).
Installation
- Download
dfwhatsappcommerce-1.0.0.zipfrom your DataFirefly customer account. - In wp-admin, go to Plugins → Add New → Upload Plugin, select the ZIP and click Install Now.
- Activate the plugin. A new WhatsApp menu appears in the admin sidebar.
On activation, the plugin creates 5 SQL tables prefixed dfwc_ (conversations, messages, abandoned carts, catalog log, logs) and schedules 3 cron events: cart processing every 15 minutes, daily log cleanup, and hourly batch catalog sync.
Meta prerequisites
Before configuring the plugin, gather these 5 values from Meta Business Suite:
- Phone Number ID — WhatsApp → API Setup → your number
- WhatsApp Business Account ID — visible in your WhatsApp Business account settings
- Catalog ID — Commerce Manager → your catalog → Settings
- Permanent Access Token — create a system user in Business Settings → Users → System Users, grant it the
whatsapp_business_messaging,whatsapp_business_managementandcatalog_managementpermissions, then generate a non-expiring token - App Secret — Meta for Developers → your app → Settings → Basic
Never use the temporary 24-hour token shown on the Getting Started tab: it will expire and break the sync. Always create a permanent system-user token.
Plugin configuration
- Go to WhatsApp → Settings.
- In the Meta Cloud API credentials section, paste the 5 values gathered above. The Webhook Verify Token field is pre-generated automatically — only change it if needed.
- Set the Displayed WhatsApp number in E.164 format without the + sign (example:
447911123456). This number powers the floating button and the CTAs. - Enable the modules you need in the Modules section. You can start with catalog sync alone and enable the rest progressively.
- Save.
Meta webhook configuration
The webhook lets Meta deliver incoming messages and delivery statuses to your site.
- Open WhatsApp → Dashboard in wp-admin: the Callback URL and Verify Token are shown there with Copy buttons.
- In Meta for Developers, open your app → WhatsApp → Configuration → Webhook.
- Paste the Callback URL and the Verify Token, then click Verify and save.
- In the fields list, subscribe to messages.
The Callback URL looks like https://your-site.com/wp-json/dfwc/v1/webhook. Every incoming request is validated with an HMAC SHA-256 signature against your App Secret: unsigned or badly signed requests are rejected.
Testing the connection
From WhatsApp → Dashboard:
- Test API connection — checks your credentials by querying your Phone Number ID and shows the verified number.
- Send a test message — enter a number in E.164 format without + and send a test text message.
If the test message never arrives even though the connection is OK, check that the recipient has messaged your WhatsApp Business number in the last 24h, or use an approved HSM template: Meta only allows free-form text messages inside the 24-hour service window.
Module 1 — Catalog sync
Three modes available in Settings:
- Real-time — every product creation, update, stock change or deletion is immediately reflected on the Meta catalog.
- Batch — changes are accumulated and pushed hourly in batches of 50.
- Manual — nothing is sent automatically; you use the resync button.
Mapping rules:
- Each product gets a
retailer_idof the formwc_{ID}. - Variable products are not sent as-is: each variation is pushed individually with its own price, stock and image.
- Products without an image are skipped (Meta requirement).
- The
dfwc_catalog_product_eligiblefilter lets you exclude products by code, anddfwc_catalog_product_datalets you modify the payload.
The WhatsApp → Catalog page shows success and error counters, the last 50 events log, and the Run resync button which re-pushes all eligible products in batches of 100.
Module 2 — Conversational ordering
The conversation module automatically replies to incoming messages using a state machine: idle → browsing → selecting_qty → reviewing → awaiting_payment, plus a human_handoff state.
Recognized keywords (French and English in the same conversation):
menuorcatalogue— shows the interactive product list (up to 30 items, connected to the Meta catalog)cartorpanier— shows the cart contents with Pay / Continue / Clear buttonscheckout,payorpayer— generates the payment linkhuman,humainoraide— hands off to an advisor (e-mail sent to the configured address)resetorannuler— resets the conversation
Any other text triggers a free-text search across your products. The customer’s cart is kept in the conversation and linked to their WooCommerce account if their number matches an existing billing_phone.
The welcome and fallback messages are customizable in Settings. The WhatsApp → Conversations page lists all conversations and lets you review each thread in a WhatsApp Web-style view.
Module 3 — Abandoned cart recovery
How it works:
- The plugin captures visitor carts (WooCommerce session + 7-day fallback cookie) and makes the phone field required at checkout.
- After the abandon threshold (60 minutes by default), the first reminder fires. Reminders 2 and 3 follow their own delays (24h and 72h by default, expressed in minutes in Settings).
- Each reminder uses a Meta HSM template configured per step. If the template fails, a plain text message is attempted as fallback.
- The third reminder can attach an existing WooCommerce coupon code, applied automatically at checkout through the recovery link.
- When the customer completes their order, the cart is marked recovered and reminders stop.
Creating the HSM templates
In Meta Business Suite → WhatsApp Manager → Message Templates, create 3 templates (e.g. dfwc_abandoned_cart_1, _2, _3) with:
- A body containing two variables:
{{1}}= customer first name,{{2}}= cart total - A URL action button with a
{{1}}variable at the end of the URL, pointing tohttps://your-site.com/wp-json/dfwc/v1/recover/{{1}}
Create each template in your customers’ languages: the plugin detects the locale and sends the right version. Once the templates are approved by Meta, enter their names in the plugin Settings.
The WhatsApp → Abandoned carts page shows the total, carts currently in reminders, recovered carts and the recovery rate.
Module 4 — Payment and notifications
The payment link generated in the conversation is an HMAC-signed token (SHA-256, WordPress salt + plugin secret) containing the cart, the expiry and the conversation ID. When the customer clicks:
- The token is validated and decoded.
- The WooCommerce cart is rebuilt server-side.
- The customer’s phone is pre-filled at checkout.
- The URL is cleaned by redirect.
Link validity is configurable (Settings → Payment). An expired link shows an error message inviting the customer to request a new one via WhatsApp.
Automatic notifications (individually togglable):
- Order confirmed — sent on transition to Processing, with number and total.
- Order shipped — sent on transition to Completed, with the tracking number detected from Shipment Tracking, AfterShip or the
_tracking_numbermeta, and a tracking CTA button. - Payment failed — sent on transition to Failed, with a retry-payment button.
Floating button and CTAs
- Floating button — togglable in Settings, position in any of the 4 corners, custom label, hideable. The
templates/frontend/whatsapp-button.phptemplate can be overridden by copying it toyour-theme/dfwhatsappcommerce/whatsapp-button.php. - Product page CTA — an “Order via WhatsApp” button under the add-to-cart button, with the product name and link pre-filled.
- Cart CTA — a “Complete via WhatsApp” button with the cart total.
- Checkout CTA — a discreet help link.
- Shortcode —
[dfwc_whatsapp_button text="..." message="..."]for manual placement anywhere.
Clicks on all these elements are pushed to the dataLayer (prefix dfwc_) for GA4 / Google Tag Manager.
Logs and troubleshooting
The WhatsApp → Logs page shows all events with level filters (debug → critical) and channel filters (api, webhook, catalog, conversation, cart, payment). Log level and retention are configurable. Logs are also visible in WooCommerce → Status → Logs under the dfwhatsappcommerce-* sources.
Common issues:
- Webhook fails verification — make sure your site is served over HTTPS with a valid certificate, permalinks are not set to “Plain”, and the Verify Token pasted at Meta matches the one in Settings.
- Incoming messages never arrive — check that the
messagesfield is subscribed in the Meta webhook configuration, and that the App Secret is correct (an invalid signature silently rejects requests — visible in the Logs, webhook channel). - Catalog sync fails — make sure the system token has the
catalog_managementpermission and the Catalog ID matches the catalog linked to your WhatsApp Business account. - Reminders never fire — check that WordPress cron is running (WP Crontrol can show
dfwc_process_abandoned_carts), and that the HSM templates are approved by Meta.
Uninstall
Deactivating the plugin keeps all data. Deleting it from the Plugins page triggers uninstall.php: the 5 tables are dropped, options and cron events removed. WooCommerce orders created via WhatsApp are never touched.