Creating a Donation Button using Panorama

How to create a Donation Button using Panorama's Donation Form

Donation Form – Donate Button code generator

Create a lasting Donation form that your organization can customize its Donate Button which will generate a code to embed on your official website.

Organizations can customize the following:

• Button text
• button background color
• button text color
• button text font
• size of the button
• shape of the button corners

Selecting “Generate Code” will display a modal from which organizations can copy the code needed to embed the Donate Button on their official website.

Embed your donate button on your organization’s official website

An HTML Code generates when a Donate Button is created.

This gives organizations the functionality to update their website code to include the new Donate Button or replace their existing one. 

Here’s an example of what that might look like.

When the donor clicks on the Donate Button, a 3-step donation modal appears. 

Your organization’s website can still be seen in the background, but it’s grayed out.

Step 1: The donation form will ask for the Donation Amount. 

It can also ask whether the Donor would like to Cover the Fee, Recurring or One Time, Suggested Donation Amounts, and Tribute/Honor information.

Step 2: Asks for the Donor’s Details including:

• Name
• Address
• Email Address
• Contact
• Permission questions
• Title
• Middle Name
• Address Line 2
• Phone Number
• Matching Gift
• Custom Questions

Step 3: Collects the Payment Information.

Step 4: Finally, a Thank You page is shown. 

This can be customized to show things like the Social Share Widget, image galleries, text blocks, and video sections. 

Once completed, the donor can select the ‘X’ to close the modal and return to the client’s website.

To learn more on how to customize the donation form refer to our help center article on How to Create a Donation Form using Panorama.