WPEForm Lite – Drag and Drop Live Form Builder for Contact, Payment & Quiz Forms

Description

WordPress Contact, Payment & Quiz Form Builder Plugin

WPEForm is a Live, No-Code, Drag-N-Drop Form Builder for quizzes, payment estimations, personality tests, surveys, contacts, lead generations and user feedback of all kinds.

Exclusively written for WordPress the goal is to help you get started in 10 minutes.

With WPEForm, you create a form with our intuitive and a truly No-Code Form Builder.

1. You drag and drop your favorite form elements with our best in class Form Builder.
2. Publish it on your website with Gutenberg Blocks or Shortcodes or new Block Widgets or the Landing page.
3. Collect data from your users.

Examples | Documentation

The best features of our form builder includes

• 100% Mobile and Container responsive. No matter what device or what area of your theme, forms will look good. The grid of the form responds to the width of the container it is placed in.
• With latest shadow dom technology, your forms will look the same, no matter what the theme. If you want, you can turn this feature off.
• View your submissions from WordPress admin, right from the free plan. That’s right, we don’t block viewing submissions behind a paywall. Apart from email notifications, you always have the option to view it from the admin area.
• Keep your forms private in WordPress and share with only the WordPress users you trust.
• Very modern form builder, built with TypeScript/React and a GraphQL API.
• You can edit form submissions from admin. You can even let (with limitations) submitting users edit their submissions.
• Comes with many color schemes. If you don’t like them, you can always create your own with our handy color picker.
• All form elements’ label, description, title etc are rich text based. Change colors, format text, insert images, videos, there is absolutely no limitations.
• Multi paged forms are treated as first-class citizens. Large forms should be split into multiple pages and WPEForm makes it easier than ever.
• Personality tests with multi tiered outcomes. You can create buzz feed like quizzes without hiring a developer.
• Automatic landing pages like this all from your WordPress site starting with WPEForm Lite.
• Headless mode, create your forms in WordPress, publish them on your CDN deployed static sites, like Gatsby, Nextjs etc (totally free).

Premium Version

This is the lite and free version of WPEForm. It gives you all features you need for contact forms and quizzes. For more advanced usage, do check our Premium versions. You will like all the more form elements, integrations, newsletter and payment functionalities.

We understand that a form is like a mini application. It needs to be interactive, responsive and fast. Our whole product is centered around these ideas.

Live Form Builder with Drag and Drop

Our form builder is the first of its kind for WordPress. It built on top of a GraphQL API with TypeScript/React. We want the form builder to be super fast and intuitive, giving you the best possible User Experience (UX). You spend more time building your forms, not fighting the Form Builder.

• Add any number of pages or tabs to the form.
• Add any number of elements to the page.
• Align form elements in columns of custom sizes on different breakpoints.
• Easily access form settings from sidebars.

In the video above, we see a full tutorial to create this form in under 8 minutes. Install now and see for yourself. Our whole powerful form builder is available from the FREE plan. We didn’t put any performance features behind paywall.

Pre Built Form Templates

We have included many form templates to help you get started right away. You do not always need to start from scratch. Most of the form templates are available right inside the New Form Wizard. More templates can be viewed and downloaded from our Examples page.

Tier based Personality Quizzes

You can have any number of Score Tiers, like personality scores. All WPEForm elements can have scores assigned to them. Depending on the choice of the user you can add any score to any of the tiers.

This gives you 100% flexibility on how scores are calculated. See this form for an example.

All the above comes FREE with WPEForm. With STARTER plan you can put timers per page (or overall), record submission time and show graphs of different tiers of submissions. See this example.

Browse Form Entries

With WPEForm Lite (and of course premium) you always get to see list of submissions made by your users. Whenever someone submits the form, it gets saved in your WordPress database and shows up in WPEForm administrative area.

Just go to WPEForm / Submissions and see all entries and leads. You can view or edit the entries or delete them.

Form Landing Pages optimized for distraction free Conversion

