WhatsApp Commerce Hub: Build, Sell, and Manage your Business entirely from WhatsApp.

Unlock conversational commerce. Bridge your store inventory directly to WhatsApp customer chat threads.

1. Introduction

The WhatsApp Commerce Hub is a technical middleware orchestrating interaction between e-commerce backends and Meta's WhatsApp Business Cloud API.

Our engine manages message queues, dynamic product list messages, session state carts, and instant payment verification callbacks.

Key Pillars

Zero Friction Commerce

Customers discover items, configure baskets, drop location pins, and complete payments without leaving WhatsApp.

Bi-Directional Sync

Real-time synchronization between WooCommerce, Shopify, or custom ERPs and the WhatsApp Catalog API ensures zero overselling.

Localized Payments

Native integration with regional mobile money (EcoCash, OneMoney) and international credit cards (Visa, Mastercard, Stripe, Paynow, PesePay).

Platform Features

Automated Messaging Engine

Automated customer messaging handles inquiries and guided product catalog journeys 24/7.

Native WhatsApp Catalogs

Dynamically generated multi-product listings allowing users to browse store stock through rich media cards.

Session-Based Shopping Cart

Persistent shopping carts that track user selections across chat sessions, synchronized with your backend OMS.

Automated Tracking & Geocoding

Status updates and dispatch receipts. WhatsApp location pins are geocoded via Google Maps for automated shipping fee calculations.

2. Getting Started

Step 1: Customer Account Sign Up & Login (Email & Phone Number)

First, visit https://dashboard.whatsappcommercehub.com. Create your account or log in by entering your Email Address and Phone Number. An instant verification code (OTP) will be sent to your phone to confirm your account and log into your merchant dashboard.

Step 2: Business Profile Setup

Inside your dashboard, open Settings ➔ Business Profile to set your store name, primary support email, phone number, operating currency (USD, ZWL, ZAR), and tax settings.

Step 3: Connect Integrations & Store

Navigate to Integrations to connect your WooCommerce store website, Meta WhatsApp Catalog, and PesePay Payment Gateway following the simple steps below.

3. Merchant User Guide

3.1 Dashboard & Metrics

Monitor gross revenue, active sessions, conversion rates, and live inbound orders.

3.2 Products & Stock Control

Create and edit products with SKUs, prices, stock levels, and media thumbnails. Out-of-stock items automatically hide from WhatsApp catalog messages.

3.3 Order Fulfillment & Status Lifecycle

Manage order stages: PENDING_PAYMENT, PAID, PROCESSING, SHIPPED, and COMPLETED. Tracking numbers dispatch automatically to WhatsApp.

3.4 Broadcast Campaigns

Send bulk marketing messages using approved Meta templates. Filter target customer segments and monitor conversion ROI in real time.

4. Commerce Engine

The Hub's commerce engine utilizes Meta's Multi-Product Messages (MPM) allowing shoppers to view section lists of up to 30 items with full-screen PDP cards directly inside WhatsApp.

Session carts reserve inventory for 15 minutes during checkout, auto-decrementing stock upon successful payment webhook confirmation.

5. Simple Setup & Integrations Guide

No technical background needed! Follow these easy step-by-step instructions to connect your online store, WhatsApp catalog, and payment gateways in just 2 minutes.

Prerequisite: Sign Up & Account Login First

First, sign up or log into your account using your Email Address and Phone Number. Once logged into your dashboard, copy your integration keys and paste them into the fields below. Click Test Connection to verify!

Start Setup Now ↓

Integration	Dashboard Menu	What You Need to Copy & Paste	Where to Find It (Click Path)
WooCommerce Store	Integrations > WooCommerce	Website URL, Consumer Key, Consumer Secret	WordPress Admin ➔ WooCommerce ➔ Settings ➔ Advanced ➔ REST API
WhatsApp Product Catalog	Integrations > Meta Commerce	Meta Catalog ID, System Access Token	Meta Commerce Manager ➔ Settings ➔ Catalog Info
PesePay Payment Gateway	Integrations > Payment Gateways	Merchant Key, Encryption Key	PesePay Merchant Portal ➔ Developer Settings ➔ API Keys
Meta WhatsApp Cloud API	Integrations > Meta WhatsApp	Phone Number ID, Permanent Access Token	Meta Developer Portal ➔ WhatsApp ➔ API Setup

Visual Step-by-Step Setup Guides

woo

1. WooCommerce Connector Setup

Connect your online store so WhatsApp automatically fetches items and sends orders

Easy 3-Step Walkthrough:

Step 1

Log into your WordPress website admin screen (e.g. yourwebsite.com/wp-admin). Go to WooCommerce ➔ Settings ➔ Advanced ➔ REST API, click Add Key, select Read/Write permissions, and click Generate API Key.

Step 2

Copy your website address into STORE DOMAIN URL (e.g. https://kioskoshop.quatrohaus.com/), then copy and paste the Consumer Key (ck_...) and Consumer Secret (cs_...) into the fields below.

Step 3

Click the white Test Connection button. When you see a success message, click the green Save Integration button! You're all done!

Sandbox Mode Switch: Turn this switch ON if you want to test the system before putting in your real live store keys.

Store Domain URL: https://kioskoshop.quatrohaus.com/ Type your full store website link (must start with https://).

Consumer Key (CK): ck_5...859a The public key starting with ck_ generated from WordPress.

Consumer Secret (CS): •••••••••••• The secret password key starting with cs_ from WordPress.

2. Meta / WhatsApp Product Catalog Setup

Shows your store items directly inside WhatsApp so customers can browse catalog menus

Full 8-Phase Guide

Updated Setup Walkthrough:

Step 1

Locate Your Product Catalog in Meta:

• Primary Path: Meta Business Suite → Settings → Business Assets → Catalogs
• Alternative Path: Meta Business Suite → All Tools → Commerce Manager

Step 2

Copy your 15-digit Catalog ID from Commerce Manager → Settings → Catalog Info, and generate a permanent System User Access Token with catalog_management and whatsapp_business_messaging permissions.

Step 3

Paste credentials into the META CATALOG ID & SYSTEM ACCESS TOKEN fields below. Click Test Connection and Save Catalog Configuration to initiate live auto-syncing!

Open Complete 8-Phase Meta & WhatsApp Configuration Manual

Meta Catalog ID: 1725539045150247

System User Access Token: ••••••••••••

Instant Automatic Sync: Whenever you add or update a product on your website, it updates inside WhatsApp automatically!

Pese

3. PesePay Payment Gateway Setup

Accept EcoCash, OneMoney, Visa & Mastercard payments inside WhatsApp

Easy 3-Step Walkthrough:

Step 1

Log into your PesePay Merchant Account dashboard. Navigate to Integration Keys under developer settings.

Step 2

Copy your PesePay Merchant Key and PesePay Encryption Key and paste them into the fields shown in the screenshot below.

Step 3

Click Test Connection, then click Save Integration. You can now accept instant EcoCash & Card payments from WhatsApp shoppers!

PesePay Merchant Key: a111...4ac4

PesePay Encryption Key: ••••••••••••

Testing Tip: Leave fields empty or use sandbox values to test via our mock sandbox payment page without using real money.

API

4. Meta WhatsApp Cloud API (Optional)

Connect your official WhatsApp Business phone number for live customer messaging

Easy 3-Step Walkthrough:

Step 1

Log into Meta Developer Portal (developers.facebook.com) ➔ WhatsApp ➔ API Setup. Copy your Phone Number ID and Graph Access Token.

Step 2

Paste the keys into the dashboard input boxes, then copy Your Webhook Web Address (shown on the right side box) into Meta Developer Webhooks configuration with token whatsapp-verify-token.

Step 3

Click Save Configuration. Your WhatsApp Business number is now live and ready to take customer orders!

Phone Number ID: 1155077781030747

Permanent Access Token: ••••••••••••

Your Webhook Address: http://localhost:3001/webhooks/whatsapp

Verification Token: whatsapp-verify-token

Need assistance setting up your store?

Our support team is ready to walk you through connecting your WooCommerce store, Meta Catalog, or PesePay account.

Contact Support