Donate Button in SureDonation

The Donate Button block controls the submission button displayed on the donation form.

This button allows donors to complete and submit their donation after filling in the required fields.

You can customize the button label and apply additional styling to match your campaign branding.

Common use cases include:

• Changing button text to match campaign goals
• Creating personalized call-to-action messages
• Improving donor engagement
• Matching the button style with website branding

Examples of custom button labels:

• Donate Now
• Support This Cause
• Contribute Today
• Complete Donation
• Help Flood Relief

Add a Donate Button

To add a Donate Button:

1. Open the donation form editor.
2. Click the Add (+) button.
3. Select Donate Button from the available blocks.
4. The button will appear in the form.

To customize the button:

Edit Button Text

You can edit the button label displayed to donors.

To update the button text:

• Select the Donate Button block.
• Click directly on the button text in the editor.
• Enter your preferred button label.
• Save the changes.

Example:

Default: Donate

Custom: Donate Now

Use clear and action-oriented text to encourage donations.

Advanced Settings

The Advanced tab provides styling controls for the button.

Additional CSS Class(es)

Add one or more CSS classes to customize the button’s appearance.

Separate multiple classes using spaces.

Example:

primary-donate large-button

This is useful when applying custom styles through your theme or site CSS.

Additional CSS

Apply custom CSS properties directly to the Donate Button.

You only need to enter CSS properties and values.

Example:

background-color: #2271b1;
color: white;
border-radius: 8px;
padding: 12px;

background-color: #2271b1;
color: white;
border-radius: 8px;
padding: 12px;

Do not include CSS selectors.

Use this option to customize the button appearance without editing theme files.