How to Create a Donation Form That Maximizes Giving

A donation form isn't just data collection. It's the final step in convincing someone to give. Every friction point costs you donations. Every moment of doubt causes abandonment. The right form design can increase giving by 20-50%.

This guide covers the psychology and implementation of high-converting donation forms. Suggested amounts that anchor giving higher. Recurring options that increase lifetime value. Impact messaging that motivates. And technical features like fee coverage and dedication gifts.

Suggested Amounts

Never make donors think about how much to give. Present clear options. The amounts you suggest anchor expectations and guide decisions.

// Suggested amounts with custom option
form.addRow(row => {
    row.addSuggestionChips('amount', {
        label: 'Select Amount',
        suggestions: [
            { id: '25', name: '$25' },
            { id: '50', name: '$50' },
            { id: '100', name: '$100' },
            { id: '250', name: '$250' },
            { id: 'custom', name: 'Other' }
        ],
        max: 1
    });
});

// Custom amount field (shows when "Other" selected)
form.addRow(row => {
    row.addMoney('customAmount', {
        label: 'Enter Amount',
        currency: '$',
        min: 1,
        placeholder: 'Enter your amount',
        isVisible: () => form.suggestionChips('amount')?.value()?.includes('custom'),
        isRequired: () => form.suggestionChips('amount')?.value()?.includes('custom')
    });
});

Key principles for amount selection:

• 4-5 options: Too few limits choice, too many creates paralysis
• Strategic ordering: Put your target amount second or third
• Round numbers: $25, $50, $100 - not $27 or $53
• Always include "Other": Don't cap generous donors

The custom amount field only appears when "Other" is selected. This keeps the initial view clean while allowing flexibility.

Show Impact

Donors give to make a difference. Show them exactly what their gift accomplishes.

// Show what the donation provides
const impactMessages: Record<string, string> = {
    '25': 'Provides school supplies for 2 students',
    '50': 'Feeds a family for one week',
    '100': 'Supplies clean water for a village for a month',
    '250': 'Funds a scholarship for one semester'
};

form.addRow(row => {
    row.addTextPanel('impact', {
        label: () => {
            const selected = form.suggestionChips('amount')?.value()?.[0];
            if (selected && selected !== 'custom') {
                return impactMessages[selected] ?? '';
            }
            return '';
        },
        isVisible: () => {
            const selected = form.suggestionChips('amount')?.value()?.[0];
            return !!selected && selected !== 'custom';
        }
    });
});

Impact statements should be:

• Specific: "Feeds a family for one week" not "Helps fight hunger"
• Tangible: Concrete outcomes people can visualize
• Proportional: Match the impact to the amount
• Honest: Don't exaggerate or mislead

The impact message updates instantly when users select different amounts. This reactive feedback reinforces the connection between giving and outcomes.

Recurring Donations

Monthly donors have higher lifetime value than one-time donors. A $25/month donor gives $300/year - more than most single gifts. Make recurring easy but not pushy.

// One-time vs recurring donation
form.addRow(row => {
    row.addRadioButton('frequency', {
        label: 'Donation Frequency',
        options: [
            { id: 'once', name: 'One-Time Gift' },
            { id: 'monthly', name: 'Monthly' },
            { id: 'quarterly', name: 'Quarterly' },
            { id: 'annually', name: 'Annually' }
        ],
        defaultValue: 'once'
    });
});

// Show impact message for recurring
form.addRow(row => {
    row.addTextPanel('recurringImpact', {
        label: () => {
            const amount = getSelectedAmount();
            const freq = form.radioButton('frequency')?.value();
            if (freq === 'monthly' && amount) {
                return `Your $${amount}/month provides $${amount * 12} of impact annually`;
            }
            return '';
        },
        isVisible: () => form.radioButton('frequency')?.value() !== 'once'
    });
});

The impact message for recurring gifts emphasizes annual totals. "$50/month provides $600 of impact annually" reframes the commitment in terms of total good, not ongoing expense.

Frequency Options

Monthly is the standard, but some donors prefer quarterly or annual. Offering options accommodates different preferences without complicating the default path.

Dedication Gifts

Memorial and honor gifts are deeply meaningful to donors. They often result in larger gifts and create emotional connections to your cause.

// Memorial or honor dedication
form.addRow(row => {
    row.addCheckbox('isDedicated', {
        label: 'Make this gift in honor or memory of someone',
        defaultValue: false
    });
});

const dedicationSection = form.addSubform('dedication', {
    title: 'Dedication Details',
    isVisible: () => form.checkbox('isDedicated')?.value() === true
});

dedicationSection.addRow(row => {
    row.addRadioButton('dedicationType', {
        label: 'This gift is',
        options: [
            { id: 'honor', name: 'In Honor Of' },
            { id: 'memory', name: 'In Memory Of' }
        ],
        defaultValue: 'honor'
    });
});

