Support » Plugin: GiveWP - Donation Plugin and Fundraising Platform » Radio Buttons Not Aligned

  • Resolved garyseven

    (@garyseven)


    Hey There

    Awesome plug-in playing with it now to see if it works for my client before going pro. Radio buttons are not aligning with text as you can see here –

    https://imgur.com/a/8zzRB0X

    Also – i know this has been asked but solution just not working – can you give me a CSS snippet that will let me style JUST the donate/submit button? The CSS i copied was styling the whole form.

    Thank You!

Viewing 15 replies - 1 through 15 (of 17 total)
  • Also – the offline donation feature is not working – i am unable to select the checkbox.

    Thank YOu

    Can anyone help with this please? OK I narrowed down the issue – when using the permalink the offline payments radio button can be checked and selected – but when embeding with the shortcode it is impossible to select the radio button

    • This reply was modified 5 months, 2 weeks ago by  garyseven.
    Plugin Author Matt Cromwell

    (@webdevmattcrom)

    Hi there,

    I can help if I see the problem live, rather than a screenshot. Can you provide a live link to your form so I can help with the CSS?

    Plugin Author Matt Cromwell

    (@webdevmattcrom)

    HI there,

    Your theme has some very opinionated input styles, which makes it difficult to override, but this custom CSS will work:

    form[id*=give-form] #give-donation-level-radio-list>li input[type=radio] {
        display: inline-block !important;
    }

    Add that to the bottom of your theme’s styles.css file; or go to “Appearance > Customize > Custom CSS” and add it to the bottom of that setting. For more detailed info on adding custom CSS, see here: https://givewp.com/documentation/resources/handling-custom-css-in-wordpress/

    Regarding the Offline Donations, it doesn’t appear as if you have Offline Donations enabled on your form at all. You’ll want to go to “Donations > Settings > Payment Gateways” and make sure OFfline Donations is enabled. Whether it’s on the Give Form page, or embedded via the shortcode it should not matter at all — if there’s a problem selecting the proper gateway (once it’s enabled) then most likely that is another theme issue, but you’ll need to enable it so I can see that problem live in order to provide additional custom CSS.

    Review that and let me know how it goes.

    Hi There – THANK YOU – trying to paste the code but I get the following errors

    https://imgur.com/a/eHr9L0t

    PS. Client doesn’t want Offline for now – if they do I will implement and reach out.

    Plugin Author Matt Cromwell

    (@webdevmattcrom)

    If you compare what I provided above, with what is pasted in your CSS settings, you’ll see that the highlighted part is incorrect:

    Screenshot

    Thanks!

    • This reply was modified 5 months, 2 weeks ago by  Matt Cromwell. Reason: added image as a link

    Matt

    You are a rockstar. Thank you it works – and I also made a purchase of an add-on as well – so thanks for your time!!!

    Can I ask if there is a snippet of css i can use to change the color of the donate now button?

    G

    Plugin Author Matt Cromwell

    (@webdevmattcrom)

    This should do it!

    input.give-submit {background: black; color: white;}
    input.give-submit:hover {background:white; color: black;}

    If you’re enjoying Give and appreciate our support, we’d love a kind review from you here:
    https://wordpress.org/support/plugin/give/reviews/

    Thanks!

    I guess paste that in the same place i pasted prior CSS? or just on that page?

    Is it possible to switch our the color with a HEX #?

    Thanks

    Plugin Author Matt Cromwell

    (@webdevmattcrom)

    Yes, paste it in the CSS editor like the previous. And yes, you can use whatever HEX # you’d like instead.

    Thanks!

    Thanks once again!!

    https://imgur.com/a/fsJ4IU0

    Doesnt seem to be working?

    G

    Plugin Author Matt Cromwell

    (@webdevmattcrom)

    Ah! That’s not the “Donate Button”, that’s the “Reveal” button because it “reveals” the rest of the form. Here’s what you need for that:

    input.give-btn-reveal {background: black; color: white;}
    input.give-btn-reveal:hover {background:white; color: black;}

    Ah ok thanks – it doesnt seem like the CSS is affecting either button though

Viewing 15 replies - 1 through 15 (of 17 total)
  • You must be logged in to reply to this topic.