Search
K

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>

PIP-BUTTON Objects

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

receiver

A receiver’s address that is compatible with a selected blockchain network

amount

The amount of dollar (Fiat) that a receiver will receive

chainNetwork

The type of blockchain network that the symbol of the token is included

currency

The symbol of token that will actually be sent to the receiver

label

A label of the button

useLabel

Option to display the label of the button. The default value is ‘TRUE’.

buttonColor

The background color of the button

buttonTextColor

Text color of the button

onPayment

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

onError

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>

onLoad

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>