Adding Online Bill Pay to Website – 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

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

How to Find and Enter in Payments

Payments made by your customer through your website will not appear directly in Probill. To access these payments go to the Main Screen in Probill and select Online > Credit Card Terminal.

Once you are logged in, select Reports from the menu options.

For credit card transactions select “Sales by Source” this will give you a list of all of the credit card transactions grouped by how they were processed.

For bank drafts select “Settled by Source” this will give you a list of all the bank drafts grouped by how they were processed.

Transactions put through directly in Probill will be marked under the “Probill” heading. Transactions put through on your website will be under the “Online”. You will need to go through these “Online” transactions and enter them individually into Probill as you would with a check payment using the payment’s authorization code as a reference number.