FE v24.4

Owned by Timothy Taylor
Last updated: Aug 22, 2024 by Mark Mauer
7 min read

The following enhancements and fixes were made to MyBridgePay in v24.4. These changes are scheduled for production deployment in August 2024.

  1. Hosted Payment Page

  1. MasterCard Click to Pay

  1. API Enhancements

1. Hosted Payment Page

 

https://youtu.be/hC7MOWizPuk

We are excited to announce the release of BridgePay’s Hosted Payment Page, which will replace the ecommerce product, WebLINK 3.0.  Users can easily setup and capture payments via a mobile responsive customizable payment form.  The Hosted Payment Page allows the merchant to brand the page with their logo and chosen colors to keep the look and feel of the merchant’s website.  The page and all payments are hosted by BridgePay giving the merchant peace of mind with security and PCI requirements.  The Hosted Payment Page supports both a redirect setup and an iframe setup.  The Developer API and additional setup instructions are found in the BridgePay Developer Center.

The following enhancements review the user enablement process for the Hosted Payment Page in MyBridgePay.

Setup a Hosted Payment Page today!

Hosted Payment Page Right Enablement

First, any user configuring the Hosted Payment Page must enable the right on the role assigned to that user.  This can be done in the Admin Module.  Simply add the Hosted Payment Page Tab right to any role and select SAVE.  Assign this role to any user that needs the ability to configure a Hosted Payment Page.

 

001.png

Hosted Payment Page Configuration

Navigate to the Account Management Module and drill down to the Merchant Account level. The Hosted Payment Page tab is displayed.  If there is no tab displayed, please ensure the user has the Hosted Payment Page right enabled (see section above).  Accessing the Hosted Payment Page tab displays the configuration screen.  Setup the Hosted Payment Page as needed.  Ensure all required fields are completed before saving.  Only one Hosted Payment Page can be configured per Merchant Account.

002.png

Here is a list of all the different configuration options and a description of what they do.

  • Hosted Payment Page Base URL: This is the base URL of the hosted page.  This URL with additional Query String Parameters is used to display the page to the customers.  This field only appears after the Hosted Payment Page configuration is saved.

  • Enable iFrame Support: This toggles iframe support ON or OFF.  If enabled, the hosted payment page allows iframe payment collection for a more seamless payment form on your website.  If disabled, iframe support is not available and all transactions from an iframe will fail.

  • iframe Domain URL: This is the domain of the website the iframe payments originate.  This field allows for only 1 domain per Hosted Payment Page.  If an iframe payment is submitted to BridgePay from a domain that does not match the domain entered in the iframe domain URL field, all iframe payments will fail.  This is added security for the iframe Hosted Payment Page.

  • iframe Code: This appears if Enable iFrame Support is enabled in the current configuration.  The iframe code is provided and includes the base URL only.  The URL will also need to be updated with Query String Parameters so the page can be displayed to the customer.

  • Page Name: A unique page name for internal reference.  This is not displayed on the Hosted Payment Page.

  • Terms and Conditions URL:  The Terms and Conditions URL displayed to customers on the Hosted Payment Page.  The Terms and Conditions URL is optional and if left blank will not appear on the Hosted Payment Page.

  • Privacy Statement URL: The Privacy Statement URL displayed to customers on the Hosted Payment Page.  The Privacy Statement URL is optional and if left blank will not appear on the Hosted Payment Page.

  • Successful Payment URL: The URL a customer is directed to when a successful transaction is processed.

  • Failed Payment URL: The URL a custom is directed to when a failed transaction occurs.  This could be a decline or any error.

  • Page Preview: Clicking opens a new browser window and displays a preview of the Hosted Payment Page with its current settings.

  • Page is Live?: This toggles the customer facing page ON or OFF.  Select ON to present the Hosted Payment Page to customers to take live payments.  Select OFF to disable the Hosted Payment Page and no longer accept payments.

  • Company Name: The name of the company.  Will appear blank if left blank.

  • Category:  The category of the payment.  Will appear blank if left blank.

  • Payment Types: This displays checkboxes of the payment types setup within the Account Management tab for this Merchant Account.  For example, if there is no ACH processor setup on the Merchant Account, the ACH checkbox is not an option in the Hosted Payment Page configuration.  The same rules apply for the credit card brands.  If the Merchant Account Credit Card Processor is not setup with American Express or Discover, those checkboxes will not be an option in the Hosted Payment Page configuration.  Only the checked payment types are allowed on the live Hosted Payment Page.

  • Page Logo: This is the logo displayed on the Hosted Payment Page.  It is optional.  Recommended size is 400x200 pixels.

  • Display Divider: This toggle will display or not display the thick divider on the Hosted Payment Page.  If displayed, the divider is the Primary Color.

  • Primary Color: Sets the primary branding color.  It controls the divider color and the Submit Payment button color.

  • Page Background Color: Sets the page background color displayed on the Hosted Payment Page.

  • Section Background Color: Sets the background color of the Payment Information section of the Hosted Payment Page.

  • Header Text Color: Sets the color of the header text for Payment Details and Payment Information.

  • Payment Details Text Color: Sets the color of the Company Name, Category, and Amount text on the Hosted Payment Page.

  • Text Color:  Sets the color of all other text on the Hosted Payment Page.

