Javascript
To use the Javascript of the Pay Button, start by adding this script in your website’s HTML.
<script src="https://{https://button.getpip.com/cdn/pipbutton.js}"></script>
render
<div id='pip-button'></div>
<script>
const div = document.getElementById('pip-button')
pipButton.render(div, {
receiver: "GrWtQjkcEMQWKo4xfj6yfyRw2skNyubuXKU...",
amount: "1",
chainNetwork: "SOLANA",
currency: "SOL",
label: "PAY",
onPayment:function (arg) { console.log('onPayment', arg) },
onError:function (arg) { console.log('onError', arg) },
onLoad:function (arg) { console.log('onLoad', arg) }
})
</script>
Name | Required | Type | Default Value |
|---|---|---|---|
receiver | true | string | null |
amount | true | string | null |
currency | true | string | ‘USDC’ |
chainNetwork | false | string | ‘SOLANA’ |
label | false | string | ‘PAY’ |
useLabel | false | boolean | true |
buttonColor | false | string | ‘#1149FF’ |
buttonTextColor | false | string | ‘#FFFFFF’ |
onLoad | false | function | null |
onPayment | false | function | null |
onError | false | function | null |
A receiver’s address that is compatible with a selected blockchain network
The amount of dollar (Fiat) that a receiver will receive
The type of blockchain network that the symbol of the token is included
The symbol of token that will actually be sent to the receiver
A label of the button
Option to display the label of the button. The default value is ‘TRUE’.
The background color of the button
Text color of the button
Function(s) that will be executed when the payment is successful.
function callback (payment) {
console.log('A payment has occurred!', payment)
}
pipButton.render(div, {
receiver: "receiver address",
amount: "amount",
chainNetwork: "chainNetwork",
currency: "currency",
onPayment: callback
})
When the payment is successful, values listed below are transferred.
Name | Type | Description |
|---|---|---|
sender | string | Sender’s public key |
amount | string | The amount of USD sent |
chainNetwork | string | The type of blockchain network that the symbol of the token is included. (i.e. SOLANA, BSC…) |
currency | string | The ticker of token that is sent. |
txId | string | Transaction id |
Function(s) that will be executed when the payment is NOT successful. It will not be executed when there is a problem with the parameters of the button.
Parameters that the function receives is the explanation of the error.
<div id="pip-button"></div>
<script>
function callback (error) {
console.log(`An error has occurred: ${error}`)
}
pipButton.render(document.getElementById('pip-button'), {
receiver: "receiver address",
amount: "amount",
chainNetwork: "chainNetwork"
currency: "currency",
onError: callback
})
</script>
The function that is executed when the button is loaded.
<div id="pip-button"></div>
<script>
function callback () {
console.log(`The button has loaded.`)
}
pipButton.render(document.getElementById('pip-button'), {
receiver: "receiver address",
amount: "amount",
chainNetwork: "chainNetwork"
currency: "currency",
onLoad: callback
})
</script>
Last modified 6mo ago