If you want to quickly embed Ramp into your app without an overlay, this is the right place to learn how to do that. This method allows you to easily insert the Ramp SDK into the DOM node of your choice.
Getting the SDK
First, you'll need to add our SDK to your project.
If you use npm or yarn, run:
You can also use a CDN and a
script tag. You can learn how to use this method here.
Desktop and mobile variants
There are two variants for the embedded SDK without overlay,
embedded-desktop. These variants let you put the widget (without the overlay and background) into a DOM node that you provide via the
containerNode config value. You must provide a
containerNode while using this variant.
However, the container node must never re-render while the widget is used or the state inside the widget will be lost.
Note: the overlay node in
domNodes field of the SDK will be
The embedded-desktop variant has minimum dimensions of 895 x 590 px.
The embedded-mobile variant has minimum dimensions of 375 x 667 px.
Using the SDK
In order to start the widget, you need to provide some basic configuration to the constructor of our SDK.
A basic example with
embedded-desktop looks like this:
A more detailed list of the available configurations with examples can be found here.
That's it! Create an instance of the SDK with a configuration object and call the
.show() method when you're ready to display Ramp Instant to your user.
It's important to remember that one instance of the SDK corresponds to one instance of the widget - if you want to close Ramp Instant and open it again, you'll need to initialize our SDK again.