Overview
Hosted Checkout 2.0: a payment page hosted by Tonder that you redirect to or embed, with no card form to build.
Hosted Checkout is a payment page hosted by Tonder. Your backend creates a session for one purchase, you send the customer to the session's URL — or embed it in your page — and Tonder collects the payment details, runs 3D Secure and retries, and reports the result back. Card data never touches your systems.
Try it before you write code. The interactive demo lets you switch templates, colors, payment methods and languages, pay with sandbox cards, and see the exact request your integration would send.
What's new in Hosted Checkout 2.0
| Hosted Checkout 2.0 | |
|---|---|
| Design | A new checkout with an order summary, three templates (ecommerce, deposit, subscription), fonts, corner shapes and automatic button contrast. |
| Button and language | Choose the call to action (pay, deposit, subscribe or your own text) and the language the page opens in (es, en, zh). |
| Hosted or embedded | Redirect the customer, or load the checkout in an iframe and follow it with events in your page. |
| Payment methods | Cards, saved cards, Apple Pay, SPEI, OXXO Pay, Mercado Pago, SafetyPay and Neosurf. |
| One payment id | Every payment session returns its payment_id at creation. It never changes, even when the customer retries. |
| Direct API processing | Payments run through the same Direct API as the Web SDK, so you receive the standard Tonder webhooks. |
| Payment links | A payment link created in the Dashboard is a Hosted Checkout session, listed next to the ones your API creates. |
The endpoints are the same as before — POST /checkout/v1/sessions and its companions. New
payment sessions use the 2.0 design unless you ask otherwise. If your integration predates 2.0,
see Legacy (v1).
Benefits
- Launch with one API call: create a session and redirect.
- Accept cards without handling card data on your servers — Tonder covers PCI DSS.
- Match your brand with a template, your logo, colors, font and button text.
- Offer every payment method that is active for your business, on one page.
Two kinds of session
session_type | What it does |
|---|---|
payment (default) | Charges the customer. A payment is created together with the session, so you get its payment_id immediately. |
enrollment | Saves the customer's card without charging. See Save a card without charging. |
High-level flow
Your server calls POST /checkout/v1/sessions with the customer, the amount and the items.
Tonder returns the checkout url and the payment_id.
Redirect to the url, or embed it in an iframe.
They choose a method and pay on Tonder's page. If a card is declined they can retry in the
same session; the payment_id stays the same.
Tonder redirects the customer back to your site. Confirm the payment from your server with webhooks or by reading the session.
Next steps
Interactive demo
Configure the checkout live and copy the request.
Quickstart
Take your first payment in four steps.
Create a session
Every field of the request and the response.
Customize the checkout
Templates, colors, button and language.
Embed the checkout
Show it inside your page and listen to its events.
API Reference
The endpoints, with the request building live.