Webhead

Developing WordPress websites, themes, and plugins in Hawaii

webhead

Contact Form 7 Multi Step Form Result

by

This is the 3rd step of 3 steps in the Contact Form 7 Multi-Step Forms sample.  Below shows an example of the final step where users can verify everything they entered from previous steps.  The links below will show what the Form and Mail tabs look like on the admin side.

    Please fill out the form on the previous page.

    view relevant code on the Form tab

    Your Fake Email (required)
[multiform "your-email"]

How many websites have you built?
[multiform "menu-87"]

What do you look for in a WordPress plugin?
[multiform "checkbox-588"]

Select your favorite topic:
[multiform "radio-204"]

A Message no one will read
[multiform "your-message"]

What are you going to use this plugin for?
[multiform "checkbox-257"]

[previous "Go Back"][submit "Submit"]
[multistep multistep-576 last_step send_email]

    view relevant code on the Mail tab

    Fake Email: [your-email]

How many websites have you built? [menu-87]

What do you look for in a WordPress plugin? [checkbox-588]

Select your favorite topic: [radio-204]

A Message no one will read: [your-message]

What are you going to use this plugin for? [checkbox-257]

    Contact Form 7 Multi Step Form 2

    by

    This is the 2nd step of 3 steps in the Contact Form 7 Multi-Step Forms example.  Below demonstrates more form elements, a Previous button to go to step 1, and a way to display data entered from previous steps.

      Please fill out the form on the previous page.

      view relevant code

      A Message no one will read
[textarea* your-message x4/200]

What are you going to use this plugin for?
[checkbox* checkbox-257 use_label_element exclusive "a multi-step contact form" "online application" "newsletter signup" "other"]

Just so you know, a confirmation email will <strong>NOT</strong> be sent to [multiform "your-email"] because this is a demo form.

[previous] [submit "OK, Next"]

[multistep multistep-57 "/contact-form-7-multi-step-form-result/"]

      Contact Form 7 Multi-Step Form

      by

      This is the 1st of 3 contact forms demonstrating the Contact Form 7 Multi-Step Forms plugin.  These forms will not send any emails.  Fill out the form and click next to see step 2.  Click on the link below the form to view the form’s relevant code.

        Click to view relevant code

        Your Fake Email (required)[email* your-email]

How many websites have you built?
[select menu-87 include_blank "None" "One" "So many it's easy" "Lost count 10 years ago"]

What do you look for in a WordPress plugin?
[checkbox checkbox-588 use_label_element "Good Quality" "Simple to Use" "Well Documented" "Great Support" "Good Reviews"]

Select your favorite topic
[radio radio-204 default:1 use_label_element class:cf7links "Contact Forms" "Optimized Web hosts" "Affirmations" "WordPress plugins"]

[submit "Next"]