dedicationSection.addRow(row => {
    row.addTextbox('honoreeName', {
        label: 'Name of Person Being Honored',
        isRequired: true
    });
});

dedicationSection.addRow(row => {
    row.addCheckbox('sendCard', {
        label: 'Send a notification card',
        defaultValue: false
    });
});

// Card recipient details (if sending card)
dedicationSection.addRow(row => {
    row.addTextbox('recipientName', {
        label: 'Recipient Name',
        isRequired: () => dedicationSection.checkbox('sendCard')?.value() === true,
        isVisible: () => dedicationSection.checkbox('sendCard')?.value() === true
    });
    row.addEmail('recipientEmail', {
        label: 'Recipient Email',
        isRequired: () => dedicationSection.checkbox('sendCard')?.value() === true,
        isVisible: () => dedicationSection.checkbox('sendCard')?.value() === true
    });
});

The dedication section only appears when requested. Within it, the notification card fields only appear when that option is checked. Progressive disclosure keeps the form simple for standard donations while fully supporting special gifts.

Cover Processing Fees

Credit card processing costs 2-3% of every donation. Many donors are happy to cover this so 100% goes to the mission.

// Option to cover processing fees
const donationAmount = form.computedValue(() => {
    const selected = form.suggestionChips('amount')?.value()?.[0];
    if (selected === 'custom') {
        return form.money('customAmount')?.value() ?? 0;
    }
    return selected ? parseFloat(selected) : 0;
});

const processingFee = form.computedValue(() => {
    const amount = donationAmount();
    // Typical card processing: 2.9% + $0.30
    return Math.round((amount * 0.029 + 0.30) * 100) / 100;
});

const totalWithFees = form.computedValue(() => {
    const amount = donationAmount();
    const coverFees = form.checkbox('coverFees')?.value();
    return coverFees ? amount + processingFee() : amount;
});

form.addRow(row => {
    row.addCheckbox('coverFees', {
        label: () => `Cover the $${processingFee().toFixed(2)} processing fee so 100% goes to our mission`,
        defaultValue: false,
        isVisible: () => donationAmount() > 0
    });
});

form.addRow(row => {
    row.addPriceDisplay('total', {
        label: 'Your Total Gift',
        computedValue: () => totalWithFees(),
        variant: 'large',
        isVisible: () => donationAmount() > 0
    });
});

The fee is calculated dynamically based on the donation amount. The checkbox label shows the exact fee, making it transparent. The total updates instantly when the option is toggled.

Studies show 30-50% of donors will cover fees when asked. That's significant recovered revenue with zero additional cost.

Anonymous Giving

Some donors prefer anonymity. Respect this while still collecting necessary information like email for tax receipts.

// Anonymous donation option
form.addRow(row => {
    row.addCheckbox('isAnonymous', {
        label: 'Make my donation anonymous',
        defaultValue: false
    });
});

// Donor info section
const donorSection = form.addSubform('donor', {
    title: 'Your Information',
    isVisible: () => form.checkbox('isAnonymous')?.value() !== true
});

donorSection.addRow(row => {
    row.addTextbox('firstName', {
        label: 'First Name',
        isRequired: true
    });
    row.addTextbox('lastName', {
        label: 'Last Name',
        isRequired: true
    });
});

donorSection.addRow(row => {
    row.addEmail('email', {
        label: 'Email',
        isRequired: true
    });
});

// Anonymous donors still need email for receipt
form.addRow(row => {
    row.addEmail('receiptEmail', {
        label: 'Email for Tax Receipt',
        isRequired: true,
        isVisible: () => form.checkbox('isAnonymous')?.value() === true
    });
});

Anonymous donors skip the full donor info section but still provide an email for their tax receipt. The form adapts to their choice without requiring them to think about what fields to skip.

Fund Designation

Letting donors choose where their gift goes increases engagement. They feel ownership over the impact.

// Let donors choose where their gift goes
form.addRow(row => {
    row.addRadioButton('fund', {
        label: 'Direct my gift to',
        options: [
            { id: 'greatest', name: 'Where Needed Most' },
            { id: 'education', name: 'Education Programs' },
            { id: 'health', name: 'Health Initiatives' },
            { id: 'emergency', name: 'Emergency Relief' }
        ],
        defaultValue: 'greatest'
    });
});

// Show fund description
const fundDescriptions: Record<string, string> = {
    'greatest': 'Your gift will be directed to programs with the most urgent need.',
    'education': 'Supports scholarships, school supplies, and teacher training.',
    'health': 'Funds medical supplies, clinics, and health education.',
    'emergency': 'Provides immediate relief for disasters and crises.'
};

