Resolving Display Issues with the 3-Step Donation Form: Two Steps Shown at Once

Some users of Donation Platform for WooCommerce have reported encountering a problem where the first two steps of the three-step donation form are displayed simultaneously. Typically, the form should display each step individually, only progressing when the user clicks the “Next” button. However, in this scenario, both the “Choose an amount” and “Donor details” screens appear together, disrupting the flow of the donation process.

Possible Cause: This issue is likely caused by interference from another plugin, theme, or custom code. Specifically, a plugin or custom element might be introducing an extra closing </div> tag in the wrong location, affecting the form’s display logic.

Solution:

  1. Identify the Conflicting Plugin: Start by identifying whether any recent changes to your site (e.g., new plugins or updates) might have caused the issue. The culprit might be the Kadence Shop Kit plugin, specifically an option related to variation control.
  2. Disable Conflict Settings: If you are using Kadence Shop Kit or a similar plugin, check for any settings related to product variations. Disabling the variation control option in Kadence Shop Kit resolved the issue for the user who reported it.
  3. General Troubleshooting Steps:
    • Disable plugins one by one to identify the source of the conflict.
    • Check the theme’s code or any custom code snippets that may modify the form’s structure.
    • Use browser developer tools to inspect the page source and identify misplaced </div> tags or other HTML structure problems.

Conclusion: This issue was resolved by disabling a conflicting setting in the Kadence Shop Kit plugin. If you are experiencing a similar issue, follow the troubleshooting steps outlined above to identify the source of the problem. If the issue persists, consider contacting our support team for further assistance.