[multistep multistep-422 first_step "/contact-form-7-multi-step-form-2/"]

        A Multi-Step Application Form

        by

        An application form can span multiple pages on paper.  It has things like personal information, education history, employment history, reasons why you want the job, reasons why you left your job, and achievements.  This form can get pretty long and on a website it isn’t ideal to have all this on one page.  I have done a multi-step form plugin, but this form would require saving the entry to the database.

        If only there was an easy to use, affordable plugin that offered multi-step forms spanning multiple pages, saved the entry, conditionally showed and hid other fields based on the user’s responses, and sent an email at the end.  Oh wait there is…  Formidable Pro.  With this plugin I could drag and drop fields and create a simple multi-step application form within minutes.

        The employment history section needed to dynamically add sections so the applicant could add as many or as little employment experience as they needed.  This could be achieved by repeating sections now, but at the time this feature was not available yet.  Instead I conditionally hid about 7 or so employment sections and whenever the add button was pressed I incremented a counter and conditionally showed another section.

        Another issue with the form was collecting the social security number.  This needed to be encrypted and kept safe as much as possible.  With the hooks provided by Formidable it was fairly straight forward to intercept the SSN and encrypt it before it was saved to the database.  Now we needed to limit viewing of that SSN.  Whenever the form was viewed online you wouldn’t want the SSN showing and also you wouldn’t want that long string of garbage characters from the encryption showing.  So, again, using hooks provided by Formidable and help from their awesome support, I could intercept what would be shown and replace it with “***-**-****”.

        It would be nice if the applicant’s data could be downloaded as a PDF and viewed like a normal paper-form.  At the time of developing this, again, Formidable did not have too many options that I liked, so I made my own.  Using domPDF and Formidable’s views I got the data to download as a PDF.  Formidable has these “views” where you can display your form any way you want.  But I needed to know if the view was being used for the PDF vs just online viewing.   Within the PDF would be the only time the SSN would show in its true form.  Formidable’s support forums was a lifesaver figuring this one out.  Once downloaded the form was scheduled to be deleted in 24 hours as an extra precaution.

        The last issue was uploading the Resume.  While this is built into Formidable and the upload was as simple as dragging a control onto the form in the Form Builder, WordPress naturally does not protect uploads.  Luckily I had made another plugin to protect the WP-Content folder.  All I had to do was activate and set this.

        This application form was quite the task and I seriously would have taken double or triple the time if it wasn’t for the Formidable Pro support team.  I have tried competing form plugins and they are nowhere near as helpful and their code is a mess.  In contrast, the Formidable team provided priceless help and support while maintaining beautiful code.

        Clear Cache for Me

        by

        W3 Total Cache and WP Super Cache are great caching plugins, but they do not know when a widget is updated. WPEngine, SiteGround, and Kinsta are some of the best places to host your WordPress installation, but their caching system is no smarter when it comes to updating widgets and menus. I created this plugin because my website did not see any changes when saving widgets or menus using these caching systems. Clear Cache For Me will purge ALL your cache each time you do a save without having to press an additional button. It may be overkill, which may be why it’s not built in, but some people need simplicity.

        Works with the following caching systems:

        • Autoptimize
        • Breeze Cache
        • Cache Enabler
        • GoDaddy Cache
        • Kinsta Cache
        • LiteSpeed Cache
        • Elementor (CSS Cache)
        • Premium Addons for Elementor
        • SiteGround SuperCacher
        • WP Fastest Cache
        • WP Optimize Cache
        • WP Rocket
        • WP Super Cache
        • W3 Total Cache
        • WPEngine Cache

        Clears all cache for following actions:

        • When Widgets are saved
        • When Customizer is saved
        • When Menus are saved
        • When a Contact Form 7 form is saved.
        • When a Formidable Form form is saved.
        • When WooThemes settings are saved.
        • When NextGen Gallery albums and galleries are updated (beta – may not clear cache on all actions).
        • When Qode options are saved this plugin forces browsers to reload the custom css and custom js.
        • When a WP Forms forms or settings are saved.
        • When WooCommerce settings are saved. (Cache should already be clearing when products are saved.)
        • When settings from the Insert Headers and Footers plugin by WPBeginner are saved.
        • When Settings from a settings page is saved. This includes settings from WordPress core, Yoast SEO, and most other plugins using the Settings API.
        • When WordPress is updated.
        • When plugins are updated, activated, and deactivated.

        There is a convenient clear cache button on the dashboard for users with the right capability. Admins (users with the ‘manage_options’ capability) can set which capability a user needs to view the button. If you are using this button often, please consider submitting a request to have this plugin do your button-pushing for you. This plugin is meant to work behind the scenes to make your life easier and less frustrating.

        Development Mode
        An option is included in the settings to force your browser to get a fresh copy of CSS and Javascript files.  This is a convenient option to use when you or your developer are updating the site and want to be sure the changes are seen.

        Development Notes
        Since some caching systems run in the shutdown hook, this plugin also runs in that hook. This means if PHP does not have enough time, some code including any hooks within the ccfm_clear_cache_for_all() function are not guaranteed to run. If you need code to run, consider using the ccfm_clear_cache_for_me_setup hook.

        View it in the WordPress plugin repository.

        Contact Form 7 Multi-Step Forms

        by

        With this plugin you can create multiple Contact Form 7 forms and link them together to create a multi step form.  The free version of this plugin allows you to create multi-step forms with a limit on the amount of information that can be submitted.  The limit is due to the fact that the plugin uses cookies to store the submitted data from one step to the next.  If a submission exceeds the browser’s cookie size limit, you’ll notice chunks of missing data in that submission.

        See a example of the plugin working here:
        https://webheadcoder.com/contact-form-7-multi-step-form/

        Note:  If you need a form that saves entries or needs conditional fields consider using Formidable.  I have used this plugin to build a multi-step application form.

        PRO VERSION

        The Pro version of this plugin will allow your forms to submit as much as 5MB of data.  That’s over 1,000 times more data than the free version.  This is because the Pro version uses Session Storage. This means you can have a ton of fields and steps more than the free version. (File uploads are still only supported on the last step and does not count towards the limit.) Session Storage has been available in all major browsers since about 2010.

        Please make sure you try out the Free version of the plugin first and see if that works for you.  If you try submitting your form and you are not receiving all the information in the email or you just don’t want to risk losing data when the submission gets too large, you can upgrade by clicking the button below. 

        Additional Features

        What this plugin does not do

        • This plugin does not support file uploads on every form. If you need to use file uploads make sure to place it on the last step.

        • This plugin currently does not support “pipes” in the select field. See here for more on what “pipes” is on the Contact Form 7 site.

        • This plugin currently does not support “Exclude lines with blank mail-tags”. 

        • This plugin does not load another form on the same page. It only works when the forms are on separate pages. Many have asked to make it load via ajax so all forms can reside on one page. This plugin does not support that.


        Currently the Pro version REQUIRES the WordPress REST API and Contact Form 7 AJAX submission to be enabled.          By default these settings are already enabled.

        WHAT IS TRACKED?
        Data is collected for every site (or sub-site in multisite installations) the admin opts in for or that has an active license key. Most data-points are collected on a weekly cycle, and only if there are changes. Some events like license activation/deactivation and plugin activation/uninstall are collected immediately.

        OTHER PLUGINS

        WP-Cron Status Checker

        Make sure WP-Cron is always working.

        Clear Cache For Me

        Automatically purge all cache when your caching system may not.