About
Fortumo Hosted DCB: https://fortumo.com/products/dcb/
Developer documentation:
https://merchants.fortumo.com/integration-and-testing/hosted-dcb/
Usage
$ npm install @fortumo/hdcb-lightbox --save
then-in-your.js
const HdcbLightbox = require('@fortumo/hdcb-lightbox');
import HdcbLightbox from '@fortumo/hdcb-lightbox';
...
const config_options = {...};
HdcbLightbox.addPaymentButton('myCustomId', config_options);
OR
include-it-in-your.html
<!doctype html>
<html lang=en>
<head>
<meta charset=utf-8>
<title>My Website</title>
<script src="https://unpkg.com/@fortumo/hdcb-lightbox/dist/HdcbLightbox.min.js"></script>
</head>
<body>
<div id="myCustomId"></div>
...
<script>
var my_config_opts = {
merchant_id: 'your-merchant-id',
token: 'your-jwt-token-as-part-of-the-hdcb-widget-url',
...
}
HdcbLightbox.addPaymentButton('myCustomId', my_config_opts);
</script>
</body>
</html>
Configuration options and default values
Note: All customized values must be set per payment button.
Your merchant ID from Fortumo:
merchant_id: '';
Your integration parameters JWT token:
token: '';
<iframe title="{value here}">
for better accessibility:
iframe_title: 'Fortumo Hosted DCB';
Fortumo HDCB widget's domain. Also can be set to Fortumo test environment's
domain:
domain: 'https://dcb.fortumo.com';
Stylesheet used by this library for payment button and lightbox:
stylesheet_url: 'https://unpkg.com/@fortumo/hdcb-lightbox@{LIBRARY-VERSION}/dist/HdcbLightbox.min.css';
Payment button's alt
parameter value:
button_alt: 'Mobile Payments by Fortumo"';
Payment button's image location:
button_img_src: 'https://assets.fortumo.com/fmp/fortumopay_150x50_red.png';
Element ID of the payment button that is created. Not used for styling. Should
be set for each button if there exists more than one:
button_el_id: 'hdcb-payment-button';