Overview

CardPointe Hosted Payment Page (HPP) is a secure, online checkout page to capture payment information from your customers. It includes a 'Pay/Buy' button and a 'Donate' button to allow users to make secure, PCI-compliant payments.

The CardPointe HPP is directly integrated with the CardConnect Gateway, which offers users one centralized, secure payments solution; making this the perfect tool for businesses with online stores that are in need of simple eCommerce functionality. CardPointe HPP is a standard feature of the CardPointe platform and is complimentary for all CardPointe users.

Features

The CardPointe HPP comes with editable design options to customize your online checkout pages to match your business’ branding.

Hpp Checkout Page Example

Using the CardPointe Hosted Payment Page, you can:

  • Add custom fields to the payment page
  • Create a customizable "Pay" button (Pay Now, Buy Now, and Donate buttons)
  • Include reCAPTCHA Verification, which verifies that the consumer is a human and not a bot when completing the payment form. This is an optional feature that you must activate.
  • Customize a payment confirmation page and receipt.
  • Define advanced settings, such as:
    • Maximum number of declined payments
    • Minimum payment amount
    • Maximum payment amount 

Why Use the CardPointe HPP? 

  • Reduced PCI-DSS scope
    Sensitive payment data will never reside in your system, thus reducing your PCI scope.
  • Access to CardPointe’s Advanced Security Features
    Access includes tokenization and double-encryption of credentials. Our customer login feature allows consumers to enter payment information and have a token stored on their profile, which can be used for future payments.
  • Mobile Friendly
    The CardPointe HPP is a mobile responsive form, making it easy for your customers to pay on-the-go using their phones and tablets.

Adding CardPointe HPP to Your Account

  1. Log in to CardPointe.
  2. Navigate to the Marketplace tab.
  3. Scroll to the CardPointe section and click Learn More for CardPointe HPP.
  4. Complete the form. Our support team will be in contact to provide more information.

Setup Your CardPointe HPP

Once you receive CardPointe HPP access, you can begin customizing your HPP page. Each tab at the top opens a module for customizing your HPP.  

Upon logging into CardPointe HPP, you are taken to the 'Set Up' tab. From here, you can configure your hosted payment page to suit your business's unique needs. 

Hpp Setup Tab 1
  1. Upload your logo using the Upload a Different Logo button. You can use any of the following formats: gif, .jpeg, .jng and .png. 

    If you do not upload a logo, then the CardConnect logo displays on your payment page. 
  2. Enter your company information.
    1. Enter your Merchant ID (MID). To add multiple merchant IDs, click the plus sign adjacent to the Merchant ID field. 

      If you are using a testing mode for your HPP, enter 'test' for the Merchant ID
    2. Enter your Username and Password.  These are your API Live credentials.  

      If you are using a testing mode for your HPP, use 'testing' for the Username and 'testing123' for the Password.
    3. Enter 'fts' for the Gateway URL unless otherwise instructed.
    4. Select the Transaction Type that the payment page will process:
      • Authorize & Capture
      • Authorize Only
      • Authorize Only - $1
    5. Select a Status for your HPP Page.
      • Live
      • Test Mode (Sandbox)
  3. Check the payment types the HPP can accept. 
  4. If you accept electronic checks, ensure Yes is set to green. 
  5. To configure Advanced options, toggle the Yes to green to set the following:
    • Max Declined Payments: The number of declined payments a customer may attempt. 
    • Min Payment Amount: This is the minimum amount your customer can spend before a payment is accepted. A value of 0.00 means there is no limit.
    • Max Payment Amount:This is the maximum amount your customer can spend on a payment. A value of 0.00 means there is no limit.
  6. Click Save and Continue. 

Design Your HPP

Design your HPP to mimic your company's branding for a truly unique shopping experience for your customers. The Design tab allows you to customize your customer-facing pages as well as customize your CSS. Each tab at the top opens the design module for that page.

Hpp Design Tab Overview 2
  • Payment Page
    This page displays to your customers when they are ready to input their payment information.
  • Confirmation Pages
    • Payment Approved: The page the customer sees when their payment is approved. 
    • Payment Declined: The page the customer sees when their payment is declined. 
  • Email Receipt
    The receipt that is emailed to the customer.
  • Custom CSS
    This module allows you to implement your own CSS design for your site. 

