Donation Tiers Card Widget

Turn a support page into a clear ask: your cause, a short story, an optional raised-of-goal meter, up to six giving tiers that say what each amount pays for, an Other amount box and a One-off / Monthly switch. The Donate button sends supporters to your existing donation page, with the chosen amount filled in if your page accepts it.

Business & Contact Tool Runs in your browser Free · no ads

Customize your widget

Theme
Auto follows the visitor's light/dark setting.
Style
Attribution on your page
Optional and entirely your choice. The exact line is shown in the code below; it links to the tool with rel="nofollow".
More options
Starting values
One item per line. Long content is carried after the # in the embed code, so it never reaches a server.
One item per line. Long content is carried after the # in the embed code, so it never reaches a server.
Leave blank to use the widget's defaults. Visitors can still change every value.

Live preview

Exactly what your visitors will see

Embed code

<iframe src="https://a2z.tools/embed/w/donation-tiers-card" title="Donation Tiers Card by A2Z Tools" width="100%" height="780" style="border:0;width:100%" loading="lazy" allow="clipboard-write"></iframe>

A plain iframe. Works everywhere, including site builders that strip scripts. Adjust height if your content needs more room.

Works with

How it works

Each tier is one line - amount | label | what it pays for - so 25 | Friend | A full food parcel becomes a selectable card. Amounts may carry a symbol or code (£25, 25.00 USD); grouping commas are accepted, negatives, zero, values above 10 million and the ambiguous 1,5 are refused, and duplicates are dropped. Selecting a tier, or typing an Other amount, rewrites the Donate link. If you name your page's amount parameter, for example amount, the link becomes https://your-site/donate?amount=25; 12.5 is written 12.50 and never grouped, an existing query string is kept, and a parameter of the same name is replaced rather than repeated. The name itself must be a plain token - letters, digits, _ . - and brackets - so amount&admin=1 is ignored. A Monthly switch appears only when you give a second page for recurring gifts. Raised and goal figures are drawn as a meter whose fill stops at 100 percent while the text keeps the real share, and are labelled as reported by the organiser.

Method

  • Tier line: amount | label | description; amount = number after stripping a leading or trailing currency symbol or code; 0 < amount <= 10,000,000; at most 6 tiers
  • Donate link = your https page + ?<parameter>=<amount> (WHATWG URLSearchParams); amount written as an integer or with exactly 2 decimals
  • Parameter name must match ^[A-Za-z][A-Za-z0-9_.\-\[\]]{0,39}$ or no amount is appended
  • Progress = raised / goal x 100; bar fill = min(100, progress)

Worked examples

Default sample, Friend tier

Inputs: No settings; supporter picks $25

Result: Donate $25 -> https://riverside-foodbank.example/donate?amount=25; meter $6,420 raised of $10,000 (64%)

6420 / 10000 = 64.2%, shown rounded; the generic food-bank sample appears until you set a title, tiers or page.

Other amount, monthly

Inputs: Monthly switch on; Other amount 12.5

Result: https://riverside-foodbank.example/donate/monthly?amount=12.50

The recurring page is used and a fractional amount always carries two decimals.

Unsafe parameter name

Inputs: url=https://give.example/roof; amountParam=amount&admin=1

Result: Donate -> https://give.example/roof (no amount appended)

The name is not a plain token, so nothing is added and the preview explains why.

Gift Aid, tax-deductibility and charity-status statements are the publisher's responsibility; the card shows only the wording you enter.

Limitations

  • The card cannot confirm a payment, show a live total or thank a donor by name - those happen on your provider's page.
  • Amount pre-filling works only if your donation provider reads an amount from the address; many do not.
  • One currency per card, set in the builder; a donor paying in another currency sees your amounts converted only on your provider's checkout, if at all.

Where publishers use it

  • A food bank or animal shelter appeal page that wants 10 / 25 / 50 tiers explained in plain words
  • A podcaster or open-source maintainer asking for monthly support through Ko-fi, Patreon-style or Stripe Payment Links
  • A school PTA or sports club raising money for one project with a visible goal
  • A church or mosque giving page that links to an existing online giving provider
  • An emergency appeal banner on a news or community site that sends readers to the charity's own checkout

Questions

Does this card take payments?

No. It is a link builder: the Donate button opens your own donation page in a new tab, and that provider (Stripe, PayPal, JustGiving, Donorbox, your CRM) takes the payment. The frame's security policy has form-action 'none' and allows network requests only to A2Z itself, so the card could not post card details anywhere even by mistake.

How do I make the chosen amount appear on my donation page?

Find the query parameter your page reads - many hosted forms accept something like ?amount=25 - and enter that name in Amount parameter. Test it once: open your page with ?amount=25 added by hand. If the box is not pre-filled, your provider does not support it; leave the field empty and the button will simply open the page.

Can I mention Gift Aid or say donations are tax-deductible?

Only you can, because only you know your status. Put your own wording in Tax note, for example your registered charity number and how donors add Gift Aid on your page. HMRC lets a UK charity claim 25p for every £1 only when the donor has made a Gift Aid declaration and paid enough tax; in the US, a single gift of $250 or more needs a written acknowledgment from the charity. The card adds no tax claim of its own.

Are the raised and goal figures live?

No. They are numbers you type in the builder, shown with the note Figures reported by the organiser. Update the embed code when your total changes, or leave both blank to hide the meter. For a stand-alone thermometer with a deadline, use the Goal Thermometer widget.

When does the Monthly switch appear?

Only when you give a second https page for recurring gifts. One-off uses your main page and Monthly uses the recurring page, each with the same amount parameter. Without a monthly page there is no switch, so supporters are never shown an option your provider cannot honour.

Why was my donation page address rejected?

The button accepts full https:// addresses only. A donation page that asks for payment details should never be served over plain http, and javascript:, data: or protocol-relative addresses are refused outright. The builder preview lists the reason under the card.

Sources

  1. Claiming Gift Aid as a charity or CASC - HMRC / GOV.UK . 25p per £1 donated, only with a Gift Aid declaration and when the donor has paid at least as much Income Tax or Capital Gains Tax. Checked 2026-10-01.
  2. Gift Aid: donating to charity - GOV.UK . Donors should sign a declaration only if they have paid enough tax to cover the reclaim. Checked 2026-10-01.
  3. Charitable contributions: written acknowledgments - IRS . A contribution of $250 or more must be substantiated by a written acknowledgment with the stated contents. Checked 2026-10-01.

Cite or recommend this tool

If you reference this tool in an article, course or documentation, these formats are ready to copy. They are optional - nothing is added to your site unless you paste it.

A2Z Tools Donation Tiers Card
https://a2z.tools/embed/donation-tiers-card
  • Goal Thermometer

    Marketing Tool New

    Fundraising goal thermometer: amount raised, goal, percentage and days left, set in the builder.

    Get code
  • Pricing Table

    Page Components Tool New

    Two to five plan cards with a monthly/yearly switch, saving %, highlighted plan and comparison mode.

    Get code
  • Contact Buttons

    Business & Contact Tool New

    Large Call, Text, Email, WhatsApp and custom-link tap targets in a stack, row or pill bar.

    Get code
  • Social Links Widget

    Business & Contact Tool New

    Up to 12 social profile links recognised by host name, as icons, labels or buttons.

    Get code
  • Business Card Widget

    Business & Contact Tool New

    A digital business card with call, email, website and directions buttons plus a .vcf contact download.

    Get code
  • Team Cards

    Business & Contact Tool New

    Staff profiles with photo or initials, role, short bio and an email or LinkedIn button, grouped by department.

    Get code

Preview