Adding Online Bill Pay to Your Website Using USAePay

 

If you are set up to process credit cards and/or draft bank accounts through Probill you are also able to take online payments through your website. If you are interested in setting this up please read through this entire guide before you start and then call us at 1-800-409-4997 as we need to generate a source key for you to be able to accept these types of payments.

  1. Once you have a source key generated, log in to the gateway by going to the Main Screen in Probill, select Online > Credit Card Terminal. Select Settings > Source Keys. Select Edit next to the newly generated source key named “online”.
  2. The settings for your payment form are located under “Payment Form Template”. Here you can change the colors of your form as well as the form title. The colors are in a hex code format, in you wish to change them but don’t know the hex codes of the new colors you would like here is a good utility for that information.  You can also preview your form by clicking “Preview ePay Form”.
  3. After you have this form looking the way you would like copy the link under “Payment Form Link”
  4. In the HTML code of your website where you would like the option to allow your customers to pay their bill online enter this code:
<form action=”https://www.usaepay.com/interface/epayform/”>
<input type=”hidden” name=”UMkey” value=”[key]”>
<input type=”hidden” name=”UMcommand” value=”sale”>
<input type=”text” name=”UMamount” value=”Enter Amount”>
<input type=”hidden” name=”UMinvoice” value=”[invoice]”>
<input type=”hidden” name=”UMhash” value=”[hash]”>
<input type=”submit” value=”Continue to Payment Form”>
</form>

On your website this code will appear to your customer as:

 

The customer can enter the amount they wish to be charged and then select “Continue to Payment” to fill in the rest of the billing information.

If you wish to add other fields to this example form you can do this by making simple changes to the HTML code. For example: if you wish to add an invoice number field to this simple form you would make these changes.

<input type=”text” name=”UMinvoice” value=”Enter Invoice Number”>

Changing the input type from “hidden” to “text” allows the field “UMinvoice” to be visible. Getting rid of the brackets in the value field allows this area to have the text that you would like your customer to see. In this example we used “Enter Invoice Number” to your customer this code will now appear as:

 

You can do this to any of the fields in the code above but you cannot get rid of any of these fields as they are necessary for the form to work. For a list of all of the available fields, what they do, and other features you can implement click here.

For a working example of how this system would look click here

For more information on how to see these payments and add them to your customer’s records please click here

  • **If a customer pays their bill online this payment will not show up directly in Probill**

Start Your Free Trial Today. It's Fast And Easy!

Fully functional and good for 45 days!

Get In Touch Today

For all questions and inquiries, feel free to get in contact with our friendly team today.