Donation form gadget

So that visitors to your site can donate to your organization, you can add a donation form that integrates with your payment system and contact database.

You can choose the donation fields you want displayed on the donation form as part of the settings for the donation form gadget. The Amount field is a system field that cannot be excluded from the donation form. To add or modify donation fields, hover over the Donation menu and select Donation settings.

If the visitor viewing the donation form is not logged in, contact fields will appear on the form as well. You can choose the contact fields you want to appear on the form as part of the donation form gadget settings, but you cannot exclude the Email field.

To accept online donations, you need to set up online payments.

To track the success of your fundraising efforts, you can add a donation goal gadget to a page on your site. You can also embed a Wild Apricot donation form on another website using widgets.

Adding a donation form

You cannot add a donation form gadget – or any other singular gadget – to a page template or system page, or to a page containing another singular gadget.

To add a donation form to a page on your Wild Apricot site, follow these steps:

1. Click the Website menu, then click the Sites pages option within the Website module.
2. Create or begin editing the site page where you want the donation form to appear.
3. Click the Gadgets icon to display the list of available gadgets.
4. Drag the donation form gadget from the list, and drop it where you want it to appear on the page. You can insert it into a section within a layout, or above or below a layout.
   If the donation form gadget is grayed out within the Gadgets list, that means you're editing a page that already has a singular gadget on it.
5. After you have dropped the gadget in the desired location, hover your pointer over it and click the Settings icon.
6. From the gadget settings panel on the left, choose the desired settings for your donation form. For more information, see Donation form settings (below).
7. Click Save to save the changes to the page.

For instructions on restricting access to the page, see Page access and visibility.

Donation form gadget settings

Using the gadget's settings, you can control its appearance and content. For instructions on displaying gadget settings, see Gadgets.

The following settings are available for donation form gadgets:

Contacts fields to include
Select the contact fields to be included on the donation form. The Email field is automatically included and cannot be excluded.

Donation fields to include
Select the donation fields to be included on the donation form. The Amount field is automatically included and cannot be excluded. To add or modify donation fields, hover over the Donation menu and select Donation settings.

Margins
The amount of space – in pixels – that appears outside the gadget. You can set top, bottom, left, and right margins separately.

Padding
(Casefile and Kaleidoscope themes only) The amount of space – in pixels – that appears between the content of the gadget and the outer limits of the gadget. You can set top, bottom, left, and right padding separately. If you have set a fixed height for the gadget, the bottom padding will be ignored.

Advanced
Within the Advanced section, you can enter CSS code or classes to further control the appearance and behavior of the gadget. For more information, see Gadget settings.

Adding a description

You can add a description to your donation form by inserting a content gadget ahead of the donation form gadget. Within the content gadget, you can add a title and description, and format them using text styles. For more information on adding and formatting text, see Using the content editor.

Changing colors and fonts

You can change the colors, text styles, and backgrounds used in your website from the Colors and styles screen.

For more advanced fine-tuning, you can use CSS customization and theme overrides.

For donation form gadgets, you can modify the following elements from the Colors and styles screen:

"Donations"

• General formatting or Typography > Text/Normal, H3
• General formatting > Form > Form instructions
  (Bookshelf, Building Blocks, Clean Lines, Dark Impact, Fiesta, Firma, Homestead, Kaleidoscope, Showcase, Skyline, Terra, Tinted Tiles, Whiteboard, White Space only)

"Mandatory fields"

• General formatting or Typography > Text/Normal
• General formatting > Form > Form instructions
  (Bookshelf, Building Blocks, Clean Lines, Dark Impact, Fiesta, Firma, Homestead, Kaleidoscope, Showcase, Skyline, Terra, Tinted Tiles, Whiteboard, White Space only)

Labels

• General formatting or Typography > Text/Normal
• General formatting > Form > Labels
  (Bookshelf, Building Blocks, Clean Lines, Dark Impact, Fiesta, Firma, Homestead, Kaleidoscope, Showcase, Skyline, Terra, Tinted Tiles, Whiteboard, White Space only)

Options

• General formatting or Typography > Text/Normal
• General formatting > Form > Option title
  (Bookshelf, Building Blocks, Clean Lines, Dark Impact, Fiesta, Firma, Homestead, Kaleidoscope, Showcase, Skyline, Terra, Tinted Tiles, Whiteboard, White Space only)

Pay, Cancel buttons

• Functional buttons > Normal/Hover
  (Clean Lines, Dark Impact, Fiesta, White Space themes)

Any changes you make will be applied to other gadgets that use the same settings.

Using the donation form

To make an online donation, a visitor to your site fills out the required fields on the donation form and clicks the Pay button.

Each donation form consists of:

• the contact fields selected within the donation form gadget settings
• the donation fields selected within the donation settings

If the donor is not logged in, the form will show both the contact fields and the donation fields.

If the donor is logged in, the form displays only donation fields (since the system already has contact information for the logged-in donor).

When someone makes a donation without being logged in, their email is used to match them against your existing contacts database. If there is a matching contact, the donation details are linked to their contact record. If there is no matching email, a new contact is created.

Values entered in contact fields on donation forms will not update corresponding fields in the donor's contact record, but are stored separately within donation records. See Customizing your contact database fields for more information.

Once your payment processor confirms the successful processing of the payment transaction, it will communicate with our server and the donation will be marked as Confirmed in the database. A confirmation email and a payment receipt will then be sent to the donor. The donation receipt can be re-printed or re-sent at any time. For instructions on customizing the donation receipt, see Customizing receipts.

If the payment fails or the visitor abandons the transaction without completing payment, the donation record will have an In progress status, and after 24 hours, it will be automatically marked as Likely abandoned. You can view these records from the Donations screen using Attention required and In progress filters.