BankingBridge Embed

Create an intuitive and engaging UI in seconds using our Embed code.

A BankingBridge Embed can be imported into your existing project in just a few lines of code. Let's look at the following snippet of code.

HTML

<div id='bb-f4f6d'>
    <script>
        window.BB || document.write("<script src='https://cdn.bankingbridge.com/assets/external/index.js' type='text/javascript' charset='utf-8' defer=''><\/script>")
    </script>
    <script>
        window.addEventListener('DOMContentLoaded', function() {BB.init('2268587214', document.getElementById('bb-f4f6d'),{type:'api'});})
    </script>
</div>

First, we create our div that will contain our Embed:

<div id='bb-f4f6d'>
</div>

Next, we initialize BankingBridge for this particular page:

    <script>
        window.BB || document.write("<script src='https://cdn.bankingbridge.com/assets/external/index.js' type='text/javascript' charset='utf-8' defer=''><\/script>")
    </script>

Finally, we add the Banking Bridge Embed.

<script>
        window.addEventListener('DOMContentLoaded', function() {BB.init('2268587214', document.getElementById('bb-f4f6d'),{type:'api'});})
</script>

There are 3 required arguments for BB.init(). To create the Embed we provide the following arguments to the function BB.init():

• App Key: we provided the App Key - 2268587214. Your value will be different. See Authentication if you require a valid App Key.
• Reference to the container div: document.getElementById('bb-f4f6d'). Note how the id of the div matches our div container: <div id='bb-f4f6d'>.
• The config: provide the configuration for the BankingBridge global variable, BB. In this case, it's {type:'api'}.

Congratulations, you have added the BankingBridge Embed to your page!

This was only a basic example, for more information on the options available to you using the BB global variable, see the BankingBridge SDK documentation.