Using REACH, you can create any number of unique donation forms and customize them to your preferences and embed them on your webpages or add links to your communications.

Donations forms can be a one-page or a three-page donation process.

• An embedded custom donation form will be one-page, since custom forms allow you to change the order of fields.
• An embedded standard donation form will be a 3-page step form with a particular order.

All custom forms use the one-page donation process format.

There are two ways to create unique donation forms, both can be found by going to Settings > Donation Forms:

• + New Form button – Use when you want additional options such as donation levels, header and footer content and CSS styling
• Create Custom Donation Form Link button – Use when you want to set donation form parameters and amounts for your default donation form or one of your custom donation forms

Note: When using an embedded donation form, current supporters will not not be prompted to log in to access their payment information. However, if a current supporter uses the embedded form to make a donation, REACH will automatically attempt to match the donation to an existing support account by email address.

Creating a Donation Form (+ New Form)#

Note: Use this option when you want to create a custom donation form and add options such as donation levels, header and footer content and CSS styling.

• Go to Settings > Donation Forms
• Click on the green, + New Form
• Under the Settings tab, include a Title
  • Choose if you’d like to set as the Default Form
  • Check the box if you’d like to Disable
• Under the Amount Levels tab, you can set pre-filled Donation Amount Levels to show on your donation form.
  • Click Add Level
  • Add a Title and an Amount
  • Tip: You may wish to keep your Titles short in character length as these will be used in a donation form. You can always come back and adjust as needed.
  • To Delete, click on the Trash button
  • Continue to click Add Level to add multiple Levels
  • Tip: You can change the order of the levels by dragging the levels up and down
• On the Form Elements tab, review the various elements for your donation form.
  • Add any desired text for the text area next to the elements
• Add a Separator Label if desired
• Click on Add Elements to add any elements not required
  • If you want to learn how new supporters found out about your organization, view our Capturing: How’d you hear about us? article.
  • Change the order by dragging the elements up and down
• On the Header Content and Footer Content tabs,
  • Include any desired paragraph text or images you’d like to explain the purpose of your custom donation form. You can use various font sizes and colors here.
• On the CSS Styling tab,
  • REACH gives you the option to add custom CSS if you’d like to have more control over the appearance of your custom donation form.
• Once you’ve entered all the specifications, click Create Form.

From your Donation Forms list, click on the Action button to you can Edit, Share or Delete the Donation Form.

When you click on Share, you will be provided with the Link, the Embed Code and a button to Generate the QR Code.

Copy the Link any time you wish to direct your supporters directly to the donation form.

Copy the Embed code and use it on any webpage you have access to edit the html.

Note: If you are using REACH as your website, or want to embed a form on a REACH portal page, you will need to know HTML to do so.

Click the Generate QR Code button and a QR Code will be immediately downloaded that you can use to direct your supporters to the donation form.

Setting Donation Parameters (Create Custom Donation Form Link)#

Note: Use this option when you want to set donation form parameters and amounts for your default donation form or one of your custom donation forms.

• Go to Settings > Donation Forms
• Click on the blue Create Custom Donation Form Link button
  • Note: This process allows you to quickly input parameters such as a Purpose Type, Purpose, Affiliate and Amount.
• Set your Parameters
  • Selecting a Purpose will set the form to that specific donation Purpose
  • Set an Amount if you want to add a suggested amount in the field
  • Select the Donation Form you wish to configure from the dropdown menu. This could be your Default donation form or one of your Custom Donation Forms that will automatically be shown here if created.
  • You can set if a Donation is a Fixed Amount, Recurring, the Recurring Period if so, and Fixed Recurring

Click on Generate Link for the Custom Donation Form Link and Custom Embeddable Donation Form Code to be displayed.

To test the link, simply open a new browser window and paste the link into your URL bar. The donation page should load with the parameters set. The custom donation form link can then be added to any donate buttons or text you wish. It can also be used on your Portal Setup, as your Call to Action button.

Note: The code provided is the three-page donation form you can use to embed on any webpage. The embedded donation form code can be added to any website pages in which you have access to add HTML. If you are using REACH as your website, or want to embed a form on a REACH portal page, you will need to know HTML to do so.

Click on the Generate QR Code button and a QR Code will be immediately downloaded that you can use to direct your supporters to the donation form.

Example Donation Forms#

One-Page Example Form#

Here is an example of a one-page embeddable donation form code being used on a WordPress webpage that was generated from the + New Form button.

In this instance, the Embed code was inserted as a Code block element. It depends on the framework you are using in how you embed the code.

Three-Page Example Form#

Here is an example of a three-page embeddable donation form code being used on a WordPress webpage that was generated from the Create Custom Donation Form Link.

Again, the Embed code was inserted as a Code block element. It depends on the framework you are using in how you embed the code.

The first step allows for someone to choose an amount, the second step is for personal information and the third step is where payment information is collected.