Donation widget
One-time and recurring donations on your website, with donation goals, amounts, SEPA mandate or payment through your payment provider.
The donation widget guides a donor through a donation in three steps: goal and amount, personal details, and review and submit. One-time donations go through your payment provider, recurring donations by SEPA direct debit.
<div data-iw-donation
data-iw-host="club.iw-erp.de"
data-iw-donation-goal-id="7"
data-iw-privacy-url="https://www.our-club.org/datenschutz"></div>
<script src="https://club.iw-erp.de/frontend_assets/backend/iw_erp_web_ui/donation.js" async></script>
Shortcode: [iw-donation host="club.iw-erp.de" goal-id="7"]
Without a goal, visitors choose a donation goal themselves from all available goals.
Options
| Attribute | Default | Meaning |
|---|---|---|
data-iw-donation-goal-id |
empty | set the donation goal by its ID |
data-iw-donation-goal |
empty | set the donation goal by short name, number or name |
data-iw-donation-intervals |
all | allowed rhythms for recurring donations, for example monthly,yearly |
data-iw-donation-popular-amount |
second amount | amount with the note “Popular”; none hides it |
data-iw-donation-preselect-amount |
popular amount | preselected amount; none preselects nothing |
data-iw-privacy-url |
empty | link to your privacy notice |
data-iw-privacy-text |
standard text | text of the privacy checkbox |
data-iw-require-privacy-consent |
on | privacy checkbox is required |
data-iw-redirect-payment |
on | open the payment page automatically |
data-iw-success-redirect-url |
empty | after the donation, go to this page |
data-iw-donation-token |
empty | show the status of a donation. For recurring donations, the donor can cancel it there. |
data-iw-locale |
de |
language for date and rhythm, en for English |
Texts you change often: title, donateNow, successTitle, successMessage, recurringSuccessMessage.
Set up in vynst
- Create donation goals with amounts. The widget loads them from
GET /api/invoice/external/donation/amounts. - For one-time donations, set up a payment provider.
- Enter your website under CORS - Permitted origins.
Events
iw:donation:ready, :validated, :submitted, :payment-opened, :payment-returned, :status, :recurring-canceled and :error.
Good to know
Unfinished input stays saved in the browser. Bank details and consents are not saved.