Dmitry

The plugin allows you to add a feedback form or booking form to the page. The data is sent to the server via AJAX (this can be disabled using the settings and the form will be submitted as usual, with a page reload… but why do you need it?). You can flexibly personalize the form and its fields.
The form is added to a page using the Gutenberg Custom Blocks – with these blocks, the possibilities for customizing your form are greatly increased.
You can also add a form to a page using the shortcode <code>[zu-contact]</code> or <code>[zu-booking]</code>.
<h3>Features</h3>
<ul>
<li>Lightweight <code>JS script</code> & <code>CSS</code> (only 4 KB minified and gzipped)</li>
<li>Includes form blocks for the new Gutenberg WordPress block editor</li>
<li>Also supports adding a contact form to any post or page using a shortcode</li>
<li>Form submission via AJAX (configurable by settings)</li>
<li>Data validation on the server</li>
<li>Support for required fields</li>
<li>Responsive layout</li>
<li>Notification of submissions to default admin or custom email addresses</li>
<li>Send a <code>carbon copy</code> of the submitted message (configurable by settings)</li>
<li>Basic <code>SMTP</code> (Simple Mail Transfer Protocol) configuration</li>
<li>Protect submissions from spam with Google <code>reCAPTCHA</code> (configurable by settings)</li>
<li>Automatically checks all submissions against global database of spam (with <a href="https://wordpress.org/plugins/akismet/" rel="ugc">Akismet</a>)</li>
<li>Save messages to the database as comments to a post or page</li>
<li>Compatible with the latest version of WordPress</li>
</ul>
<h3>Gutenberg blocks</h3>
With custom blocks for Gutenberg WordPress editor you can easily create new contact forms and customize them with great flexibility:
<ul>
<li>You can create a form based on templates or from scratch</li>
<li>Add and remove form fields</li>
<li>Change the position of fields, their type and other attributes</li>
<li>Change field labels, placeholders and validation error messages</li>
<li>Add to verification form using Google <code>reCAPTCHA</code></li>
<li>Change the animation of the form loader (used during form submission)</li>
</ul>
<h3>Shortcode attributes</h3>
You can also personalize the form by adding attributes to the shortcode:
<ul>
<li>class – Change CSS class of form: <code>class="my-contact-form"</code></li>
<li>form – Select one of preloaded forms: <code>form="contact"</code></li>
<li>subheading – Change form subheading: <code>subheading="My Contact Form"</code></li>
<li>ajax – Disable form submission via AJAX: <code>ajax=false</code></li>
<li>recaptcha – Disable Google reCAPTCHA widget: <code>recaptcha=false</code></li>
<li>rows – Change rows amount in textarea: <code>rows=12</code></li>
<li>message – Set predefined form message: <code>message="Thanks for your hard work!"</code></li>
</ul>
<h4>Examples</h4>
<ul>
<li>
With custom subheading and without reCAPTCHA:
[zu-contact subheading=”My Contact Form” recaptcha=false]
</li>
<li>
With custom class, without AJAX and with 8 rows in textarea:
[zu-contact class=”my-contact-form” ajax=false rows=8]
</li>
</ul>

Zu Contact

Simple but smart and modern Ajax contact form. With Form Blocks and Gutenberg based settings page.

Zu Contact vs Form Maker by 10Web – Mobile-Friendly Drag & Drop Contact Form Builder