The ability to create a form quickly and easily is a vital piece of functionality in any content management system. A content editor needs the capacity to create a form and add or remove fields.
The days of asking a developer to create a custom form are long gone. An editor should be able to spin up a form for whatever they need.
Luckily Drupal 8 has two good options for building forms: Contact and Webform.
Contact
The Contact module in Drupal 7 and below has always been the go-to module for basic forms as long as you’re happy with the hard-coded fields. If you need an extra field, you would have to write custom code to add it.
Now in Drupal 8, you’re no longer stuck with a single form. Instead, you can create different fieldable contact form types. You can create different contact forms and attach fields to them, the same way as you do on content types.
The Contact module won’t keep any form submissions in Drupal. It’ll send them to a designated email address. To store submissions use Contact Storage module.
Webform
Webform is the original form builder for Drupal. If content editors needed the ability to create forms then this is the module they would use. The module is suited for basic contact forms as well as long multi-page forms.
The 8.x-5.x version of Webform started out as YAML Form and it was decided to make YAML Form the Drupal 8 version of Webform.
Webinar on Contact and Webform
I recently recorded a webinar on Contact and Webform, where I cover both modules and show you how to create a form in each one.
Watch the webinar above or directly on YouTube.
Or jump to a specific section using the links below.
Contact Module
- What’s new in Contact module (02:03)
- Manage contact form types (04:34)
- Create Contact form type (05:05)
- Default fields on Contact form (06:37)
- Add field to contact form (07:44)
- View submission (09:01)
- Configure “Manage display” (09:57)
Webform Module
- What’s new in Webform module (12:25)
- Install Webform (14:11)
- Overview of Webform admin page (16:31)
- Create form using Webform (18:33)
- Adding elements to forms (18:56)
- Add pages to forms (21:17)
- Conditionally display fields (22:20)
- Form settings (28:58)
- Add email notification to form (31:15)
Webform Integration with Google Sheet
- Introduction to Zapier (36:30)
- Create zap in Zapier (38:40)
- Configure Webform to send post to webhook (39:36)
- Test integration with Google Sheets (43:27)
Questions
Mentioned Resources
- Webform (module)
- Contact storage (module)
- Webform Views (module)
- Recaptcha (module)
- Honeypot (module)
- Zapier (Saas product)
