Inline Checkout
Inline Checkout is our
iframe checkout option which displays a secure payment form as an overlay on
your checkout page. It is designed to function when the buyer’s
billing/shipping address has been collected and the cart total has been finalized.
This makes it ideal for use with shopping cart applications or your own custom
checkout process.
Checkout URL
Live URL : https://checkout.flospay.com/checkout/purchase
When testing in our
sandbox, you will need to use our sandbox checkout
Sandbox URL : https://sandbox.flospay.com/checkout/purchase
The Inline Checkout
JavaScript library
Integrating with Inline
Checkout is as easy as including our small JavaScript library at the bottom of
the page where your checkout form is located:
<script src="https://www.flospay.com/static/checkout/javascript/direct.min.js"></script>
The Inline Checkout
JavaScript library will add an iframe to the DOM and hook into any existing
form that uses our checkout routine. When the buyer submits the form, our
Inline Checkout page will overlay your current checkout page.
The buyer can easily
complete the checkout process or if they need to return to the cart, they can
simply click the close button (X) to dismiss the overlay and complete the
checkout when they are ready.
Hosted Checkout Parameters
These parameters can be
used to dynamically pass in tangible/intangible products and recurring/non-recurring
services.
Required Parameters
Parameter |
|
Required |
Description |
format |
sid |
|
Required |
Your
Flospay account number. |
12
number |
mode |
|
Required |
Defines
the parameter set. Values are “standard”, “inline”. |
|
li_#_type |
|
Required |
The
type of line item that is being passed in. (Always Lower Case, ‘product’,
‘shipping’, ‘tax’ or ‘coupon’, defaults to ‘product’) |
|
li_#_name |
|
Required |
Name of
the item passed in with the corresponding li_#_type. (,cannot use ‘<' or
'>’, defaults to capitalized version of ‘type’.) |
128
characters max |
li_#_quantity |
|
Required |
Quantity
of the item passed in with the corresponding li_#_type. ( defaults to 1 if
not passed in.) |
0-999 |
li_#_price |
|
Required |
Price
of the line item., defaults to 0 if a value isn’t passed in, no negatives
(use positive values for coupons), leading 0 & decimal are optional.
Important note: If the li_#_price parameter isn’t used to pass in line item
pricing, the pricing for the corresponding item will default to 0.00. |
Format:
0.00-99999999.99 |
li_#_tangible |
|
Required |
Specifies
if the corresponding li_#_type is a tangible or intangible. ( Must be Upper
Case, ‘Y’ or ‘N’, if li_#_type is ‘shipping’ forced to ‘Y’.) |
|
You can use these parameters to pass in multiple products as well. To do so you
will need to append a digit to each parameter. For example, li_0_type,
li_0_quantity, li_0_name, li_0_price, li_0_product_id, li_0_description,
li_0_tangible will describe the first product, then to describe the second
product you would increment so the parameters will read li_1_type,
li_1_quantity, and so on. Please Note: With this parameter set # may be
represented by 0-999 and aren’t required to be consecutive.
Additional Parameters
Lineitem
Product Parameters: li_# is number of product item
Parameter |
Description |
li_#_product_id |
Id that
you use to identify the product. 64 characters max, cannot use ‘<' or
'>’. |
li_#_description |
Description
you use for the product. 255 characters max, cannot use ‘<' or '>’. |
li_#_recurrence |
Sets
billing frequency. Ex. ‘1 Week’ to bill order once a week. (Can use # Week, #
Month, or # Year) |
li_#_duration |
Sets
how long to continue billing. Ex. ‘1 Year’, to continue billing based on
li_#_recurrence for 1 year. (Forever or # Week, # Month, # Year) |
li_#_startup_fee |
Any
start up fees for the product or service. Can be negative to provide
discounted first installment pricing, but cannot equal or surpass the product
price. |
li_#_option_#_name |
Name of
product option. Ex. Size (64 characters max – cannot include ‘<' or
'>’) |
li_#_option_#_value |
Option
selected. Ex. Small (64 characters max, cannot include ‘<' or '>’) |
li_#_option_#_surcharge |
Option
price in seller currency. (0.00 for no cost options) |
demo |
Y to
enable demo mode. Do not pass for live sales. Can also be controlled within
the account. |
currency_code |
AFN,
ALL, DZD, ARS, AUD, AZN, BSD, BDT, BBD, BZD, BMD, BOB, BWP, BRL, GBP, BND,
BGN, CAD, CLP, CNY, COP, CRC, HRK, CZK, DKK, DOP, XCD, EGP, EUR, FJD, GTQ,
HKD, HNL, HUF, INR, IDR, ILS, JMD, JPY, KZT, KES, LAK, MMK, LBP, LRD, MOP,
MYR, MVR, MRO, MUR, MXN, MAD, NPR, TWD, NZD, NIO, NOK, PKR, PGK, PEN, PHP,
PLN, QAR, RON, RUB, WST, SAR, SCR, SGD, SBD, ZAR, KRW, LKR, SEK, CHF, SYP,
THB, TOP, TTD, TRY, UAH, AED, USD, VUV, VND, XOF, YER. Use to specify the
currency for the sale. |
lang |
Chinese
– zh, Danish – da, Dutch – nl, French – fr, German – gr, Greek – el, Italian
– it, Japanese – jp, Norwegian – no, Portuguese – pt, Slovenian – sl, Spanish |
merchant_order_id |
Specify
your order number with this parameter. It will also be included in the
confirmation emails to yourself and the customer. (50 characters max) |
purchase_step |
Sets
the purchase step that the buyer will land on when being directed to the
checkout page. Possible values are ‘review-cart’, ‘shipping-information’,
‘shipping-method’, ‘billing-information’ and ‘payment-method’. Please Note:
To skip a purchase step, all required fields must be pre-populated with the
parameters that are passed in with the sale. If a required field is not
pre-populated, the buyer will revert back to the step that needs to be
completed. |
x_receipt_link_url |
Used to
specify an approved URL on-the-fly, but is limited to the same domain that is
used for your Floospay account,
otherwise it will fail. This parameter will over-ride any URL set on the Site
Management page. (no limit) |
coupon |
Specify
a Floospay created coupon code. If applicable, the coupon will be
automatically applied to the sale. |
Billing Address Parameters: To pre
populate the billing information page you may pass in:
Parameter |
Description |
card_holder_name |
Card
holder’s name (128 characters max). The card holder’s name can also be
populated using the first_name, middle_initial, and last_name parameters. IMPORTANT: If you use these
three parameters, the data will be combined into and returned as
card_holder_name to your Approved URL script. |
street_address |
Card
holder’s street address(64 characters max) |
street_address2 |
The
second line for the street address, typically suburb or apartment number
information (64 characters max). Required if “country” value is: CHN, JPN,
RUS - Optional for all other “country” values. |
city |
Card
holder’s city (64 characters max) |
state |
Card holder’s
state (64 characters max). Required if “country” value is ARG, AUS, BGR, CAN,
CHN, CYP, EGY, FRA, IND, IDN, ITA, JPN, MYS, MEX, NLD, PAN, PHL, POL, ROU,
RUS, SRB, SGP, ZAF, ESP, SWE, THA, TUR, GBR, USA - Optional for all other
“country” values. |
zip |
Card
holder’s zip code/post code. Required if “country” value is ARG, AUS, BGR,
CAN, CHN, CYP, EGY, FRA, IND, IDN, ITA, JPN, MYS, MEX, NLD, PAN, PHL, POL,
ROU, RUS, SRB, SGP, ZAF, ESP, SWE, THA, TUR, GBR, USA - Optional for all
other “country” values. (16 characters max) |
country |
Card
holder’s country (64 characters max) |
email |
Card
holder’s email (64 characters max) |
phone |
Card
holder’s phone (16 characters max) |
phone_extension |
Card
holder’s phone extension (9 characters max) |
Shipping Address Parameters: To pre populate the
shipping information page you may pass in:
Parameter |
Description |
ship_name |
Recipient
Name |
ship_street_address |
Recipient
Address 1 |
ship_street_address2 |
Recipient
Address 2. Required if “ship_country” value is: CHN, JPN, RUS - Optional for
all other “ship_country” values. |
ship_city |
Recipient
City |
ship_state |
Recipient
State. Required if “ship_country” value is ARG, AUS, BGR, CAN, CHN, CYP, EGY,
FRA, IND, IDN, ITA, JPN, MYS, MEX, NLD, PAN, PHL, POL, ROU, RUS, SRB, SGP,
ZAF, ESP, SWE, THA, TUR, GBR, USA - Optional for all other “ship_country”
values. |
ship_zip |
Recipient
Zip Code/Post Code. Required if “ship_country” value is ARG, AUS, BGR, CAN,
CHN, CYP, EGY, FRA, IND, IDN, ITA, JPN, MYS, MEX, NLD, PAN, PHL, POL, ROU,
RUS, SRB, SGP, ZAF, ESP, SWE, THA, TUR, GBR, USA - Optional for all other
“ship_country” values. |
ship_country |
Recipient
Country |
The billing information page will also be populated with the information from
the shipping page if the shipping information is collected on that sale and the
billing information is not passed in.
Custom Parameters
You may pass in any
additional parameters that you may need and they will be returned to you at the
end of the sale. The only restrictions on custom parameters are that they can
not share the name of ANY parameter that our system uses, even from the other
sets. Please note that you WILL need a return script set up on the Site
Management page to receive any of these parameters back as they are not included
in the confirmation emails.
Integration
To place a sale using
Inline Checkout, your checkout form must utilize our Hosted Checkout parameter set. This parameter set allows you to dynamically
pass in recurring, non-recurring, shipping, tax, and coupon line items.
Your form must also pass
in the buyer’s name, email, and full billing address.The buyer’s shipping address is also required if
the sale is tangible, or if a shipping lineitem is passed in.
Example Checkout Form
- Intangible Product
<input type="hidden" name="sid" value="1303908">
<input type="hidden" name="mode" value="inline">
<input type="hidden" name="li_0_type" value="product">
<input type="hidden" name="li_0_name" value="invoice123">
<input type="hidden" name="li_0_price" value="25.99">
<input type="hidden" name="card_holder_name" value="Checkout Shopper">
<input type="hidden" name="street_address" value="123 Test Address">
<input type="hidden" name="street_address2" value="Suite 200">
<input type="hidden" name="city" value="Columbus">
<input type="hidden" name="state" value="OH">
<input type="hidden" name="zip" value="43228">
<input type="hidden" name="country" value="USA">
<input type="hidden" name="email" value="example@2co.com">
<input type="hidden" name="phone" value="614-921-2450">
<input name="submit" type="submit" value="Checkout">
Since our example form
above is passing all of the required information for an intangible sale,
integrating with Inline Checkout is as easy as including our small JavaScript
library at the bottom of the page where your checkout form is located:
<script src="https://js.flospay.net/v1/checkout/flospay.js"></script>
The Inline Checkout
JavaScript library will add an iframe to the DOM and hook into any existing
form that uses our checkout routine. When the buyer submits the form, our
Inline Checkout page will overlay your current checkout page.
Example Checkout Form
- Tangible Product
<input type="hidden" name="sid" value="1303908">
<input type="hidden" name="mode" value="inline">
<input type="hidden" name="li_0_type" value="product">
<input type="hidden" name="li_0_name" value="invoice123">
<input type="hidden" name="li_0_price" value="25.99">
<input type="hidden" name="li_0_tangible" value="Y">
<input type="hidden" name="li_1_type" value="shipping">
<input type="hidden" name="li_1_name" value="Express Shipping">
<input type="hidden" name="li_1_price" value="13.99">
<input type="hidden" name="card_holder_name" value="Checkout Shopper">
<input type="hidden" name="street_address" value="123 Test Address">
<input type="hidden" name="street_address2" value="Suite 200">
<input type="hidden" name="city" value="Columbus">
<input type="hidden" name="state" value="OH">
<input type="hidden" name="zip" value="43228">
<input type="hidden" name="country" value="USA">
<input type="hidden" name="ship_name" value="Checkout Shopper">
<input type="hidden" name="ship_street_address" value="123 Test Address">
<input type="hidden" name="ship_street_address2" value="Suite 200">
<input type="hidden" name="ship_city" value="Columbus">
<input type="hidden" name="ship_state" value="OH">
<input type="hidden" name="ship_zip" value="43228">
<input type="hidden" name="ship_country" value="USA">
<input type="hidden" name="email" value="example@2co.com">
<input type="hidden" name="phone" value="614-921-2450">
<input name="submit" type="submit" value="Checkout">
Since our example form
above is passing all of the required information for a tangible sale,
integrating with Inline Checkout is as easy as including our small JavaScript
library at the bottom of the page where your checkout form is located:
The buyer can easily
complete the checkout process or if they need to return to the cart, they can
simply click the close button (X) to dismiss the overlay and complete the
checkout when they are ready.
Event Callbacks
You may specify a callback to be invoked on certain events that happen in the checkout process:
Events:
- checkout_loaded - Invoked when the inline form is visible to the buyer.
- checkout_closed - Invoked when the inline form is closed by the buyer.
The event_type will be passed to the callback that is subscribed.
Example:
var myCallback = function(data) {
console.log(JSON.stringify(data));
// Example
callback data
//
{"event_type":"checkout_loaded"}
//
{"event_type":"checkout_closed"}
};
(function() {
inline_Floospay.subscribe('checkout_loaded', myCallback);
inline_Floospay.subscribe('checkout_closed', myCallback);
}());
Errors And Debugging
Please Note: Inline Checkout focuses solely on securely and efficiently collecting the buyer’s payment information. The buyer’s name, email and billing address must be passed in from your payment form. If a required parameter is missing, we will break out of the iframe and redirect the buyer to standard checkout to fill in the missing data.
Are you being directed to the standard checkout routine while implementing the Inline Checkout feature? Please refer to the following suggestions that may resolve the issue:
- Clear your browser’s cache and cookies, close all open instances of your browser, then recommence testing.
- Review your page to ensure that the mandatory JavaScript code has been properly implemented.
- Ensure that you are using the Hosted Checkout parameter set to pass in sale details.
Check to make sure all required billing information is being passed in for intangible sales.
Parameter | Description |
---|---|
sid | Your Floospay account number. |
mode | Defines the parameter set. Should always be passed as ‘inline’. |
li_#_type | The type of line item that is being passed in. (Always Lower Case, ‘product’, ‘shipping’, ‘tax’ or ‘coupon’, defaults to ‘product’) |
li_#_name | Name of the item passed in with the corresponding li_#_type. (128 characters max, cannot use ‘<' or '>’, defaults to capitalized version of ‘type’.) |
li_#_quantity | Quantity of the item passed in with the corresponding li_#_type. (0-999, defaults to 1 if not passed in.) |
li_#_price | Price of the line item. Format: 0.00-99999999.99, defaults to 0 if a value isn’t passed in, no negatives (use positive values for coupons), leading 0 & decimal are optional. Important note: If the li_#_price parameter isn’t used to pass in line item pricing, the pricing for the corresponding item will default to 0.00. |
card_holder_name | Card holder’s name (128 characters max). The card holder’s name can also be populated using the first_name, middle_initial, and last_name parameters. IMPORTANT: If you use these three parameters, the data will be combined into and returned as card_holder_name to your Approved URL script. |
street_address | Card holder’s street address(64 characters max) |
street_address2 | The second line for the street address, typically suburb or apartment number information (64 characters max) |
city | Card holder’s city (64 characters max) |
state | Card holder’s state (64 characters max) |
zip | Card holder’s zip (16 characters max) |
country | Card holder’s country (64 characters max) |
Card holder’s email (64 characters max) | |
phone | Card holder’s phone (16 characters max) |
Check to make sure all required billing and shipping information is being passed in for tangible sales:
Parameter | Description |
---|---|
sid | Your Floospay account number. |
mode | Defines the parameter set. Should always be passed as ‘inline’. |
li_#_type | The type of line item that is being passed in. (Always Lower Case, ‘product’, ‘shipping’, ‘tax’ or ‘coupon’, defaults to ‘product’) |
li_#_name | Name of the item passed in with the corresponding li_#_type. (128 characters max, cannot use ‘<' or '>’, defaults to capitalized version of ‘type’.) |
li_#_quantity | Quantity of the item passed in with the corresponding li_#_type. (0-999, defaults to 1 if not passed in.) |
li_#_price | Price of the line item. Format: 0.00-99999999.99, defaults to 0 if a value isn’t passed in, no negatives (use positive values for coupons), leading 0 & decimal are optional. Important note: If the li_#_price parameter isn’t used to pass in line item pricing, the pricing for the corresponding item will default to 0.00. |
li_#_tangible | Specifies if the corresponding li_#_type is a tangible or intangible. ( Must be Upper Case, ‘Y’ or ‘N’, if li_#_type is ‘shipping’ forced to ‘Y’.) |
card_holder_name | Card holder’s name (128 characters max). The card holder’s name can also be populated using the first_name, middle_initial, and last_name parameters. IMPORTANT: If you use these three parameters, the data will be combined into and returned as card_holder_name to your Approved URL script. |
street_address | Card holder’s street address(64 characters max) |
street_address2 | The second line for the street address, typically suburb or apartment number information (64 characters max) |
city | Card holder’s city (64 characters max) |
state | Card holder’s state (64 characters max) |
zip | Card holder’s zip (16 characters max) |
country | Card holder’s country (64 characters max) |
Card holder’s email (64 characters max) | |
phone | Card holder’s phone (16 characters max) |
ship_name | Recipient Name |
ship_street_address | Recipient Address 1 |
ship_street_address2 | Recipient Address 2 |
ship_city | Recipient City |
ship_state | Recipient State |
ship_zip | Recipient Zip |
ship_country | Recipient Country |
Return Process
Inline Checkout uses the same return processes as standard checkout. If you have an existing integration with standard checkout, you do not need to modify your return setting.
Parameters Returned
You will receive back
all of the parameters that were passed in as well as the following parameters:
Parameter |
Description |
order_number |
flospay
order number |
invoice_id |
flospay
invoice id |
credit_card_processed |
Y if
successful (Approved). |
total |
the
total amount of the purchase |
key |
the MD5
hash used to verify that the sale came from one of our servers |
Validation
The MD5 hash is provided
to help you verify the authenticity of the passback to your approved URL. The
hash is computed using the secret word on the Site Management page and is
returned using the key parameter. To validate against the
hash, you need to make a string that contains the information described below
and pass it in as the value to your scripting languages MD5 function. The MD5
hash is created the same way for a production Flospay account and a Sandbox Flospay
account.
UPPERCASE(MD5_ENCRYPTED(Secret Word + Seller ID + order_number + Sale Total))
The secret word is set by yourself on the Site Managment page.
The vendor number is your numerical vendor/seller ID number. The order number
is the order number for the sale. The total is the numerical value for the
total amount of the sale.Each of our community supported libraries provides a binding
to validate the hash on a notification message.
Example
Below is an example PHP
script that validates the hash.
$hashSecretWord = 'tango'; // Floospay Secret Word
$hashSid = 1303908; // Floospay account number
$hashTotal = '1.00'; //Sale total to validate against
$hashOrder = $_REQUEST['order _number']; // Floospay Order Number
$StringToHash = strtoupper(md5($hashSecretWord . $hashSid . $hashOrder . $hashTotal));
if ($StringToHash != $_REQUEST['key']) {
$result = 'Fail - Hash Mismatch';
} else {
$result = 'Success - Hash Matched';
}
echo $result;