Right from our free plan, you get standalone, landing pages. Just click on the Preview button and copy the URL. See this form as an example. With the upcoming professional version, you will be able to customize more of the landing page, without writing any code. Just like google forms or typeforms, but right inside your very own WordPress.

25+ Form Elements to choose from

WPEForm comes with all the form elements you could think of and more. We are in active development of form elements, so you will almost never run out of options. And if you do, we humbly ask that you let us know and we will do our best to bring it to the next version.

The FREE version of WPEForm comes with basic sets of form elements, namely
Radio, Checkbox, Dropdown, Text, TextArea, a few design elements like Heading, Question Group, Article and the Captcha security element. These should be enough for anyone just starting out with contact forms.

As your requirements grow, you can upgrade WPEForm to one of the paid plans and gain access to more form elements. Right now, we’ve released the STARTER plan which has the following extra elements (on top of everything available from the FREE version): Toggle, Math output, Slider, Range, Rating, Matrix Choice, Matrix Input, DateTime, Slider Group, Range Group, Rating Group, Math Group, Sortable, Stacked Group and Address.

Stay tuned as we release more form elements tailored to solve your problems.

Truly responsive form design

WPEForm forms are truly responsive. They respect the size of the container you put them in. This is very helpful when you place the forms in narrow widgets or footers or popups. They just look good and work.

An example to attention to detail would be our Dropdown Element. It is available from FREE plan and very unique. When viewed from mobile it shows a pop-up type dropdown near the thumb of your user. When viewed from desktop, it shows a regular dropdown.

You also get many form themes which would work with any WordPress theme out there (more on this later). If you do not like our color schemes, you can always make your own.

Lastly in the STARTER plan, there’s a Dark Mode feature. When enabled, the form will response to the visitor’s preference and turn on dark mode for itself.

100% Conflict free with any themes or plugins

We are using latest Web Technologies with WPEForm. The goal is to give a form that looks the same no matter which WordPress theme you are using. For this we’ve leveraged the Shadow DOM API. It just ensures that CSS coming from your theme or any other plugin doesn’t interfere with WPEForm and vice-versa.

As long as your website doesn’t produce any JavaScript error on the page our forms are guaranteed to work.

By the way, if you want your theme to override WPEForm styles, you can turn this feature off from Site Settings of WPEForm.

Best in class administration

WPEForm comes with exhaustive administration features. We’ve included everything you need to administrate the submissions. If you think something is missing, then do let us know and we will do our best to add it.

• View and Edit submissions from WordPress admin.
• Get notified and notify your users when someone submits a form.
• Categorize forms for easy access and filter.

and much more. Install now to see them in action.

Share forms with multiple users

By default a form is scoped to the WordPress user who created it. In the default configuration

1. Administrators and Editors can create forms.
2. Editors can view only the forms they have created and their submissions.
3. Administrators and editors can share the form with other admins and editors.
4. Shared forms give privilege to view/edit form and submissions.

This works great for a network of form authors. In future we will add capabilities editor so that you can choose who exactly can create forms regardless of their WordPress role.

Powerful Conditional Logic System

Any form builder is useless without logical steps. WPEForm treats conditional logic as first-class citizen. With our system you can

1. Show or hide individual form elements or groups or pages;
2. Set value of other elements;

Depending on the value (or values) of the source element.

The logical system is split into two things:

1. Events – You choose combination (with AND or OR operators) of events.
2. Consequences – If the event was successful, you fire up consequences.

Headless Form Mode

This is the very first in WordPress. Our Forms are basically react app with a GraphQL API. So we’ve made a way, you can run WPEForm in headless mode. Just add one config in your wp-config.php and we are good to go. Some use cases includes:

1. Make your forms in your WordPress site and render on your static sites.
2. Use your own form library and communicate with the GraphQL API to send submissions.
3. Render forms on your React applications, GatsbyJS site or Next.js sites.

The possibilities are endless and we are just getting started. Be sure to read our documentation website to learn how you can setup headless mode and start using forms in your react applications today.

