Jotform makes it easy to add toggle-style switches to your form with the Bootstrap Switch Field widget. Instead of standard checkboxes, this widget lets users switch options on or off with a modern, user-friendly design. It’s perfect for settings, preferences, or yes/no style questions where you want a clean, interactive look.
Here are a few ways to use it:
- Let users turn features or services on or off in a signup form
- Add a sleek yes/no toggle to surveys or feedback forms
- Use it in booking or order forms to enable optional add-ons
- And more!
Whether you’re creating a new form or updating an existing one, you can add and set up the Bootstrap Switch Field Widget in a few easy steps. Here’s how to do it:
- In Form Builder, click on Add Element on the left side of the page.
- Now, in the Form Elements menu, under the Widgets tab, search for Bootstrap Switch Field and click on it. Or, just drag and drop it to where you want it to be on your form.
- Next, in the Widget Settings window that opens on the right side of the page, under the General tab, you’ll see this list of settings you can configure:
- ON Label — Enter the custom text to display when the switch is turned on (left side).
- ON Color — Choose the color to display when the switch is on.
- OFF Label — Enter the custom text to display when the switch is turned off (right side).
- Then, scroll down to the bottom and continue to set up these settings:
- OFF Color — Choose the color to display when the switch is off.
- Size — Select the size of the switch field.
- Default Status — Set whether the switch is on or off by default when the form loads.
- Once you’re done, click on Update.
That’s it. You’ve successfully added and set up the Bootstrap Switch Field widget on your form. Want to see how it works? Check out this live demo form.
Note
- For advanced styling of the Bootstrap Switch Field widget, you can add your own custom CSS code under the Custom CSS tab in the Widget Settings. Our guide on How to Inject CSS Codes to Widgets walks you through everything.
- You can also configure the widget properties, like alignment, labels, size, visibility, and more, to control how it looks and behaves in your form. Check out our guide on How to Access and Configure the Question Properties of a Widget to learn more.




Send Comment: