API Library

Shadow Forms

The input fields on your API form must map back to your Luminate Online database fields. To construct this mapping, create a shadow form with Online Giving. Every field on your API form must have a corresponding field on the shadow form.

image

Add either the Checkout modal or Checkout embedded data element to your form. See Create a Donation Form or Update your Checkout Experience for Donation Forms for instructions. If you do not update your form, the Checkout modal will be automatically added to your form.



Select a scenario below to view the related instructions.

You are starting a new form and want to include the checkout modal.

See the donation form tutorial. New forms automatically include the modal. You do not need to add or remove data elements.

You are starting a new form and want to include the embedded checkout.

See the donation form tutorial. New forms automatically include the modal. Remove the modal data element and add the embedded data element.

  1. Select Design Donors Screen.
  2. Next to Donation Form, select Edit.
  3. Under Selected data elements, select Checkout modal and Remove.
  4. Under Select data elements to include in this form, select Checkout embedded and Add.
  5. If you want to change the placement of the element, select it in the included data elements list and use the up and down Order arrows.
  6. Select the data element and Save Order and Edit Selected.
  7. Select Edit Data Element to configure, and then select Preview Data Element.
  8. Save any changes.
You are starting with an existing form without either checkout data element and want to add one.
  1. Find your form in the All Donation Forms list and select Edit.
  2. Select Design Donors Screen.
  3. Next to Donation Form, select Edit.
  4. Under Select data elements to include in this form, select either Checkout modal or Checkout embedded.
  5. Add it to the list of included data elements.
  6. If you want to change the placement of the element, select it in the included data elements list and use the up and down Order arrows.
  7. Select the data element and Save Order and Edit Selected.
  8. Select Edit Data Element to configure, and then select Preview Data Element.
  9. Save any changes.
  10. Select Test Drive to try out the donation form and Publish.
You are starting with an existing form with a checkout data element but want the other checkout data element.
  1. Find your form in the All Donation Forms list and select Edit.
  2. Select Design Donors Screen.
  3. Next to Donation Form, select Edit.
  4. Under Selected data elements, select either Checkout modal or Checkout embedded.
  5. Remove it from the list of included data elements.
  6. Under Select data elements to include in this form, select either Checkout modal or Checkout embedded.
  7. Add it to the list of included data elements.
  8. If you want to change the placement of the element, select it in the included data elements list and use the up and down Order arrows.
  9. Select the data element and Save Order and Edit Selected.
  10. Select Edit Data Element to configure, and then select Preview Data Element.
  11. Save any changes.
  12. Select Test Drive to try out the donation form and Publish.
Add Custom fields

To add custom fields to your shadow form:

  1. Find your form in the All Donation Forms list and select Edit.
  2. Select Design Donors Screen.
  3. Next to Donation Form, select Edit.
  4. Select New under Select data elements to include in this form.
  5. Name your element, select a data type and associated settings. Select Apply.
  6. Select your new data element under Select data elements to include in this form and Add it to Arrange the order of the selected data elements. You can change the placement of your field by selecting it and using the up and down Order arrows.
  7. Select the data element and Save Order and Edit Selected.
  8. Select Edit Data Element to configure and then select Preview Data Element.
  9. Save any changes.
  10. Select Test Drive to try out the donation form with your custom field and Publish.


image

Remove custom payment fields from your API from. The new checkout experience includes payment fields in the Checkout modal or Checkout embedded data element. Define which checkout data element to include in the Checkout API Integration Javascript code. This code must be added to your API form as described in the integration guide.

To link your API donation form to your shadow form, set the form_id parameter in your API method call to the shadow form's id. To find the form id:

  1. In Luminate Online, select Fundraising and Donation Management.
  2. Select All Donation Forms.
  3. Find your form in the list. The form id is displayed directly under the form name.
image