This feature is totally opt-in and is disable by default. You do not have to worry about security concerns because by default the GraphQL API is hardened with a nonce verification. If you do enable headless mode, it will run with anonymous user when sending submissions. We’ve made sure the API is super secure, with 100s of automated tests. But of course we are also human. Should something bad happens, we will be prompt to patch it.

FREE PLAN FEATURES

Starter form elements pack

Starter form elements pack includes Checkbox, Button, Group, Row, Column, Dropdown, Heading, Radio, Captcha, Text, TextArea, Slider.

Starter form themes pack

Starter form themes comes with great colors from Material UI. We’ve also included the two themes, Vivid Blue and Teal from our premium theme pack. No themes support dark mode in the FREE version.

Customizable Theme

You can set primary color, text color and background color and the system will create a beautiful form theme for you. This feature is included in the FREE version so that you can always match your form with your website.

Conditional logics and outcomes

The full features of conditional logic, events and consequences are available from the FREE plan. No feature is behind a paywall here.

Outcome and tier based quizzes

Add as many types of outcomes you want. There is no limit. However the graphs and designation part of the summary table is only available from the starter plan.

Submission summary and notifications

After submitting a form, your users would get a notification with a link to the summary page. Of course you can change the notification from the WPEForm Form settings. Here’s an example of email sent to user. Similar email is sent to administrator of the form with more links to administrate the submission.

User portal page

Central page to access ones own submissions. Please see the screenshot.

Form categories

Create and assign categories to forms. Available from Free version.

Shared form editors.

Share forms with your editors as explained above. The full functionality is available from free version.

STARTER PLAN FEATURES

Starter plan includes all the features from the FREE plan and more.

PDF downloads

PDF download submissions for both administrator and users. Email attachment is coming soon.

Extended form elements

Extended form elements includes – Toggle, Math output, Range, Rating, Matrix Choice, Matrix Input, DateTime, Slider Group, Range Group, Rating Group, Math Group, Sortable, Stacked Group.

Numeric calculations

Assign numeric value to almost any form element and use the Math Output element with valid numeric formula to show estimate.

Extended form themes pack

Many premium form themes based on the color schemes of Refactoring UI book. More themes on the way.

Dark form themes pack

Make your forms stand out by automatically responding to user’s color preference. When turned on, the forms will turn Dark if user prefers a dark color scheme. This is best used with WordPress themes that support dark mode. You can also keep the dark mode always on, if that’s your preference.

Form timer and stopwatch

Have page wise or overall form timer for restricted quizzes. Also record the form submission time with a stopwatch.

Graphs for quiz outcomes.

When you have multiple outcomes or tiers in your quiz setup, a radar graph will show up in the summary page. It will also include data-table for different outcomes along with designations you’ve set.

PROFESSIONAL AND BUSINESS FEATURE

We are currently working on the professional and business plans of WPEForm. Please see our Roadmap for more information.

Roadmap

We are just getting warmed up with the initial release of WPEForm. We have tons of features in our todo list. Here are some of the important upcoming features.

• FREE – Make translation easier. We need to modify the tooling on the source.
• STARTER – PDF attachment of submission in admin and user email.
• STARTER – Modify the output of summary page.
• STARTER – Custom dataset for MCQ elements.
• PRO – All pro features, especially payments and integrations.
• BUSINESS – All business features, especially WordPress core integration, like guest blogging, login forms, registration forms, profile update forms etc.

and more. Follow me on Twitter for updates and React/TypeScript tips.

Screenshots

Blocks

This plugin provides 3 blocks.

• WPEForm Lite – Drag and Drop Live Form Builder for Contact, Payment & Quiz Forms
• WPEForm Lite – Drag and Drop Live Form Builder for Contact, Payment & Quiz Forms
• WPEForm Lite – Drag and Drop Live Form Builder for Contact, Payment & Quiz Forms

Installation

You install WPEForm like any other WordPress plugin.

1. Go to yourwebsite/wp-admin > Plugins > Add New.
2. Search for WPEForm Form Builder.
3. Install and Activate the plugin.

Alternately you can download from here and upload onto your website.

After installation

1. Go to WPEForm > Dashboard.
2. Click on New Form button.

More information on installation can be found in our Documentation website.

FAQ

Where can I find documentation?

Updated version of documentation can always be found at WPEForm Knowledge-base

Is this WPEForm translation ready?

Yes, both server side and client side assets are translation ready. All po, mo and json files should go inside the languages directory. We have included sample po, mo and json files from where you can copy and start translating. Detailed instruction can be found in our documentation website.

Why should I choose WPEForm?

You may choose WPEForm if:

• You are a business owner, looking to create high converting forms.
• You are a developer, looking to create beautiful forms for your clients.
• You have a personal blog, where you want a good looking form.
• You are a photographer, looking to collect feedbacks from your viewers and customers.
• You are a designer, looking for a way your clients can get in touch with you.
• You need a cost estimation and quotation form for your agency.
• You need a health record form to keep track of your patients or clients.

you get the idea. If our drag and drop form builder cannot solve your requirements, let us know and we will make sure it does.

What types of Forms can I create with WPEForm?

Basically every kinds of forms can be made with WPEForm.

• Contact forms.
• Website survey and feedback forms.
• Business and operations forms.
• Payment forms.
• Cost estimator forms.
• Event management and booking forms.
• Employee request forms.

Do visit our examples page for more form templates.

Do I need to know coding?

Not at all. The primary goal of WPEForm is to help you create forms, without needing to write any code. With WPEForm you have access to a live, drag and drop form builder. Just visualize and build your forms. Very much like the new and excellent block editor WordPress offers.

Can I import/export forms between my sites

Yes. Right from admin dashboard, you get the option to export your form as a json file. Then on the new form wizard, you get another option to import from the json file. It is that easy.

I am stuck, where can I get support?

Please visit our support page.

What is this GraphQL thing WPEForm is built with?

I am very glad you asked this question. Traditionally many plugins are built where the server would send the HTML needed to render a plugin’s output. This technique is very well suited for SEO related contents, like your blog posts. But, rendering forms with this technique can severely slow down the server. A form is like a mini application. It needs to be interactive, fast and very responsive.

A better suited way is to let the server deal only with the form data (very similar to the json file you get when you download an export code of a form). Let the client, i.e, your users browser render the form. This approach is sometimes called JAMStack. Where we deal with JavaScript, API and Markup. This is very new and very hot. Personally I wanted to bring this to WordPress. I also made a tooling wpack.io to make this easier for WordPress developer.

So I choose GraphQL to deal with the API part and React to render forms and manage application. This way, the server remains very fast. It does not have to do anything with application logic, just the very important business logic. The client also remains fast, because with GraphQL API, it just gets the data it needs, and not a single byte more.

With this API based development approach, we now can offer you, for the first time in WordPress, headless forms. Make your forms in your WordPress Admin. Then use our client library to render your forms on static websites, like Gatsby, nextjs, or basically anywhere.

Where can I find the source code?

The human readable PHP source code is available in this repository. The JavaScript code can be found at @wpeform/react npm repository. We will very soon separate all our components and put it on GitHub for other open source usage.

Reviews

Blazing Fast. Highly Customizable.

saikatdas0790 July 30, 2021

The most powerful forms plugin I’ve come across to date. – Blazing fast – Highly customizable – Modern interface If I’m building powerful and custom forms, this is my goto choice.

Contributors & Developers

Changelog

v1.6.5 (2023-07-06)

• DEPS: Upgrade freemius SDK.
• DEPS: Update tested up to for WordPress.

v1.6.4 (2022-11-04)

• REFACTOR: Major refactoring of the main Submission Handler to better handle internal state with small classes. This helps in opening up the system to add more complex features.
• DEPS: Update Freemius SDK to v2.4.5.
• DEPS: Update all JS dependencies to latest semver.
• UPDATE: (TS) Update and use new APIs of zustand state management library.

v1.6.3 (2022-03-04)

• FIX: Security update.

v1.6.2 (2022-02-11)

• CHORE: WordPress 5.9 compatibility check.

v1.6.1 (2021-11-09)

• FIX: Invalid default address being generated in localhost environment.

