Skip to content
Developer

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.