Demo

Here you can find the demo.

Description

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.

Import layout

  1. Create a new page with Divi
  2. Click on “Portability” (the two arrow icon)
  3. Go to the “Import” tab
  4. Drag or select JSON (multi-step-form.json) file
  5. Check “Import Presets”
  6. Click “Import Divi Builder Layout”

Customization

Icons

  1. Download an SVG on any website (e.g. icons8.com, thenounproject.com, flaticon.com)
  2. Go to Caldera Forms → Forms → Edit → Click on Pencil of Icon
  3. Replace the SVG in the code with yours (but only the SVG, keep the div)

FYI: I used this icon pack here

FAQ

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, …


Add to Wish List

Submit a Comment

Changelog:

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
license file.

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