Add a checkout embedded data element to a form

The Checkout embedded data element presents the new checkout payment experience inline, rather than in a pop-up modal.

Tip: Using the checkout data elements for the first time? Check out our tutorial.

The Checkout modal and Checkout embedded elements both provide a responsive experience, but modal opens in an iFrame when prompted, whereas embedded is integrated into your form with no iFrame popup. The embedded element also allows more style customizations than the modal version.

Add the Checkout embedded data element

1. Select Fundraising and Donation Management.

2. Select Online Giving.

3. Select All Donation Forms, find a form in the list, and select Edit.

4. On the left, select Design Donor Screens.

5. Select Checkout embedded under Select data elements to include in this form and select Add.

6. Position the element where you want it in the form by selecting the element name and using the Order arrows.

   Do not remove the Payment Type element.

7. Select Save Order and Edit Selected.

8. Select your checkout configurations.

   

   • Accepted Payment methods - By default, checkout provides all available payment types.

   • Style - Optionally enter a color, font family, and font color.

     Note: Secondary color is deprecated and will be removed in a future release.

   • Cash Payment - To allow administrators in your organization the ability to record offline cash donations on this form, select this option.

   • Check Payment - To allow administrators in your organization the ability to record offline check donations on this form, select this option.

9. Preview, then Finish or Save your form.