Each page in the Design tab (Payment Page, Confirmation Pages, and Email Receipts) can be modified by dragging and dropping elements. You can pull elements from the left pane (in dark blue) and drop them anywhere you like on the page, as well move existing elements around on the page. 

  1. Select a page to work on. 
  2. Drag and drop Elements, Fields and Optional Input Fields from the left pane onto your page. Re-order those elements on the by dragging and dropping. To drag and drop:
    1. Click and hold the element you want to move.
    2. Drag the element to the desired location.  
    3. Let go of the mouse. The element drops.  
  3. To add columns:
    1. Click the columns dropdown. 
    2. Select a number.
  4. To delete items, click the red trashcan icon.
  5. To update the background or the text style, click the Design Settings button (upper right hand corner of the screen). The design window opens.
    1. To change the color of the text or the background, click the square next to the label and choose a color from the color picker.  
    2. To select a new font or font size, make a selection from the dropdown.
    3. Click Save.    
  6. To see what your page will look to customers, click the Preview button in the right hand corner.
  7. Once you are satisfied, click Save. Click Save All to save all of your pages.  

Build Your Link

The Connect tab page provides the links you need to integrate your HPP into your site.  The options include: 

  • Full Payment Form URL and iFrame which directs to a full payment page. 
  • Mini Payment Form URL and iFrame which directs to an abbreviated payment form that includes amount, name on card, card number, expiration date and CVV code.

You can also customize the link and pay buttons to be unique for a particular monetary amount, invoice number or customer number. 

Customize your link and pay buttons

Hpp Customizelink

To build your payment link and pay buttons:

  1. Click the 'Build your link and pay buttons' button.
  2. For each Pay Button: 
    1. Click Customize Button to change the text, color and hover options. 
    2. Once you are satisfied, click Save. The button on the screen displays your changes.  
  3. Copy the URLs you need from this page and integrate them into your site. 

Auto Notifications

The Auto Notifications section allows you to enable email receipts to be automatically sent to your customers for each transaction. To enable this function, simply click the check mark next to Always send to customers

The following fields are available for customization:

  • 'From' Email Name: Name that the email will appear from
  • 'From' Email Address: Email address that the email will appear from 
  • 'To' Email Address: Email address that will receive each email notification per each transaction
  • Return to Website: This adds a ‘Return to Homepage’ button to your confirmation page
  • Webhook URL (optional): Provides other applications with real-time information (approved payments only) from your HPP. 
    • Example: You can use a webhook URL to send payment details to your account software (if it supports webhooks) 

Add and Manage Users

The Users tab contains a list of all HPP users for your account, including their username, first and last name, email address and access level (L=Limited User or S=Super User). Only Super Users have access to the Users tab. 

Limited User vs. Super User

The main difference between a Limited User and a Super User is that Limited Users do not have access to the Users tab and cannot create or manage HPP users. Super Users dictate if a Limited User has access to the SetupDesign, and Connect tabs. When creating a Limited User, check the box next to the tab you would like an individual to have access to.

Hpp Usertypes

Create an HPP User

  1. Click the Add User button.
  2. Enter the new user's information. 
  3. Select a Permission. If selecting a Limited User, check the tabs that you would like the user to have access to. 
  4. Click Save.

Edit a User

You can edit a particular user from the Users tab clicking the pencil icon or delete a user via the trash can icon. 

Viewing Transactions

To view your transaction history, navigate to the Transactions tab, which is available to Super Users and Limited Users. Here, you will see a table of all of your transactions. To void or refund a transaction, click the pencil icon, which will prompt a popup box to appear. This popup box has a Void and Refund button and also includes transaction details, such as order number, total, date, status, location, etc.

Hpp Transactiontypes


