This article is about using CF7 Skins Multi in the Contact Form 7 form editor. To learn about using CF7 Skins Multi in the CF7 Skins Visual Editor, see CF7 Skins Multi (with Visual Editor).


.

CF7 Skins Multi allows you to break your Contact Form 7 forms into multiple steps easily. Forms can be divided where required, quickly & easily, right within the Contact Form 7 plugin interface.

Multiple page forms are the modern way of handling long forms. Generally, users are much more comfortable in filling forms section by section, instead of going through long forms.

In this article, we show you how to use CF7 Skins Multi with Contact Form 7’s form editor to build your own multi-page form.

Example

To begin with, let us take a look at a multi-page form example.

Form Editor with multi-page form

Instructions

1. Starting from the initial template

Start by selecting the Contact Template from the Template tab of the CF7 Skins section.

CF7 Skins Multi with CF7 Form Editor

With the CF7 Skins Multi plugin activated, there is a section at the top of the CF7 form editor for CF7 Skins Multi pages/tabs.

2. Creating the form page/tab

Next, creating an extra specific page of your form is the same as you would for a single-page form.

You can refresh your memory on how to build a single-page form at Edit your CF7 Skins Form (Contact Form 7 Editor).

Tip: You can use the CF7 Skins Templates Tab on each section (tab) of the form as you normally would on regular CF7 Skins forms.

3. Adding pages/tabs to your form

A. Adding a tab after the current tab

Click on the + icon to add a tab. You can now edit the tab as you need.

Add a tab in CF7 Skins Multi with CF7 Form Editor

B. Adding a tab between two existing tabs

Click on the + icon of the tab before where you want the new tab to be.

Add a tab between two tabs in CF7 Skins Multi with CF7 Form Editor

4. Editing your page/tab titles

Double-click on each tab to rename it. A dialog box pops up where you can change the name of the tab.

Edit the tab name in CF7 Form Editor

5. Using Multi Options

You can choose from the range of options available for your multi-part form.

Multi options available in CF7 Form Editor

The options available are:

  • Progress Bar – Indicates to users where they are
  • Navigation Buttons – Previous & Next on each Tab
  • Pagination – Current page / total number
  • Start & End Tab Text – Additional helpful text
  • Thank You Tab – Extra tab displayed only after the form is successfully submitted

Tip: Click on Multi Options to show/hide the options and pick the ones you want for your form.

6. Deleting your tabs

To remove a tab, simply click on the x icon.

Tip: Once you save the form, you cannot undo a delete action.

Using CF7 Skins Visual Editor

Besides, you can also use the CF7 Skins Visual Editor to create your multi-part form in a similar way as using the traditional CF7 Form Editor.

Demo Form

You can now complete the form below to see a CF7 Skins Multi form in action.

    Multiple Page Forms for Contact Form 7

    CF7 Skins Multi allows you to easily break your Contact Form 7 forms into multiple steps. Forms can be divided where required, quickly & easily, right within the Contact Form 7 plugin interface. (In fact this is a CF7 Skins Multi Form you are using now.)

    Your Details

    You can help us improve CF7 Skins Multi by completing this form

    You can see a detailed example of how a CF7 Skins Multi form works and help us at the same time by simply completing this form. It will help us to understand better how you might use the CF7 Skins Multi Add-on.

    (This page was created by selecting the Contact Template and adjusting to our requirements.)

    Multi-part forms are the preferred way to handle long forms

    Multiple Page Forms is the modern way of handling extensive forms. Generally, users are much more comfortable in filling forms section by section instead of going through long forms.

    Please tell us how you use WordPress and your current level of experience.

    Your WordPress Experience
    1. Which of the following best describes you in relation to WordPress?
    2. How would you describe your WordPress skills? (please choose the one that fits best)

    This page was created by selecting the Event Template and adjusting to our requirements.

    With CF7 Skins Multi you can break up your forms into separate parts/tabs/sections as you want. We're interested to find out which of the many features included with CF7 Skins Multi are most important to you .

    Features
    1. Very ImportantImportantNot ImportantDon't know
    2. Very ImportantImportantNot ImportantDon't know
    3. Very ImportantImportantNot ImportantDon't know
    4. Very ImportantImportantNot ImportantDon't know
    5. Very ImportantImportantNot ImportantDon't know
    6. Very ImportantImportantNot ImportantDon't know
    7. Very ImportantImportantNot ImportantDon't know

    This page was created by selecting the Survey Template and adjusting to our requirements.

    Thank you for completing this form

    If you have any suggestions to improve our CF7 SKins Multi Add-on you can add them below.
    Suggestions

    This page was copied from the Contact Template and adjusted to our requirements.

    %d bloggers like this: