JetFormBuilder — Form Builder for Gutenberg

Descrição

JetFormBuilder — Form Builder plugin for Gutenberg

A functional yet easy-to-use Form Builder plugin lets you create, edit, and style advanced form types in the Gutenberg Editor. No more supplementary drag-and-drop form builders. You can now use a one-stop interface to develop fully operative custom forms.

JetFormBuilder lets you build any kind of form nice and easy. Its 21+ field blocks allow creating forms from scratch or reassembling the existing ones. Throw JetStyleManager into the mix, and you’ll be able to adjust every form field’s fonts and style settings. Create form types, customize, and style – all in WordPress default blocks editor.

At first, I thought this was just another free form builder for Gutenberg, but I was wrong. I wanted to share what got me so excited about it after only the first 5 minutes.

– Paul Charlton from WPTuts.

WORDPRESS FORMS YOU CAN CREATE

JetFormBuilder is a user-friendly form creator that lets you create new forms and add them to the form page. From a simple form to multi-step form design – you can nail down any form type:

  • Signup form
  • User profile form
  • Quick contact form
  • Subscription form
  • Online survey form
  • Appointment form
  • Application form
  • Booking form
  • Event registration form
  • Multi-Page Form with a progress bar
  • WordPress Post Submission Form
  • Request a Quote Form
  • Feedback Survey Contact Form
  • Make a Suggestion Contact Form
  • Change Request Forms
  • Maintenance Request Contact Form
  • Scholarship Application Form
  • Make a Referral Contact Form
  • Volunteer Registration Contact Form
  • Credit Card Payment
  • Make a Donation Form
  • Product Purchase Form
  • Newsletter Signup Form
  • Online Petitions

BASIC FEATURES

VARIOUS FIELD TYPES

Find inside 21+ JetFormBuilder blocks colored to stand out from the crowd. You can mix and match them freely until you achieve a unique row or column layout.

POST SUBMIT ACTIONS

Choose from 11 available actions and set any you want to be performed after the form is submitted on the frontend:

  • Send Email;
  • Insert/Update Post;
  • Register User;
  • Update User;
  • Update Options;
  • Call Hook/Webhook;
  • Redirect to Page;
  • MailChimp;
  • ActiveCampaign;
  • GetResponse;
  • And more.

MULTI-STEP FORM & FORM BREAK BLOCK

Use Form Break to build multi-step WordPress forms. Divide the fields and place them into separate tabs. Add a customizable “Apply” button to proceed to the next step. Enable file uploads if desired. By adding a Form Progress bar, you’ll indicate the form’s first, current, and last steps.

CUSTOM FIELD STYLES

We integrated JetStyleManager & Gutenberg to make it possible for you to style the form fields as desired. Style settings can be applied to anything in the text box, form description, required mark, and content label, too.

BEGINNER-FRIENDLY & VISUAL

No more confusing field rows and additional styling. Because Gutenberg is a visual editor, you can monitor the form creation process as if you were on the frontend. All field types can be found in the JetForm Fields block in the WordPress dashboard.

PAYMENT METHODS INTEGRATION

Accept all kinds of payments securely via any of your forms, be it one-off, recurring, fixed, variable fees, or user-entered amounts. JetFormBuilder supports WooCommerce, Stripe, and PayPal integrations.

ADVANCED JETFORMBUILDER FEATURES

CONDITIONAL LOGIC

You can adjust the visibility conditions of any form field. Just use the corresponding JetFormBuilder block and decide which field will be shown and when. Besides that, there’s a chance to fine-tune the way Post Submit Actions perform on the backend. You set the conditions according to which the Actions will be executed or not.

CALCULATED CONTENT

Build dedicated Calculator and Order forms or add extra functionality to any other form type. The Calculated field type will carry out basic and complex calculations real quick.

REPEATER FIELD

Repeater creates an interface to add and remove a repeatable group of input elements. You can use a Repeater field to add a group of fields any number of times. Create Repeater groups to display custom data smoothly.

HIDDEN FIELDS

Can’t decide what to do with system fields that were not meant for users to be seen? It’s simple. Hide them. JetFormBuilder’s functionality allows you to make a form field invisible on the frontend.

More JetFormBuilder Features

  • Field Value Generator Function. Three available functions help you generate the field values dynamically.
  • JetEngine Forms migration. Duplicate all the forms you created through JetEngine to Gutenberg in one click.
  • Editable post-submit messages. Use the default message texts or input those you see fit.
  • Spam filtering & protection. Add a Google reCAPTCHA to your form easily.
  • File uploads. Decide which users you would authorize to attach files to your website forms: registered, not-registered, or all users.
  • Form submit type. Choose between the page reload and AJAX options.
  • Drag-and-drop editor. Grab the form block and place it where you want in a matter of seconds.
  • Input mask. Three mask types are available – numeric, alphabetical, and alphanumeric. Just copy and paste the needed one to make it work.
  • Numbers range generator. Dynamically generate a range of numbers to be used in Checkbox, Select & Radio Fields.
  • Inline fields editing. Edit the field labels and descriptions in-place.
  • Form validation. Check if the entered user data is correct and whether to let them proceed with the form submission or not.
  • Form patterns. Save time while creating a form layout? It’s possible! JetFormBuilder grants access to Form Patterns, which you can use to build contact, login & register, application, profile, booking, and subscription forms.

Read more about all JetFormBuilder features here

JETFORMBUILDER PRO ADDONS — GO FARTHER, GET MORE

JetFormBuilder PRO version allows you to go far beyond the ordinary forms. Its pack of mighty addons gives a second-to-none form-building experience.
Buy the PRO addons and see how easy it will be to:

  • automate marketing campaigns;
  • optimize lead generation process;
  • enjoy the autocomplete functionality;
  • integrate payment methods;
  • and much more.

Please note: Our server will be contacted for updating any Pro add-on you have installed on your website. More info you can find on the Privacy Policy page

FORM FEATURES

Build a form easily, be it simple or complex. Such specific features as autocomplete fields, form availability setup, form responses limitation, and form progress saving will improve the user experience.

  • Save Form Progress. This addon autosaves the form progress and data provided by the user whenever the filling process went wrong.
  • Address Autocomplete. Once the user starts typing in the Address field, this addon can suggest up to 5 places to auto-fill the field.
  • Limit Form Responses. This addon controls the general number of form submissions and impedes the same user from submitting repeatedly.
  • Select Field Autocomplete. Use this addon for the Select field type; it allows you to auto-fill it dynamically.
  • Schedule Forms. This functionality allows you to set up the form availability by indicating its open and close dates.
  • User Login. This addon allows you to configure the Login User post-submit action. Add it to the login form and let users log in with their credentials.
  • Advanced Color Picker. Use this addon to activate the advanced color picker feature and fine-tune the color opacity in the frontend form fields.

EMAIL MARKETING

Create contact forms for collecting user data and managing it the way you like. Garner more subscribers and add them to your mailing lists using the right email marketing tool.

  • MailerLite Action. Use this extension to manage subscriber groups and add a handy “autoresponder” that’ll cover newsletters.
  • MailPoet. This addon allows you to generate new leads, manage subscriber data, and automate email notification sending.
  • ConvertKit. Install this email marketing addon to grow your audience reach and generate more income from subscription lists.

MARKETING AUTOMATION

Want to automate email marketing campaigns? Select the most convenient integration that is sure to facilitate subscriber management.

  • Moosend. This addon creates a connection between your WordPress site and Moosend email marketing software. Thanks to it, you will be able to collect email addresses and manage subscribers to the fullest.

CRM & SALES