You can determine the order in which the transactions appear. For each column (ID #, Items, First Name, Last Name, Address, Total, Date and Location), you can select whether the data displays in ascending or descending order by clicking the header.

Hpp Transactions List

Searching for Transactions

To search for a particular transaction, use the search bar and enter any qualifying information about the transaction. You can also filter transactions based on dates using the Filter by Date block. 

Hpp Search Transactions

Exporting Transactions

To export transactions, for bookkeeping purposes or general reporting, click Export to CSV button. An Excel spreadsheet with records of each transaction will download.

Hpp Export Transactions

Support

Please direct all HPP support-related inquiries to our CardPointe Support team. The CardPointe team can be reached by email at cardpointesupport@cardconnect.com or by phone at 877.828.0720 > option 1 > option 1.

FAQs

Have questions about our Hosted Payment Page solution? We have answers! Select a question below for more information.

What is a hosted payment page?

A hosted payments page (HPP) is a secure checkout page that captures payment information from a merchant’s customers. It often includes a 'Pay/Buy' button or a 'Donate' button that allows users to make payments to the merchant.

Why do I need a HPP?

If you would like to accept payments online, our HPP could be the solution for you. The HPP is a simple, customizable page for your customers to enter their payment information. 

CardConnect's HPP has the following benefits:

  • Simple implementation 
  • Your pay page integrates directly with your current website
  • You can integrate the payment button with your invoicing or accounting system
  • You can accept payments from a mobile device (i.e. mobile phone or tablet)
  • Using a third party gateway, like CardConnect, to host your payments page lowers the potential for fraud, maintains PCI compliance, and reduces your exposure for PCI requirements.

What payment types are accepted?

The CardPointe HPP accepts credit cards and eChecks.

Do I need a programmer to implement CardPointe HPP?

Not at all! Rather than receiving a long, technical document to hand-off to a programmer to develop, CardPointe HPP's design engine allows you to design an online, custom pay page in minutes. You can easily upload your logo, choose colors, fonts, layout and add custom fields -- all without a programmer.

Check out the Design your HPP section of the CardPointe HPP guide to see what you can do!

How do I set up a HPP?

First, you'll need to let us know that you're interested in using the HPP. You can contact us by filling out this form

From there, we will send you the information you need to setup your HPP. Full details for setting up and customizing your own page can be found in the complete guide, CardPointe HPP.

How do I make changes to the HPP once it is set up?

Simply contact CardPointe Support (cardpointesupport@cardconnect.com | 877.828.0720 opt 1 > opt 1) to make any desired changes.

Are transactions processed by the HPP accounted for in CardPointe?

Yes, transactional date from CardPointe HPP is included in the CardPointe Platform -- with up to 10 custom fields that assist you in reporting and reconciliation.

How do I connect the HPP to my website or invoicing system?

When you save your design and custom payment buttons, the HTML code for you HPP is displayed. Simply paste the HTML code into your website and the insert the payment button code on your invoices.

What are some examples of custom fields I can add to a form?

By simply dragging pre-configured fields to your Hosted Payment Page, you can add:

  • Invoice number
  • Customer number
  • Line item (SKU) information

We also have a drop-down form builder, so you may add options for billing or service locations. For example, you can add and track payments by store locations, a region or by the name of a service provider. These custom fields are sent directly into CardPointe.

Does the HPP work on mobile devices?

Yes! CardPointe HPP is a mobile responsive form, meaning the page automatically adjusts if the customer is using a phone or a tablet. 

Notifications and web hooks - what are the options and how do I use them?

When a transaction occurs, CardPointe HPP can send an email to a user at your company which contains the details of the transaction. Web hooks allow the transaction data to feed other systems, such as your accounting or billing system, saving your staff time on data entry and improving reconciliation with CardPointe. Once a payment is received, email notifications are sent and web hooks can be triggered.

Can I pass my own custom fields into CardPointe HPP?

Yes. If you have custom data that you want to make sure is tied to a transaction, you can create hidden fields in CardPointe HPP, and those fields can then be “saved” with the payment made by the consumer. If you use our web hook service, which uses JSON, the hidden fields will be passed back with an approved transaction, so you can use them and correlate them to the payment that was just approved.

If I already have paid a programmer for my current HPP, why would I change to CardPointe HPP?

There are benefits of not having a programmer to design your payment page. For example, you can make changes quickly and directly to your HPP, saving you time and money. You have complete control over the look and feel of your HPP, and can change or update it at any time. 



What is the cost of the HPP?

If you are a gateway customer of CardConnect, it is included in your monthly gateway fee. 

What if I want to integrate CardPointe HPP into my enterprise systems (Oracle, SAP, etc.) or need functionality that may not exist in the current HPP?

Our preferred partner, CoreCommerce, offers a robust eCommerce solution that provides business owners with the ability to create and manage online stores — complete with custom features and dedicated customer support.

Reach out to CardPointe Support (cardpointesupport@cardconnect.com | 877.828.0720 opt 1 > opt 1) to learn more!

Downloadable Materials