On Mastodon

Prevent Multiple Contact Form 7 Submissions without JavaScript

If you want to stop users from clicking the submit button on Contact Form 7 forms multiple times, eg. to prevent multiple submissions, add this CSS snippet to your stylesheet:

.wpcf7-form.submitting .wpcf7-submit {
    pointer-events: none;
}

Explanation:

  • CF7 will add the submitting class, once the submit button has been clicked. The class will persist until all fields have been validated and/or the form has been sent successfully.
  • The pointer-events property with a value of none will make the submit button not clickable.