Pay button
For light backgrounds
/buttons/pay-with-opap.svg
For any website
Add payments to your website. It only takes a link.
Add a payment or donation button to WordPress, a site builder or a custom website. Visitors click it, check the details and choose how to pay. No account or plugin required.
Live button preview
240 × 56 SVG
1 link
starts payment
No plugin
required
Any website
works
01 / Quick start
Copy, paste, and change one link.
Replace the example with your payment address. When someone clicks the button, OPAP checks who they are paying and shows the available ways to pay.
Need a payment address first? Create one.
Using WordPress? Add a Custom HTML block and paste the code into it.
HTML
Copy, then add your payment address
<a href="https://openpaymentaddress.org/pay/?opid=https://merchant.example/donate">
<img
src="https://openpaymentaddress.org/buttons/pay-with-opap.svg"
alt="Pay with OPAP"
width="240"
height="56"
/>
</a>02 / Button kit
Choose a button that fits your page.
Use the teal buttons on a light background and the white buttons on a dark background. Pay and Donate both open the same secure payment page.
Donate button
For light backgrounds
/buttons/donate-with-opap.svg
Pay button
For dark backgrounds
/buttons/pay-with-opap-light.svg
Donate button
For dark backgrounds
/buttons/donate-with-opap-light.svg
03 / Optional settings
Add an amount or order note.
You can include an amount, currency or note in the payment link. The customer still checks everything before paying.
Show optional link settings
| Parameter | Required | What it adds |
|---|---|---|
| opid | Yes | The address that receives the payment. |
| amount | No |
Amount to receive, such as 12.30.
|
| currency | No | Currency, such as EUR. |
| reference | No | A short note, order number or donation purpose. |
| return_url | No | Where to send the visitor when they leave OPAP. |
| state | No | Your reference for matching the visitor to the original request. |
Prefilled example
const url = new URL("https://openpaymentaddress.org/pay/");
url.search = new URLSearchParams({
opid: "https://merchant.example/donate",
amount: "12.30",
currency: "EUR",
reference: "Donation",
return_url: "https://merchant.example/payment/complete",
state: crypto.randomUUID(),
}).toString();04 / Returning visitors
Send people back to your website.
OPAP can return visitors who cancel the presentation flow. It never reports whether a payment app was opened or whether money arrived.
Show return options
cancelled
The visitor went back before opening a payment method.
Before you fulfil an order
The Browser Payer generates only a QR code and URL. Verify payment
independently before fulfilling an order. For safety, the return URL
must use HTTPS and belong to either the payment address or the
website that opened OPAP. Use state to match the
returning visitor to the original request.
Ready to add the button?