Integrate JetFormBuilder-created forms and the mighty CRMs. It will help you boost lead gen tremendously. Obtain the necessary visitor data and manipulate it in a database using numerous options.

  • HubSpot. Use this mailing list addon to collect leads, create new contacts, edit the existing subscribers, and send email notifications centrally. It supports authorization by API key and OAuth 2.0.

PAYMENTS

Get your site eCommerce-ready. Choose the preferred payment method, add its gateway to the form, and decide which actions will be executed before/after the payment is processed.

  • Stripe Payments. With the help of this addon, you add a Stripe payment gateway to the JetFormBuilder forms, which allows you to carry out payments.
  • WooCommerce Cart & Checkout Action. This addon allows adding one product to the cart and redirecting users to WooCommerce checkout once they submit the form.

Demo

Check out the JetFormBuilder demo page and figure out what functionality you get. Explore the demo now.

Integrations

  • JetEngine
    Use the JetEngine potential when setting up a Gutenberg form. You can add meta fields and custom taxonomies to the JetFormBuilder fields, generate the field values dynamically and put the JetEngine-built custom post types into the dynamic settings.
  • JetStyleManager
    We added the opportunity to change the way Gutenberg Form blocks will look on the frontend. You can style up every component separately. Hit the brush icon on the WordPress admin panel and do the necessary styling in the Block Style section.
  • JetBooking
    Create a user-friendly booking form with the JetFormBuilder. Extend your form with advanced features, as calculated content, smart notifications, etc. Add page breakers to make the multi-step form for your users.
  • JetAppointment
    Combine the JetAppointment features with JetFormBuilder to create a fully-fledged appointment website for any needs.

More third-party plugin integrations are in the works.

Documentation

Learn every little thing about the JetFormBuilder WordPress plugin & put theory to practice:

Imagens de tela

  • Creating a form structure
  • Adding new form fields
  • Form Break field
  • Post-submit Action setup
  • Style settings

Blocos

Este plugin disponibiliza 1 bloco.

  • JetForm

FAQ

What page builders is JetFormBuilder compatible with?

JetFormBuilder uses the WordPress native blocks editor, also known as Gutenberg, for creating forms. Apart from Gutenberg, JetFormBuilder is compatible with Elementor. You can output a form on the frontend using the JetForm widget and style its looks, as well. As to the remaining page builders (like Divi, Oxygen, etc.), the form can be displayed via a shortcode only. To style its fields, you’ll need JetStyleManager.

Is it possible to create a form that allows adding/editing posts on the frontend?

Yes. You can use the Insert/Update Post post-submit Action to add and edit posts of any type from the frontend. Besides that, you’re able to assign and modify any metadata of the given post.

Can I create a user registration form?

Absolutely. You can use the Register User post-submit Action to create a custom registration form. This post-submit action allows you to set user metadata, as well.

Can the form be integrated with Zapier, Integromat, or similar third-party services?

Sure. You can create a script that runs on a webhook in either Zapier or Integromat and then use the Call Webhook post-submit Action to launch it when the form is being submitted.

Is it possible to send emails through a JetFormBuilder form?

It is. Thanks to the Send Email post-submit Action, you can send any number of emails you want during any form submission. For instance, you’re able to send an email to a predefined address, the site administrator’s email, or the email address specified in one of the submitted form fields.

Is JetFormBuilder compatible with ACF?

Yes. JetFormBuilder is compatible with ACF, Toolset, and JetEngine itself.

Can I transfer JetEngine Forms to Gutenberg?

If desired, you can transfer all JetEngine Forms to Gutenberg using a special addon – JetFormBuilder Converter.

What field types are available in JetFormBuilder?

