Customize the Donation Form

  • Hi there,

    I am a new user of Charitable plugin and I am interested in using this plugin to handle our fundraising need. But before I jump in, I need to figure a few things out.

    I saw this donation form (screenshot: https://prntscr.com/q0nf84)on the Recurring Donation plugin page by Charitable:https://www.wpcharitable.com/extensions/charitable-recurring-donations/. I have two questions here:

    1. How can I customize the donation form to be like this? The best donation button I ever seen is here: https://my.charitywater.org/donate. I really want to move the donation amount fields together which looks more compact.

    2. And I tested it on our test site, the “Details” tab and “Payment” part is too long and won’t fit the donation page. Is there any way to put it on the next pay after the user clicks the “Donate” button?

    Many thanks~
    Stone

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)

  • Hi @rootstone,

    You may be able to do the customizations you want with just CSS. For example, if you’re wanting the suggested amounts to be smaller and a little closer together, you could try something like this:

    
.charitable-donation-form .donation-amounts .donation-amount {
    width: 100px;
}

.charitable-donation-form .donation-amounts .donation-amount {
    margin-right: 5px !important;
}

.charitable-donation-form .donation-amounts .custom-donation-amount.donation-amount {
    width: 150px;
}

    I’m not sure what you mean about the Details/Payment parts being too long to fit on the donation page. Could you send me a link? There isn’t an easy way to shift those to a separate page.

    Cheers,
    Eric

    • This reply was modified 5 years, 4 months ago by Eric Daams.
    Thread Starter rootstone

    (@rootstone)

    Sorry Eric,

    I was too busy with different things at this busy season.

    Here is the link you can take a look, please go to https://agapedc.org/donate/. The donation form is too long and expands the background photo a lot vertically…

    If I can have a few information, like Donation amount and “Donate” button or “Next” button on the first page, after clicking, then it leads to the next page which requires further information like PayPal account or Credit info, etc., I think that would be perfect. Because:

    1. Separated pages will ease the customers’ or donors’ pressure of filling too much info on one page even eventually they actually fill the same amount of information.

    2. It’s easier for the Donation page to fit the form and look beautiful.

    What do you think?

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Customize the Donation Form’ is closed to new replies.