Giving Form V1

🤔Should i use form v1 or form v2?
In 95% of situations, we suggest using Form V2. Form V1 embeds directly into your website code and therefore allows for more custom configurations—although development knowledge is required to implement these configurations. Form V2 is delivered through an iFrame, provides a better user experience, and allows for more native Funraise features, like Apple Pay or Tickets.
✏️Good to know
The Form Ids and script links here are for demo purposes only. Be sure to copy the form code directly from your platform and then configure it using the tips below.

Embed a Form on your website

Single form
If you're only embedding a single form on a single page, you can copy and paste the entire embed code into an HTML block in the body of your webpage.

Multiple forms
If you're embedding multiple forms on a single page or across your website, you'll need to separate parts of the embed script and place them in the appropriate places.

Launch the form with custom buttons

You can hide the default Donation Form launch button and use your own buttons to target the Form. Add useDefaultButton: false to your Form Configuration Script and add data-toggle="modal" and data-target="#donateModal-yourFormId" to your button element.

Prefill an amount with your custom button

Launch the Form with a custom amount by adding data-amount="" to your button element.

Prefill donation and donor info

You can prefill some donation and donor information fields on the form.

Preselect an Amount button

Set or override the default amount button selected by adding preSelectButton: 1 to your Form Script. You can select any button: 1,2,3, or 4.

Set minimum and maximum amounts

Set a minimum allowed transaction amount with minAmount: 1 and a maximum allowed transaction amount with maxAmount: 50000. Enter your desired values.

Preselect a Frequency with a custom button

Your custom button can launch the Donation Form with a frequency preselected. Add data-frequency="" to your custom launch button. "o"=One-time, "w"=Weekly, "m"=Monthly, "q"=Quarterly, "y"=Yearly. Important: These frequencies must be enabled on your Form from within your platform.

Prefill info using URL parameters

Prefill donation and donor information with URL parameters. This improves your donors' experience and is particularly useful for email marketing campaigns because it uses merge tags to build a unique URL.
Prefill Fields with
x_fname= x_lname= x_email= x_amount x_frequency= x_address1= x_city= x_state= x_postal= x_country=
Try It
Add the following string to the url of a page on your site that hosts a Donation Form V1 or click to see a demo of all parameters.
?x_fname=Bilbo&x_lname=Baggins&x_amount=450&x_email=bbaggins%40funraise.org

Embed a Placed Form

Embed an open Form directly on your page. We call this a "placed form." Change isPopup: true to isPopup: false. Be aware that the form will change in height as a user progresses through the flow. This example adds an additional wrapper div to center the placed form.

If you are using the Placed variation for the Giving Form, you'll want to make sure you are also presenting mobile visitors with the best experience. While the Popup variation of the form is mobile friendly, the Placed form variation may not be, depending on your site layout.
We suggest adding javascript to detect the screen size and affect the display variation, like the example below.

Transaction Tags

Add Transaction Tags to a donation. Transaction Tags defined in the form script are added to any tags set from within platform.

Add multiple currencies

By default, your Form uses your platform currency. You can override your default or add multiple currencies, then configure the ask buttons for each currency.

Customize the text on your Donation Form

You can customize all the text on the Donation Form: change a few words or translate the entire form. You must enter the text on your donation form exactly as it exists first, and then enter your desired text. This method also works with structured data, like structured state-country picklists.

Set structured address fields

To set structured country and state fields, add structuredStateCountry: true to your Form configuration script.

Redirect donors

You can redirect the user onSuccess. This can be used with a special "Thank You" page or url for analytics tracking. PayPal is special and has its own redirection link configurable from the Donation Form Editor. Please keep in mind, as with all custom implementations, this is only an example and not all browsers will treat this the same way. Be sure to fully test your unique solution.

reCAPTCHA

reCAPTCHA is a tool from Google that helps reduce bots and fraud attempts on your Donation Forms. Setup is easy but involves several steps and configuration in both your Funraise platform and in the Form code. Get step-by-step instructions at the link below.

Event Handlers

Use Event Handlers, onSetup, onSuccess , and onFailure to run custom functions or pass data to other systems. Depending on the stage of the donation process, you can pass donor and donation properties into your custom functions as arguments.

Events
onSetup
  • Called when the donation form is loaded on a page
onSuccess
  • Called when a donation succeeds
  • Donor and Donation properties passed in as arguments
onFailure
  • Called when a donation fails
  • Donor and Donation properties passed in as arguments
Properties
These properties can be passed through event handlers.
donation.amount
donation.comment
donation.company
donation.companyId
donation.companyMatch
donation.currency
donation.dedicationEmail
donation.dedicationMessage
donation.dedicationName
donation.dedicationType
donation.formAllocationId
donation.formId
donation.frequency
donation.id
donation.organizationId
donation.paymentType
donation.recurring
donation.referrer
donation.sourceUrl
donation.tags
donation.tipAmount
donation.tipPercent

donor. address
donor.city
donor.country
donor.email
donor.fname
donor.lname
donor.phone
donor.postal
donor.state

Analytics Tracking

Google Analytics, Facebook pixel, etc.
Use Funraise Giving Form Event Handlers to pass data to your marketing platforms to complete the conversion analytics loop. For example, pass donation data back to Facebook or Google Analytics to track ROI and conversion metrics.

Activate Donor Store

With Donor Store activated, a donor’s information will be cached in their browser. When they return to any Donation Form V1, their information (not including payment information) will be populated automatically. To activate, add useDonorStore: true to your Form Configuration Script.

Set allowed frequency

You can set the allowed frequencies for a Donation Form from the Configuration Script by adding allowedFrequencies:

Stay in the nonprofit loop.

Get weekly updates on tips, trends, and best practices to help power your nonprofit. #nonprofitz4lyfe

Oops! Something went wrong while submitting the form.