form.addRow(row => {
    row.addTextPanel('fundDescription', {
        label: () => fundDescriptions[form.radioButton('fund')?.value() ?? 'greatest']
    });
});

"Where Needed Most" should be the default - it gives you flexibility. But specific programs attract donors who care about particular issues. The description text helps donors understand each option.

Employer Matching

Many companies match employee charitable giving. A simple prompt can double donations from eligible donors.

// Employer matching gift prompt
form.addRow(row => {
    row.addCheckbox('hasMatching', {
        label: 'My employer matches charitable gifts',
        defaultValue: false
    });
});

form.addRow(row => {
    row.addTextbox('employerName', {
        label: 'Employer Name',
        isVisible: () => form.checkbox('hasMatching')?.value() === true,
        isRequired: () => form.checkbox('hasMatching')?.value() === true
    });
});

form.addRow(row => {
    row.addTextPanel('matchingNote', {
        label: 'Matching gifts can double or triple your impact! We\'ll send you instructions after your donation.',
        isVisible: () => form.checkbox('hasMatching')?.value() === true
    });
});

Don't make matching required or complex. A checkbox and optional employer name is enough. You'll follow up with instructions after the donation is complete.

Complete Form Structure

Here's how all the pieces fit together in a streamlined form:

// Complete donation form structure
const form = createForm();

// Amount selection
form.addRow(row => {
    row.addSuggestionChips('amount', {
        label: 'Select Amount',
        suggestions: [
            { id: '25', name: '$25' },
            { id: '50', name: '$50' },
            { id: '100', name: '$100' },
            { id: 'custom', name: 'Other' }
        ],
        max: 1,
        isRequired: true
    });
});

form.addRow(row => {
    row.addMoney('customAmount', {
        label: 'Enter Amount',
        currency: '$',
        min: 5,
        isVisible: () => form.suggestionChips('amount')?.value()?.includes('custom'),
        isRequired: () => form.suggestionChips('amount')?.value()?.includes('custom')
    });
});

// Frequency
form.addRow(row => {
    row.addRadioButton('frequency', {
        label: 'Frequency',
        options: [
            { id: 'once', name: 'One-Time' },
            { id: 'monthly', name: 'Monthly' }
        ],
        defaultValue: 'once',
        orientation: 'horizontal'
    });
});

// Fund designation
form.addRow(row => {
    row.addDropdown('fund', {
        label: 'Direct my gift to',
        options: [
            { id: 'greatest', name: 'Where Needed Most' },
            { id: 'education', name: 'Education' },
            { id: 'health', name: 'Health' }
        ],
        defaultValue: 'greatest'
    });
});

// Donor info
const donorSection = form.addSubform('donor', { title: 'Your Information' });
donorSection.addRow(row => {
    row.addTextbox('name', { label: 'Full Name', isRequired: true });
    row.addEmail('email', { label: 'Email', isRequired: true });
});

// Options
form.addRow(row => {
    row.addCheckbox('coverFees', {
        label: 'Cover processing fees'
    });
});

form.addRow(row => {
    row.addCheckbox('subscribe', {
        label: 'Keep me updated on your work',
        defaultValue: true
    });
});

This structure prioritizes the essential path (amount → frequency → donor info) while making advanced options available but not overwhelming.

Psychological Principles

Anchoring

The first amount donors see influences their perception of appropriate giving. If you want higher gifts, start your suggested amounts higher. $50-$100-$250-$500 anchors differently than $10-$25-$50-$100.

Social Proof

"Join 10,000 monthly donors" or "Average gift: $75" signals that giving is normal and expected. Consider adding these messages near your form.

Loss Aversion

"Without your help, 50 families won't receive meals this month" is more motivating than "Your gift will help feed families." Frame the stakes clearly.

Reciprocity

If you've provided value (newsletter, resources, inspiration), donors feel more inclined to give back. The donation form is where that relationship converts.

Conversion Optimization

Minimize Fields

Every field reduces completion rates. Only ask for what you truly need. You can collect more information post-donation or through progressive profiling over time.

Mobile First

Over 50% of donations now come from mobile devices. Test your form on phones. Buttons should be thumb-friendly. Fields should be easy to tap. Suggested amounts work better than typing on small screens.

Progress Indication

For longer forms, show progress. "Step 2 of 3" or a progress bar reduces abandonment by setting expectations.

Trust Signals

Security badges, encryption mentions, and charity ratings (GuideStar, Charity Navigator) build confidence. Place them near the donate button where doubt might creep in.

Post-Donation Experience

The form is just the beginning. A great thank-you page and email:

• Confirms the gift immediately with specifics
• Reinforces impact with concrete examples
• Provides tax receipt information
• Invites further engagement (newsletter, volunteer, share)
• Makes the donor feel valued, not just processed

Configure your completion screen to celebrate the gift and set expectations for what happens next.