JetFormBuilder currently embraces 21 field blocks, but the number is to grow eventually.

  • Select Field – Creates a drop-down list, where the user can choose one option.
  • Text Field – Adds a single narrow text bar to the form and collects short text information.
  • Hidden Field – Invisible on the frontend and can store values for further calculations.
  • Radio Field – Creates a list of options where only a single variant can be picked.
  • Checkbox Field – A multi-optional field that allows choosing several variants at once.
  • Conditional Block – Stores conditions and fields on which Conditional Visibility is based.
  • Number Field – Sets either a separate bar to be filled with numbers or a range thereof.
  • DateTime Field – Merges the Date and Time Fields into one.
  • Date Field – Allows setting the date manually or choosing it from a drop-down calendar.
  • Time Field – Allows setting the time manually or choosing it from a drop-down timer.
  • Calculated Field – Takes the values from meta and form fields and uses them to calculate a formula.
  • Color Picker Field – Allows selecting custom colors in the form field on the frontend.
  • Media Field – Allows the users to upload a media file from their PC to the website.
  • Wysiwyg Field – Allows adding some styled text, HTML coding, etc., to the form.
  • Range Field – Creates a range with a slider that can be moved back and forth.
  • Heading Field – Allows you to add a heading to the whole form or its parts.
  • Textarea Field – Creates a text area where the data can be placed in several lines.
  • Submit Field – Adds a “Submit” button to the end of the form.
  • Repeater Field – Creates a repeatable block, which includes as many fields as needed.
  • Form Break Field – Adds a “Next page” button to the multi-step form.
  • Group Break Field – Adds a single line that divides one part of the form from another.

Is it possible to get JetFormBuilder PRO for Free?

It is, actually. If you’ve already purchased either an All-Inclusive or Lifetime Crocoblock package, all JetFormBuilder PRO Addons are available to you for free. For those of you who got a Custom subscription, there’s always a chance to upgrade. In this case, you’ll have to pay the difference between your current plan and that you choose.

Can I Import/Export/Duplicate forms?

Yes. It’s a push-a-button easy to import/export and duplicate your forms using the default WordPress features.

Avaliações

9 de agosto de 2021
Had a small issue with uploading images, support was able to fix it very fast. Great plugin with very good support.
5 de agosto de 2021
The plugin seems very promising to me. When I took it for a spin today and saw some of its features, I realized that I can start using it instead of Gravity Forms. Thanks to the team behind this free alternative to Gravity Forms
Leia todas as 4 avaliações

Colaboradores e desenvolvedores

“JetFormBuilder — Form Builder for Gutenberg” é um software com código aberto. As seguintes pessoas contribuíram para este plugin.

Colaboradores

Registro de alterações

1.4.1
– FIX: Compatibility with iOS.
– FIX: Execute reCaptcha token on submit form.
– Tweak: Added JS filters jet.fb.submit.reload.promises & jet.fb.submit.ajax.promises

1.4.0
– ADD: Submit Field migrated to Action Button with backward compatibility.
– ADD: Progress Bar – new block. To display steps in multistep form.
– ADD: Ability to use Form Break inside Conditional Block, in combination with Progress Bar and Action Button.
– ADD: Ability to display options for Radio and Checkbox fields through dynamic templates (only with JetEngine).
– ADD: Preset support with Options Pages (only with JetEngine).
– ADD: <!--JFB_FIELD::field_name--> macro for displaying values from fields.
– ADD: Support for localization files, see languages/readme.md for details.
– ADD: Possibility redirecting to the created post via the Redirect to Pаge action.
– ADD: Support for %field_name% macros in custom url in Redirect to Page action.
– ADD: Condition Operator for Action Conditions (AND & OR).
– ADD: The ability to compare dates based on Unix timestamps in Action Conditions.
– FIX: Ability to update member’s Mailchimp tags.
– FIX: UI/UX for Select, Radio & Checkbox fields.
– FIX: A calculated field set as hidden takes up space.
– FIX: Enqueueing styles in Elementor editor.
– UPD: Preset logic for the Repeater field.

1.3.3
– FIX: Compatibility with add-ons
– FIX: Insert post insteadof Update post

