Embedded / Hosted payment page
Embed our payment page to your own website. Let your customer know their invoice/matter number and then they can pay it via your website.
Public key is your identification as a merchant in Payink. However, you can share it is as the public key can only be used for that purpose.
To get public key:
- 1.Login to Payink
- 2.Click Setting icon on top right corner
- 3.Choose API Credentials on the list
- 4.Copy your public key there
Private and Public key
Use iframe html tag on your site to hold our URL with the public key
<iframe
sandbox="allow-same-origin allow-scripts allow-forms allow-popups"
allow="payment"
src="https://client.payink.com/pay/{public_key}">
</iframe>
Make a "Make Payment/ Pay Now" button on your website as a trigger to open the popup.
Use this method if supported by the payment partner.
<a
href="javascript:void(0)"
id="payink-embedded-payment"
data-public-key="{public_key}"
>
Make a payment
</a>
Make sure attribute id (payink-embedded-payment) and data-public-key exists.
Then load our CSS and JS.
<link rel="stylesheet" href="https://client.payink.com/css/hosted.min.css" >
<script src="https://client.payink.com/js/embedded.min.js"type="text/javascript"></script>
Then refresh your site and Payink will handle the payment event.
How it will look like
Make any button on your site as a trigger to open the popup.
This method is more flexible than the embedded/iframe because it works for all payment providers we support.
<a
href="javascript:void(0)"
id="payink-popup-payment"
data-public-key="{public_key}"
>
Make a payment
</a>
Make sure attribute id (payink-popup-payment) and data-public-key exists.
Then load our JS.
<link rel="stylesheet" href="https://client.payink.com/css/hosted.min.css" >
<script src="https://client.payink.com/js/popup.min.js"type="text/javascript"></script>
Then refresh your site and Payink will handle the payment event.
How it will look like
Last modified 1yr ago