HPP Samples And Demo

Hosted Payments

Paymentsite Hosted Payments is a hosted payment processing solution that allows merchants to collect payments from a web page without concerns about Payment Card Industry (PCI) security standards for collecting and storing sensitive customer information.

EXAMPLE
Example HTML form code that shows the fields that might be submitted for a credit card sale. The merchant can choose which fields they wish to collect themselves and which they want the Paymentsite Hosted Payments page to collect. If the merchant wishes to avoid the hassles associated with PCI standards, they should NOT collect any card or bank account information on their own servers.

HPP In A Frame


    <html>
        <head>
            <title>Merchant Frame Version</title>
        </head>
        <body>
            <h1>Merchant XYZ</h1>
            <p>Customer Checkout</p>
            <form action="https://<Hosted Payments Url>" method="post" target="hp_iframe" name="form_iframe">
                <input type="hidden" name="hp_merchant_id" value="your merchant id"/>
                <input type="hidden" name="hp_amount" value="12.00"/>
                <input type="hidden" name="hp_cmd" value="process"/> <!-- process or savepayment -->
                <input type="hidden" name="hp_method" value="ccard"/> <!-- ccard or echeck -->
                <input type="hidden" name="hp_txntype" value="sale"/> <!-- sale or auth or postauth -->
                <input type="hidden" name="hp_layout" value="frame"/> <!-- frame -->
                <input type="hidden" name="hp_frameborder" value="1"/> <!-- 1 or 0 -->
                <!-- save payment flags when hp_cmd is process -->
                <input type="hidden" name="hp_save_payment" value="0"/> <!-- 1:save or 0:not save, if it is 1 
                                                                             hp_save_customer or hp_customer_token is required-->
                <input type="hidden" name="hp_save_customer" value="0"/> <!-- 1:save or 0:not save -->
                <!-- save payment with existing customer -->
                <input type="hidden" name="hp_customer_token" value=""/>
            </form>
            <iframe name="hp_iframe" id="hp_iframe" width="300px" height="470px" scrolling="auto"
            frameborder="0" allowTransparency="true"></iframe>
            <script type="text/javascript">
            document.form_iframe.submit();
            </script></form>
        </body>
    </html>
                        

/* Intrix Technology HostedPayPage CSS 1 - Grays
black Arial text, default (light red) required fields, white
optional fields, gray disabled fields, gray submit button
----------------------------------------------------------*/

body
{
    font-size: 12px;
    font-family: Arial, Helvetica, Verdana, sans-serif, "Times New Roman", Times;
    margin: 2px;
    padding: 0px;
    color: #000000;
    background: #FFFFFF;
    
}


.bold
{
    font-weight: bold;
}

.submitButton
{
    text-align: center;
    padding-right: 5px;
    font-family: Arial;
    font-size: 12px;
    Border-Radius: 4px;
    width:150px;
    background-color: #cccccc;
    color: #000000;
    font-weight:bold;
}

input.textEntryName
{
    width: 200px;
    border: 1px solid #cccccc;
    font-size: 12px;
    font-family: Arial;
    font-style: normal;
    margin-left: 0px;
    border-radius: 4px;
}

select.textEntryName
{
    width: 200px;
    border: 1px solid #cccccc;
    font-size: 12px;
    font-family: Arial;
    font-style: normal;
    margin-left: 0px;
    border-radius: 4px;
}

select.textEntryCardExp
{
    width: 60px;
    border: 1px solid #cccccc;
    font-size: 12px;
    font-family: Arial;
    font-style: normal;
    margin-left: 0px;
    border-radius: 4px;
}

.label
{
    font-size: 11px;
    font-family: verdana, sans-serif;
    color: #000000;
    font-weight: normal;
    
}
.required_field {
    background-color: #FFE0D1;
}
select.error, textarea.error, input.error {
    border:1px solid red;
    font-family: Verdana;
    font-style: normal;
    font-weight: normal;
}

input.error::-webkit-input-placeholder {
color: red !important;
}
 
input.error:-moz-placeholder { /* Firefox 18- */
color: red !important;  
}
 
input.error::-moz-placeholder {  /* Firefox 19+ */
color: red !important;  
}
 
input.error:-ms-input-placeholder {  
color: red !important;  
}
                        

HPP Redirect

  <html>
        <head> 
            <title>Merchant Weborm</title>
        </head>
        <body> 
            <h1>Merchant XYZ</h1>
            <p>Customer Checkout</p>
            <form method="post" action="https://<Hosted Payments Url>">
                <input name="hp_merchant_id" type="hidden" value="your merchant id" /> 
                <input name="hp_txntype" type="hidden" value="sale" /> 
                <input name="hp_amount" type="hidden" value="100.00" />
                <input name="hp_method" type="hidden" value="ccard" />
                <input name="hp_cardnum" type="hidden" value="4111111111111111" />
                <input name="hp_expmonth" type="hidden" value="12" />
                <input name="hp_expyear" type="hidden" value="2021" />
                <input name="hp_bname" type="hidden" value="Joe Consumer" />
                <input name="hp_baddr" type="hidden" value="123 Main St." />
                <input name="hp_bcity" type="hidden" value="Moorpark" />
                <input name="hp_bstate" type="hidden" value="CA" />
                <input name="hp_bcountry" type="hidden" value="US" />
                <input name="submit" type="submit" />
            </form>
        </body>
    </html>
                        
Scroll to Top