1.3.2
– ADD: Getting the child field of the repeater for the “Get values list from JetEngine field options” generator
– ADD: CSS Controls for JetForm Elementor widget for Heading Field
– ADD: Add dynamic for custom url in Redirect to Page action
– FIX: Switch page in Elementor Popup
– FIX: Parse fields with conditional logic
– FIX: Parsing media field value
– FIX: Failed process Paypal gateway
– FIX: Output Radio & Checkbox Fields label
– FIX: Enqueue Media Field & Text Field scripts
– FIX: Float attributes in edit Range Field
– FIX: Usage preset in datetime field in timestamp format
– FIX: Duplicate form errors
– FIX: Displaying a hidden calculating field only through a hidden field
– FIX: Dynamic preset when value is missing
– Tweak: UI/UX Select, Radio, Checkbox fields
– Tweak: Added a placeholder for form block/widget attributes

1.3.1
– ADD: Auto scrolling for multi-step form.
– ADD: Computed fields from actions (Register User, Insert Post) functionality
– ADD: Post Author to Insert/Update Post action
– FIX: Error when email field not required && empty
– FIX: Auto-complete label in Form Break field & improve package
– FIX: Execution of the form via GET parameters and with a dummy refer
– FIX: Elementor’s popup compatibility
– Tweak: Optimized preset && render field
– Tweak: php filter: jet-form-builder/frontend-settings.
Through it you can change the size of the indent for auto scrolling
– Tweak: php filter: jet-form-builder/file-upload/custom-html
Through it, you can add a custom html to the preview of the loaded image
through the Media Field

1.3.0
– ADD: UI/UX improvements
– ADD: Color Picker Field
– ADD: Form Patterns JetForms
– ADD: Allow creating new users by existing users (in Register User action)
– ADD: Numbers range by manual input (generator function)
– ADD: Changing the separator for a fractional number in a calculate field
– ADD: Styling a Conditional Block
– FIX: Range Field UI in editor
– FIX: reCaptcha Uncaught SyntaxError unexpected end of input

1.2.7
– FIX: Initialize input mask for new repeater items
– FIX: Preset Hidden Field
– FIX: Upload attachments
– FIX: Hidden-field preset
– FIX: Sanitize wysiwyg
– UPD: Disable edit action button, if callback undefined
– Tweak: Editor UI
– Tweak: Media Field UI settings

1.2.6
– UPD: Changed the logic for processing required fields inside the Conditional Block
– ADD: Switch page on change Radio Field
– ADD: Styles in gutenberg for Datetime Field
– FIX: Execution of a query for ActiveCampaign with global settings
– FIX: Removed escaping slashes in send email action
– FIX: Adding class to passed page
– FIX: Preset post-terms in checkbox
– FIX: Loss of focus when editing a text field in the global preset

1.2.5
– FIX: Console errors when trying to submit a form with the required checkbox || radio, inside a conditional block
– FIX: Saving max_size attribute for media-field in float
– FIX: UI compatibility with Gutenberg Editor in WP 5.8
– Tweak: added jet-form-builder/preset/source-types php filter

1.2.4
– ADD: JetEngine Glossaries compatible
– ADD: New styling sections for the JetForm widget in Elementor
– ADD: jet-form-builder/render-choice/query-options/posts & jet-form-builder/render-choice/label/posts php hooks and the same for terms, instead of ‘posts’ – ‘terms’
– FIX: Send submit status with messages from action settings
– FIX: Missing JetStyleManager wrapper on blocks
– FIX: Price formatting for PayPal gateway request
– FIX: Alignment calculated field
– FIX: UI errors in editor
– Tweak: Change Repeater component header icons

1.2.3
– ADD: Go Pro banner & link
– FIX: Redirect Action with GET args
– FIX: Get calculated value from post meta
– Tweak: Localize actions data on jet-form-builder/editor-package/before
– Tweak: Add class field-type-{id} for each field
– Tweak: Add Gateway_Manager::has_gateway
– Tweak: Add php filter jet-form-builder/field-data/calculated-field
– Tweak: Add js filter jet.fb.calculated.field.available.fields

