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>