By default when using the Checkbox form field, you can select as many options as you’d like. But you have to select them manually. Giving the option to bulk select all of the options in your Checkbox can save time to complete your form.
1) Setting up the form
First, you’ll need to set up your form and add the Checkbox form field to your form with all your options. Please know that where ever you place the option to bulk select everything has no bearing on the setup itself.
2) Adding the CSS Class
Next, inside the form builder click on Field Options » Advanced Options and in the CSS Class, add the
checkBoxClass to your Checkbox.
Finally, the last step is to add the code to your site.
In the above code snippet, you’ll notice the
#wpforms-793-field_1_1. This part of the code will need to be updated to match not only for your form ID but also your field ID of the Checkbox field as well as the option number that the Select All option is with regards to what number it was when you added in the options.
Let’s break down that line of code to show you what each number represents.
#wpforms-793. The 793 represents our form ID.
-field_1. The 1 represents our field ID.
_1. The final number is the where the Select All option appears in our list. If you added it as the first option – it will always be 1. If you added 20 options to your Checkbox and made the Select All option the last option, this number would be 20.
If you need help locating your form or field ID, please review this tutorial.
Now you’re visitors have an easy bulk all option on your form.
Would you like to use images for your Checkbox options? Take a look at our tutorial on How to Apply Images to Checkbox Labels Using CSS.