Button
This guide provides a detailed reference on how to integrate the Push Cash button into your application.
Button Interface
The Push Cash button enables the integration of a payment entry point into your web application. By using the PushJS package, you can render a customizable button that initiates the Push Cash payment flow.
Loading the PushJS Package
Include the PushJS script in your HTML by adding the following script tag:
Rendering the Button
To render the Push Cash button on your page, use the PushCash.Button
function with the appropriate arguments.
Syntax
- selector (string, required): A CSS selector that identifies the HTML element where the button will be rendered.
- style (object, optional): An object that defines the style of the button.
- color (string): The color theme of the button. Options are
'royal'
(default),'white'
,'navy'
. - shape (string): The shape of the button. Options are
'rect'
(default),'pill'
. - width (number): The width of the button in pixels (between 252 and 800).
- height (number): The height of the button in pixels (between 36 and 80).
- disabled (boolean): Whether the button is disabled - default is
false
.
- color (string): The color theme of the button. Options are
example button initialization
Setting a Callback
Define a callback function that executes when the user clicks the button. This function should return a promise that resolves to a URL string, which the SDK will use to redirect the user.
Disabling the Button
You can dynamically disable or enable the button using the setDisabled
method.
Destroying the Button
If you need to remove the button from the page, call the destroy
method.
Styleguide
Below are examples of the Push Cash button in different configurations.
Example 1: Royal Blue Rectangle (Default)
Example 2: White Pill-Shaped Button
Example 3: Navy Blue Rectangle with Custom Size
This styleguide should help you choose the appropriate button configuration for your application.