Multi Step Form
Here you can find the demo.
This is a Multi Step contact form. Currently, it has the following pages:
- image radio button (page 1)
- image checkboxes (page 2)
- image radio button (page 3)
- two input fields on (page 4)
For the form to work, you need the free Caldera Forms plugin.
The big heading and title of the images can be styled with the Divi Builder. The rest is styled with CSS.
The form is fully customizable in the Caldera Forms settings.
You can use radio buttons, checkboxes or input fields and all the other options Caldera Forms has, like sliders or text areas.
- Create a new page with Divi
- Click on “Portability” (the two arrow icon)
- Go to the “Import” tab
- Drag or select JSON (multi-step-form.json) file
- Check “Import Presets”
- Click “Import Divi Builder Layout”
- Download an SVG on any website (e.g. icons8.com, thenounproject.com, flaticon.com)
- Go to Caldera Forms → Forms → Edit → Click on Pencil of Icon
- Replace the SVG in the code with yours (but only the SVG, keep the div)
FYI: I used this icon pack here
How are the images connected to the radio buttons or checkboxes?
They are automatically connected if you add dv-radio or dv-checkbox to the images and dv-radio-buttons or dv-checkboxes to the radio buttons or checboxes.
Then automatically the first dv-radio image is connected to the first radio button, the second to the second, …
1.0.0 - first version
1.1.0 - added second page (hosting)
1.2.0 - added another page checkboxes (extra service)
Please scroll down for the support form
This theme, layout or plugin is comprised of two parts.
1. The PHP code and integrated HTML are licensed under the General Public
License (GPL). You will find a copy of the GPL in the same directory as this
2. All other parts, including but not limited to the CSS code, images and design are
copyrighted by the vendor concerned and are NOT licensed under GPL.
This license allows the item to be used in projects for either personal or commercial use by you or on behalf of a client. The item cannot be offered for resale either on its own, in part, or as part of a larger project including that being part of a hosting offer. Distribution of source files is not permitted.
*Support is provided by vendors directly.
Please login to access the support form. you can do so here
Follow us on Instagram
Free Treats for Smart Divi Foxes 🦊
We give you free Divi Theme Layout Packs, cheat sheets, exclusive offers and much more. 100% free and no strings attached - promised!