Appearance
Widget checkout
When a customer pays a WHMCS invoice with Zoho Payments, they never leave your site. Instead of a redirect to an external page, the payment options open in an embedded Zoho Payments widget right on the invoice. This keeps the checkout fast and on-brand, and it lets WHMCS confirm the result the moment the customer finishes paying.
This page walks you through what the customer sees, what happens behind the scenes, and how the two supported Zoho data centres fit in.
What is the widget?
The widget is Zoho's secure, in-page payment component. Card details and other payment data are collected by Zoho inside the widget — your WHMCS server never handles raw card numbers.
The checkout, step by step
1. The customer clicks Pay Now
On their invoice, the customer selects Zoho Payments and clicks Pay Now. WHMCS loads the embedded widget in place, using your Widget API Key and Account ID to initialise it for your Zoho account.
2. The widget opens
The customer sees the Zoho Payments widget with the available payment options. They enter their details and complete the payment inside the widget — nothing leaves the invoice page.
If the widget doesn't appear
A blank or missing widget almost always means the Widget API Key or Account ID is wrong or empty. Re-check both under Setup → Payment Gateways → Zoho Payments and open the browser console for clues.
3. WHMCS verifies the payment
When the customer finishes paying, WHMCS does not simply trust the widget's on-screen result. It verifies the payment against the Zoho API to confirm the money was actually taken. This API check is what makes the outcome trustworthy — a tampered browser can't fake a paid invoice.
4. The invoice is marked Paid
Once Zoho confirms the payment, WHMCS marks the invoice Paid, records the transaction details, and stores the processing fee Zoho reports so your accounting stays accurate.
Client area → Invoice → Pay Now (embedded Zoho Payments widget)
India and US data centres
Zoho runs separate data centres, and your account lives in one of them. The gateway supports both:
| Data Center | Zoho domain | Choose this if… |
|---|---|---|
| IN | .in (India) | Your Zoho account and Developer Console are on zoho.in |
| US | .com (United States) | Your Zoho account and Developer Console are on zoho.com |
Set the Data Center field to match where your Zoho account lives. This must be the same data centre you used when creating your OAuth app and refresh token — mixing them causes token and widget errors. See the Zoho OAuth setup guide to line these up correctly.
Test before you go live
Turn Test Mode on and run a payment through the widget end-to-end before switching to live. Confirm the invoice reaches Paid and the fee is recorded. When it all works, follow the going live guide.