How to change fields and text on fundraiser form?

On the fundraiser form, instead of showing “Choose an amount” and a text box, I’d like to show several check boxes e.g.

[radiobutton1] $50/month

[radiobutton2] $100/month

[radiobutton3] $200/month

[radiobutton4] other amount [text field]

How do I do that?

  • Milan
    • WordPress Wizard

    Hey Aldo

    Hope you are well today and thanks for asking us. :slight_smile:

    You can create different rewards for different amount. :slight_smile: Jus enable reward option for fundraiser. You’ll see that option when you edit or create fundraiser. :slight_smile: Please see this attached screenshot. :slight_smile:

    Let me know if this helps or not. :slight_smile:

    Cheers,

    Milan

  • Aldo
    • Flash Drive

    Thanks Milan for your reply.

    Please take a look at the screenshot.

    Could you please advise as how do I:

    1. Remove the text field

    2. Remove the label "Choose An Amount"

    3. Put "Support this mission" button below the options

    4. Remove "None" as an option

    Thank you,

  • Predrag Dubajic
    • Support

    Hi Aldo,

    This should be all fairly easy to remove using some CSS code, however I don’t see those elements on your site and we would need them to see what would be the best way to go about it.

    Can you add all desired field and let us know where we can see it in action so we can assist you further with this?

    Best regards,

    Predrag

  • Adam Czajczyk
    • Support Gorilla

    Hello Aldo,

    Thanks for sharing an URL with us!

    Following CSS rules will hide the “Choose an amount label”, the text filed and the “none” radio button:

    .wdf_custom_donation_label {display:none;}
    .currency {display:none;}
    .wdf_pledge_amount {display:none;}
    .wdf_reward_item_none {display:none;}

    This rule should move the button down:

    .wdf_donate_button {position:absolute;margin-top:150px;}

    To apply this CSS to your site please add it to your child theme’s “style.css” file (if you’re using a child theme) or use Simple Custom CSS plugin that you will find here:

    https://wordpress.org/plugins/simple-custom-css/

    Best regards,

    Adam

  • Adam Czajczyk
    • Support Gorilla

    Hello Aldo!

    I can see that you moved the panel to the sidebar and that’s why this fonts got bigger – it picked up style form sidebar. Here’s another piece of CSS code that will let you change font size and progress bar color:

    .wdf_time_left {font-size:12px;} /* size of "XX Days left" */
    .wdf_level_amount {font-size:13px;} /*size of donation amount options */
    .wdf_reward_item {clear:both;} /* fix radio buttons display */
    /* progressbar color fix */
    .ui-widget-header {background:transparent;}
    .ui-progressbar-value {background-color:#FF0000;}

    I commented the code so you know which values to change in order to affect which parts of panel. In case these rules didn’t work for you try tweaking them by adding “!important” flag (one by one line) like this:

    .wdf_time_left {font-size:12px!important;}

    Best regards,

    Adam

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.