Reusable Per-Client Payment Page

The Scenario

Partner (You) already sends out emails alerting the client that a new invoice is ready but would like to add a click-to-pay link to those communications. On the page, rather than just showing a single invoice, partner would like to present all outstanding invoices for the client so that payment can be accepted on all of them from the single payment page. Then, once the payment is completed, partner would like to receive back the payment information (across the multiple invoices) so that accounts receivable info can be updated within the partner system.

The Solution

  • The partner creates static URLs such as partnersite.com/uniqueId and generates them uniquely for each client.
  • Whenever an invoice is generated, partner includes the new URL as a payment link on the “invoice due” email that goes out to that client.
  • When the client clicks the link, the partner site queries the partner database for all outstanding invoices for the client (not just the most recent invoice).
  • Partner then passes all results to ClientPay for presentment on the payment page and opens up that ClientPay page within an iframe on partnersite.com/uniqueId.
  • Client fills out relevant information on ClientPay page and completes payment.
  • Once payment is completed, ClientPay post all payment information to the parent window using the window.postmessage() method. Partner now has all relevant information for updating receivables.

Pros and Cons

ProsCons
URL that the client receives is multi-use. Client can make a partial payment, then return the next day and click the same link to pay off the remaining balance.More work to set up than presenting a single-use ClientPay click-to-pay link.
Link is always up to date. It will always have the latest available invoice information.
Seamless payment experience for Client.
Immediate post-back allows balances to get updated in real time within the partner app.

Sample Page