Categories

(70)
(47)
(8)
(27)
(69)
(104)

Updated and stable Webform module in Drupal 8 for form creation

13.02.2019
Updated and stable Webform module in Drupal 8 for form creation
Author:

Various forms are the heart of website’s interaction with the user. They are vital for usability, conversions, marketing analytics, and more. So form building tools are in demand — the Drupal Webform module ranks 7th on the 42,000+ list of contributed modules. The Webform module has recently received its stable version for Drupal 8. We will give it an overview and show an example of creating a simple form with the Webform module.

Webform module in Drupal 8: finally stable

The Webform module lets us create any kind of forms from simple to complicated multi-page ones. It also adds settings and features to them like statistics collection, email notifications, confirmations, data export in various formats, fine-tuned access, conditional logic, filtering and sorting, pushing results to CRM, downloading results as CSV, and more.

The stable version for Drupal 8 finally arrived on December 25, 2018. Drupal creator Dries Buytaert congratulated the Webform module creator Jacob Rockowitz via Twitter and called the release a big milestone.

The release was soon followed by Webform 8.x-5.1 on January 1 and Webform 8.x-5.2-beta1 on January 25.

Defining forms in a YAML file or admin interface

One of the most remarkable new features of Webform module in Drupal 8 is the ability to define a form in a YAML file. Webform module creator Jacob Rockowitz also built the YAML Form module specifically for Drupal 8. As of Webform 8.x-5.x, the YAML Form merged into Webform. So developers now can go to the YAML file by clicking the “Source” tab.

But there is also a user interface for form creation that is intuitively understandable even for website administrators. The admin dashboard contains examples and videos, as well as a built-in contact form.

The Webform ecosystem of modules in Drupal 8

The Webform module for Drupal 8 is a complex module with 20 submodules that demonstrate its varied capabilities. The minimum ones to enable are Webform and Webform UI modules.

There is a also number of contributed modules that work together with Webform and extend the its capabilities still further: Webform Views, Webform REST, Webform Analysis, Webform Encrypt, Webform Composite Tools, Webform Invitation, CAPTCHA, Honeypot, MailSystem, SMTP, and more.

Creating a simple webform with the Webform 8.x-5.1 module

We will create a feedback form for customers from scratch. With the Webform and Webform UI modules enabled, we go to Structure — Webforms, click “Add webform," name “Let us know your thoughts," and save it.

The form then needs to be completed with fields that are called “elements” in Webform. The “Add element” button leads us to the list of 60+ available fields, both simple and complex.

We will need a field for the customer’s name. For this purpose, there is a complex “name” element with sub-elements (First name, Last name etc.) that can be checked or unchecked to be included in the form or not.

If no complex name structure is needed, we can use a simple “Text field” element for the name. Let’s call it “Your name (optional)” in the “Title.”

For the email field, we select an “Email” element and add a placeholder for email addresses

An element of “Checkboxes” type will let customers check some options. For our feedback form, we list the company’s services as “option values”.

To let customers give their votes, we will us an element of the “Rating” type and set the value range from 1 to 10.

A “Text area” element will host customers’ comments.

On the list of all fields for our form, we can drag and drop the fields to change their order, or check them to quickly make them required/optional.

Let’s choose where the submitted forms will go. On the form’s dashboard, we select Settings — Emails/Handlers and click “Add email.” There, we configure the “sent to” email address (in our case, it’s the default [site:mail] is OK). We also add a custom subject “You received a new form submission.”

The “View” tab takes us to our form on the website. If we submit something and check the admin email, we see new messages about form submissions.

Let’s create the forms your Drupal website needs

This was just a very simple form example where we have not even touched advanced options — conditional logic, access, submission handling, JS effects, and so on. The Webform module in Drupal 8 has unlimited capabilities, and our Drupal team can create you the forms that will work in accordance with all your requirements.

2 votes, Rating: 5

Read also

1

Everyone loves attractive layouts for web pages. Luckily, Drupal has plenty of awesome page building tools. Our...

2

What is the first thing that grabs your attention when you visit an E-commerce website? No doubt it is the website’s design and appearance. Which E-commerce themes are the best? Don’t worry...

3

Drupal 8 is on its peak of flourishing, but the cycles of development never stop. That’s why the Drupal community has already announced the expected release of Drupal 9 and end-of-life for Drupal...

4

Our web development team prefers Drupal 8 content management system (CMS) for multilingual websites. Now find...

5

Hopefully, content editors and website owners are ready to gasp in admiration — because we know they will when they discover Gutenberg editor in Drupal 8. The eighth version of Drupal already...

Subscribe to our blog updates