Skip to content

Donation Form

File: snippets/donation-form.liquid

Used in sections: tmi-donation-hero

Screenshot not yet added.
Save as docs/src/assets/screenshots/snippet-donation-form.png

Description

Donation Form

Renders a multi-step Bloomerang donation form with Stripe payment processing. Supports one-time and recurring donations with configurable amounts, fund designation, and contact/billing information collection.

Features:

  • Three-step form flow: gift selection, contact info, payment
  • One-time and recurring donation options with different preset amounts
  • Credit card (Stripe), checking, and savings payment methods
  • “True Impact” fee offset option
  • CAPTCHA validation (v2 and v3)
  • Custom tribute fields (In Honor Of / In Memory Of)
  • International address support with country/state/province switching
  • Client-side form validation with jQuery Validate

Dependencies:

  • Bloomerang API (bloomerang-v2.js)
  • Stripe (via Bloomerang.Util.requireStripe)
  • jQuery and jQuery Validate
  • accounting.js (money formatting)
  • Google reCAPTCHA v2/v3

Tailwind Status: Partial (mix of Tailwind and custom CSS)

Usage

{% render 'donation-form' %}