Forms are essential elements for any website. From login and registration pages to contact pages, websites need a way for users to submit their information, and forms are the best way to do it.
As you know, WordPress does not include a default block for you to create forms that integrate with the look and feel of your website. You need a plugin to add forms.
You will find form plugins that provide you with the necessary functionalities, such as:
- Define or configure any form you want a visitor to your website to see
- Specify where you want that form to appear: page, post, widget, or popup
- Specify confirmation or error messages that should appear to the user after filling out the form
- Specify where you want the information of the correctly filled form.
In addition, some plugins also include predefined form templates to make form creation easier. This is the case of Nelio Forms, a plugin developed by us that is fully integrated with the WordPress block editor and that now comes with form patterns, which are pretty similar to WordPress block patterns.
Let’s see how it works and the advantages of creating forms using patterns.
Create Forms with Nelio Forms
To create a contact form with the Nelio Forms plugin, just click on the New Form menu option and the form editor opens, which is practically identical to the block editor you already know.
You only have to add the blocks of the fields contained in the form and specify their properties for each field.
Additionally, you can specify where and how you want the completed form to be sent.
Once any form has been created and published, you just have to integrate it into any page or post by adding a form-type block and selecting the created form.
Also, as I mentioned before, Nelio Forms has a set of predefined form patterns, available in the sidebar, that further simplify the work of creating new forms.
Just by clicking on the pattern of the form you want, you’ll get the form you want:
Form patterns work just like any block pattern: once added, you can delete, add, or modify its blocks in the editor. The great advantage of using Nelio Forms is that all the fields and buttons shown in the form will inherit your theme’s style, providing a perfect integration with your site. If you change the style or theme, all the properties of the form (except those that you have modified directly by editing the form), will automatically adapt to the new style.
For example, just by changing the text and background color of the buttons in my theme:
The new forms that you are going to create or those that you have already created will have been adapted to the new changes.
This allows you to make your form styles work exactly the same as those of your pages and posts offering a much cleaner and more consistent look throughout your website.
In the same way, if I change the web theme, also the form editor and the patterns you have available will be displayed with the style of the theme you have installed.
And all the forms that you had previously created following the style of the theme will be adapted to the new theme installed.
This way, you have the freedom to make the theme and style changes you need on your website without having to worry about how the forms will be displayed after the change.
Below is the list of form patterns available to you to quickly create forms for your website.
Currently, Nelio Forms includes 10 form patterns that can help you as a starting point to create any form. From the simplest so that your visitors can contact you, to others that include columns, dropdowns, and other types of selectors.
All of them with very simple designs so you can adapt and customize them as you wish.
Creating forms with the Nelio Forms plugin is as easy as creating any WordPress page. Now, form patterns make creating new forms even simpler.
Once you have selected a pattern, the blocks of the pattern will be copied and you can add, modify, and delete all the fields as you want to make the form fits your needs. With the peace of mind that with any change you make to your website, the form will adapt to your new style. What are you waiting for to check it out?
Featured image by Christina @ wocintechchat.com on Unsplash