v1.6.0 (2021-09-10)

• FEAT: New WP Dashboard widget for quick stats.
• FEAT: Update freemius SDK to latest 2.4.2 stable.
• FEAT: New setup script for headless forms.
• FEAT: Form view properly increases in headless mode.
• FEAT: Use prism react renderer in admin side for better perf.
• FIX: Button appearance in admin notices.
• FIX: Settings HTML leaking into shortcode generator page.

Premium

• FIX: Trial version not allowing premium features.

v1.5.3 (2021-08-14)

• FIX: Weird appearance in fontawesome icon picker.
• FIX: Move to menu appearance issue in form builder.

v1.5.2 (2021-08-12)

• FIX: Use proper cache control in form and submission GraphQL Queries.
• CHORE: Plugin file header tags for WP 5.8 requirements.

v1.5.1 (2021-08-11)

• FIX: Add cache control to preflight check in headless mode.

v1.5.0 (2021-08-11)

• FEAT: Override dark mode feature for headless forms.
• FEAT: Use a spinner type control for Slider free input.
• FEAT: Properly support floating point in sliders and ranges.
• FEAT: Better admin side configuration validation system.
• FIX: Use proper mobile keyboard for different input masks.
• FIX: Error message overflow issue on sliders with custom marks.

v1.4.0 (2021-08-06)

• FEAT: Better documentation on headless mode. Check our website.
• FIX: Regression: declarative shadow dom not working on browsers other than chrome.
• FIX: Some styling issues on safari browser.

v1.3.0 (2021-08-05)

NOTICE: After updating to version 1.3.0, please edit your forms and do a force save. This will regenerate the skeletons and will make sure there is no FOUT (Flash of Unstyled Text) when loading the form. I am very sorry for the inconvenience. Also if you are using a default theme other than vividBlue, please go to WPEForm > Settings and Update the settings.

• FEAT: Headless Form Mode: Render your forms you made in WordPress to React Applications. Totally opt-in and available in all versions (including free).
• FEAT: Better hydration of form, user portal and summary skeleton. This removes FOUT in page loads.
• FEAT: Use a better implementation of shadow dom (leveraging React 17 event system) to increase performance and decrease asset size.
• FEAT: Lazy load sentry sdk for less impact on the app.
• FEAT: New option to disable admin side asset sandboxing. Enable this if something in WordPress admin breaks.
• FEAT: New option to prefer the Standalone admin pages by default.
• FEAT: Add style related data in forms graphql query for rendering in third-party applications.
• FEAT: Better default style for buttons.
• FEAT: Use better technique for intersection observer for better performance.
• FEAT: Use JavaScript version of FontAwesome for better legibility and lesser asset size.
• FIX: Page button appearance in regular view.
• FIX: Consider custom plugin directory name when sandboxing (opt-in now) assets.

v1.2.0 (2021-07-31)

• FEAT: Make plugin fully translation ready.
• FEAT: Improve form builder performance.
• FEAT: Improve form validation appearance.
• FEAT: Consistency in form loading skeleton.
• FIX: Proper React hydration of forms with or without shadow dom.
• FIX: Update JS and PHP dependencies.
• FIX: Form builder nested element having weird height on bottom.
• FIX: Some element appearance issue in WP Admin.

v1.1.1 (2021-07-27)

• FIX: font icon picker appearance issue in form builder.
• FIX: WordPress plugin repository picking wrong block names.
• FIX: Make naming in blocks more consistent.

v1.1.0 (2021-07-27)

• FEAT: Make block registration more complaint.
• FIX: editorScript and editorStyle in block registration.

v1.0.4 (2021-07-26)

• FIX: Fontawesome not showing up in Gutenberg Block Editor in some cases.

v1.0.3 (2021-07-25)

• FIX: Text and textarea race condition with set element touched.
• FIX: Unnecessary shipping of font files in repository.
• FIX: Old generation of skeleton html in build process.

v1.0.2 (2021-07-23)

• FIX: Make sure register_block_type exists before calling.

v1.0.1 (2021-07-22)

• Initial release.