1.2.2
– ADD: Addon management via Dashboard
– ADD: Better parse macros in the Send Email action
– ADD: Filter jet-form-builder/fields/wysiwyg-field/config for wysiwyg-field
– UPD: Parse macros in From Name & From Address fields in Send Email action
– FIX: Dynamic preset with empty result value
– FIX: CSS compatibility gutenberg-addons
– FIX: Compatibility with php 7.0
– FIX: Hiding a calculated field
– FIX: Duplicate calc formula in each repeater
– FIX: Displaying redirect action in gateways editor
– FIX: Duplicating form
– FIX: Remove mask from empty input on submit the Form

1.2.1
– FIX: Blocks initialization.

1.2.0
– ADD: Examples (preview) for Jet Form Fields in Gutenberg
– ADD: Global settings for actions, additional sidebar plugins, for example reCAPTCHA v3
– ADD: The ability to use global settings in Mailchimp, GetResponse & ActiveCampaign actions
– ADD: PHP action jet-form-builder/render/{field_type} to control the rendering of the field
– ADD: JS hook jet.fb.register.fields.controls for registering & manage block-fields controls
– ADD: JS hook jet.fb.register.plugins for registering custom sidebar-plugins
– ADD: JS hook jet.fb.register.fields for registering custom form fields
– Updated: apiVersion:2 of blocks registration in Gutenberg

1.1.7
– ADD: RTL compatibility to Wysiwyg Field
– ADD: Compatibility with JetStyleManager 1.2.0 and older versions
– ADD: Styles for Form Progress circle
– FIX: Send email without correct headers, added initial padding-bottom for progress items
– FIX: Render script jet-form-builder-inputmask only when rendering Text Field
– FIX: Plain default value in repeater fields
– FIX: Wysiwyg field is RTL compliant
– FIX: Positioning of progress item label
– FIX: Rendering last form-break field in form

1.1.6
– ADD: Label of progress for Form Break Field
– FIX: Errors when editing actions such as MailChimp, GetResponse

1.1.5
– FIX: Trying to access array offset on value of type null on php 7.4
– FIX: Rendering repeater attributes

1.1.4
– FIX: CSS Compatibility with Twenty Twenty-One theme
– FIX: Parsing form fields from content when processing a request

1.1.3
– FIX: render Form Break button if there is no name for it, entering settings for Number Field with floating-point
– FIX: render CSS classes in fields
– FIX: initializing controls for widget Form in JetEngine
– FIX: minor fixes in the editor

1.1.2
– FIX: Duplicating a plain preset in fields
– FIX: Applying macros to a message after paying with PayPal
– FIX: Retrieving form data after Paypal payment
– FIX: Styling Form-block with JetStyleManager
– FIX: Compatibility with Twenty Twenty-One theme
– FIX: Compatibility with JetEngine on initializing the conditions
– FIX: Saving character limitation in Text Field settings

1.1.1
– UPD: Better WordPress 5.7 compatibility
– Improvement: Triggering conditional logic when typing in a text and textarea fields

1.1.0
– ADD: Gutenberg blocks: Conditional Block, Datetime Field
– ADD: Elementor widgets: JetForm
– ADD: Form Progress with multiple pages
– ADD: Post submit actions Conditions
– ADD: New preset sources for post-type: Post Date, Post Date GMT
– ADD: Integration with Paypal
– ADD: Compatibility with JetEngine widget Form
– ADD: Compatibility with JetFormBuilder Converter
– Improvement: The form builder and the form block full-width in the editor

1.0.4
– ADD: displaying a shortcode for each form

1.0.3
– FIX: creating a user with administrator role.

1.0.2
– Enhancement: added jet_fb_form shortcode. Example: [jet_fb_form form_id="4338" submit_type="ajax" required_mark="***" fields_layout="row"]

1.0.1
– FiX: render wysiwyg on front-end

1.0.0
– Initial release