Zuora Hosted Checkout Pages are no longer under active development. Customers should use Payment Pages 2.0 for their secure payment acceptance requirements.
This article explains how to use hosted Checkout pages with your website.
For instructions about implementing hosted pages in Zuora Quotes or in your own Visualforce applications using our Zuora CPQ development toolkit, see PaymentPage Component.
How Checkout Pages Work
The following illustrations describe the Checkout page flow:
Configuration Pages in Zuora
Using the left navigation bar in Zuora, navigate to the Checkout pages configuration pages by navigating to Settings > Commerce > Manage Checkout Pages. The key configuration pages are the List, New/Edit, View Detail, and Preview pages.
By default when performing the navigation above, you will see the List Page for all existing checkout pages that have been created in your Zuora tenant. It is also the starting point to create new checkout pages.
New / Edit Page
The New / Edit page is shown when a user chooses to create or edit a checkout page. The New / Edit page enables the configuration of a hosted page, such as:
- The product and rate plan to sell on the Checkout page
- Which account and billing fields will appear and/or require input
- The labels of the displayed fields
- The payment gateway to associate with the hosted page
- CSS code to create visual style
View Detail Page
This page is presented after you save a checkout page or click the View link for an existing checkout page on the List Page. This View Detail page provides a read-only overview of the configuration details for this checkout page, provides the HTML iframe code used to embed the checkout page on your website, and provides buttons to preview and edit the checkout page.