There is a Page Preview that shows the current configuration in real-time as changes are made to the configuration settings. 

Creating Integration API Keys

To use the new Hosted Payment Page, an Authorization Token will need to be obtained via a Hosted Payment Page API call.  To make this API request you will need a Public API Key, an Application Name and an Organization ID for your Merchant Account.  These are all setup in Account Management.  Navigate to Account Management, drill down to a Merchant Account level and click the Processing Applications tab.  Enable the Hosted Payment Page toggle.  If there is no toggle displayed, please ensure the user has the Hosted Payment Page right enabled. 

After toggling ON the Hosted Payment Page, click Manage API Keys.

Click Create New Key.  Copy the Public Key, Application and Organization ID for later use.  Choose if you would like the API key to expire or not.  If the API key expires, access to the Hosted Payment Page will no longer be possible when using this API key.  Click SAVE when desired settings are in place.

Building the Hosted Payment Page URL

Now that the Hosted Payment Page has been configured and the API keys setup, it is time to build the URL for the Hosted Payment Page.  More information on building out the URL can be found here.  Once a fully built out URL is accessed, the Hosted Payment Page will load and can process transactions.  Here is an example URL with the basic Query String Parameters required to use the Hosted Payment Page.

UAT
https://www.bridgepaynetsecuretest.com/hpplive/paymentpage/{hppId}?amount={amount}&authToken={AuthToken}

PROD
https://www.bridgepaynetsecuretx.com/hpplive/paymentpage/{hppId}?amount={amount}&authToken={AuthToken}

These are all the supported URL fields.

  • Amount

  • Invoice Number

  • PO Number

  • Customer ID

  • Email Address

  • Mobile Phone

2. MasterCard Click to Pay

Mastercard Click to Pay allows customer to store multiple cards in one secure profile without sharing payment details every time the customer checks out online.  Click to Pay is used in conjunction with the Hosted Payment Page.

To enable Click to Pay on a Merchant Account, access MyBridgePay as a Reseller or Sales Agent user, click Account Management, drill down to the Merchant Account level and click the Gateway Configuration tab.

For the setting Enable Click to Pay on the Hosted Payment Page, enable the toggle.  A Merchant Website URL is required to enable Click to Pay.  Enter in the merchant website and click SAVE.

When the Hosted Payment Page is displayed, additional email and mobile phone fields are displayed.  These are used to search if the customer already has a Click to Pay account.  If there is not an existing Click to Pay account, there is an option to allow Click to Pay to save the customer’s card, email address and mobile phone number for future use.

  • If disabled, a normal transaction will be processed without using Click to Pay.

  • If enabled, the mobile number entered will be sent a text with a code that will need to be entered into the website.

Once verified, customers can use the card just added or add additional cards to their Click to Pay account.  Once the customer has chosen the card they wish to use, they simply click Submit Payment, and their payment is processed using Click to Pay.

Now the customer has a Click to Pay account.  When visiting the Hosted Payment Page again or any other site that uses Click to Pay, entering an email or mobile phone number will automatically recognize the customer, verify the returning customer using a code, and then allow for simple checkout.

3. API Enhancements

Hosted Payment Page API

Created a new Hosted Payment Page API with the following request types

  • API Authentication

    • Create API Keys

  • Create/Update Hosted Payment Page

    • Create and update configuration and look and feel

  • BridgePay AuthToken

    • AuthToken creation required for Hosted Payment Page access (Redirect and iframe)

Supported Browsers in MyBridgePay
The following browsers are supported in MyBridgePay when using the latest versions:

  • Google Chrome

  • Microsoft Edge

  • Mozilla Firefox

Property of BridgePay Network Solution ©2024