Skip to main content

Configure Hosted Payment Pages in Previous Zuora Quotes


Configure Hosted Payment Pages in Previous Zuora Quotes

If you have an older version of Zuora Quotes prior to version 5.100 (Q2 '13), the information below will guide you through the process of adding Hosted Payment Pages to a Salesforce Visualforce page or Salesforce Sites page. Once this is done, a sales representative in your system can submit an order that includes payment information in a PCI-compliant way.

If you are using version 5.100 (Q2 '13) and higher, we've introduced a simpler methodology for you, and you should follow the new instructions posted here. The instructions documented in this article are for users of older versions of Zuora Quotes - version 5.92 (Q1 '13 release) or earlier.

Hosted Payment Pages Salesforce Implementation Process

Use the following steps to set up Hosted Payment Pages for your site: 

  1. Install the Hosted Payment Pages package in
  2. Create a hosted payment method page in your Zuora tenant
  3. Configure Hosted Payment Pages settings in
  4. Test the Hosted Payment Pages implementation
  5. Integrate with Zuora Quotes

After installing and configuring Hosted Payment Pages on, see Basic Hosted Payment Pages Integration and Advanced Hosted Payment Pages Integration for examples about using and customizing Hosted Payment Pages.

Hosted Payment Pages Salesforce Page Flow

The implementation contains three VisualForce pages: HPMSample, HPMCallback, and HPMConfirm. 

The following image provides an overview of the page flow:



This page has an HTML div element that serves as the parent container. It encapsulates all of the components and business logic required to integrate with Zuora HPM, including:

  • The Hosted Payment Pages iframe
  • A Submit button that submits the HPM request to Zuora
  • JavaScript code that handles page redirect per HPM callback status

This VisualForce page is backed by the Apex class HPMSampleController, which is responsible for: 

  • Loading the Hosted Payment Pages custom setting
  • Generating the signature required to load the Hosted Payment Pages iframe
  • Processing the callback error messages


The HPMCallback page is the Hosted Payment Pages hosted payment method callback page registered with the Zuora hosted payment page definition. This page validates and processes the Zuora callback, and hands over the callback results to the parent container (HPMSample).  

This VisualForce page is backed by the Apex class HPMCallbackController, which is responsible for processing the callback request and validating the callback signature.  


This page displays the Payment Method ID upon callback success.