Display Error with Radio/Button Selection

  • Resolved xyf17

    (@xyf17)


    2 weeks, 5 days ago

    Hi Jonas,

    I’m using your Donation Platform for WooCommerce plugin and I’m experiencing a UI/display issue with the donation amount selection interface.

    Issue Summary:

    The donation amount selection (radio buttons / button layout) is not displaying or behaving as expected on the frontend.

    Expected Behavior:

    Users should be able to clearly see and select donation amounts (via radio buttons or styled selection buttons), and the selected option should be visually reflected in the UI.

    Actual Behavior:
    The donation selection interface does not display correctly (or appears inconsistent with the configured settings)
    Radio/button selection does not visually update as expected when a user selects an amount
    The layout does not match the intended “styled donation selection” experience
    Settings already checked:
    Donation amount range settings are configured (min/max values set)
    Compatibility mode tested (enabled/disabled)
    Product is configured as a donation product in WooCommerce
    Theme: standard WooCommerce theme setup
    Environment:
    WordPress + WooCommerce latest version
    Donation Platform for WooCommerce plugin active
    PayPal gateway via WooCommerce
    Request:

    Could you please confirm whether this is a known UI behavior or if there is a specific configuration required to enable proper radio/button selection display for donation amounts?

    If there are theme compatibility requirements or shortcode variations for the intended UI layout, I would appreciate guidance.

    Thank you very much for your support.

    Best regards,
    Alex

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

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Jonas

    (@flinnn)

    2 weeks, 5 days ago

    Hi xyf17,

    it seems like you have 2 donation forms on your page. Having 2 donation forms on a single page is not supported. It also seems like you’ve added some custom styles that are breaking some of the default styles. Can you please check if the following changes resolve your issues?
    1. Only add one donation form per page.
    2. Remove custom styles that are messing up with the styles provided by Donation Platform for WooCommerce.

    Best,
    Jonas

    Thread Starter xyf17

    (@xyf17)

    2 weeks, 5 days ago

    Hi Jonas,

    Thanks for your response — that helps clarify a lot.

    You’re absolutely right: I currently have two donation forms on the same page. The reason I did this is that my theme (Flatsome) interferes with the default layout and behavior of the donation form, so I used some custom CSS to adjust the display and separate the “One Time Payment” and “Subscription Payment” options visually.

    However, I now understand that having two forms on a single page is not supported and may be the root cause of the issues I’m experiencing.

    My goal is to achieve a layout similar to your demo here:
    https://www.wc-donation.com/demos/demo-style-3/

    Specifically:

    A single donation form
    With a clean toggle or selection between “One Time Payment” and “Subscription Payment”
    Without breaking the default functionality

    Could you please advise on the best way to implement this using only one donation form?

    For example:

    Is there a built-in setting or shortcode option to enable both One Time and Subscription within the same form?
    Or is there a recommended way to structure this (without duplicating forms) that would work well with themes like Flatsome?

    I will also remove the custom CSS overrides to avoid conflicts and test again based on your recommendations.

    Thanks again for your guidance — really appreciate your help.

    Sincerely yours,
    Alex
    Plugin Author Jonas

    (@flinnn)

    2 weeks, 4 days ago

    Hi,

    yes, you can combine everything into a single product. Just set the “Expire after” field to 1 month for the one-time variation:

    see https://www.wc-donation.com/documentation/integrations/setting-up-variable-recurring-donations-with-woocommerce-subscriptions/

    Best,
    Jonas

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

You must be logged in to reply to this topic.