We're counting down the days to the official Sooperthemes Drupal 8 Release! Count with us as we will be writing a Drupal 8 related blog post every day for the next 8 days.

Drupal 8 web forms and drag and drop forms video tutorial

view on sooperthemes.com if you can't see the video

This tutorial is aimed at people who just need a contact form or some other kind of user input form. We'll cover deciding between the core contact module and the popular webform module. We won't cover using the Drupal API to program complex forms that integrate with external applications.

Drupal 8 Core Contact Module

Whereas the Drupal 7 core contact module was not very useful due to a total lack of flexibility, the Drupal 8 version is much nicer. It's nicer because you can add fields to it. You're no longer limited to just the name, email, subject and message fields that were baked into the Drupal 7 version. 

Not only does the new contact form allow for custom text fields, it even supports file uploads, entity references, date fields, and other Field API fields.This simple yet powerful form builder module is not limited to just contact forms; you can use it to create questionnaires, gather user feedback, etc.  

Drupal 8 Contact Module

Drupal 8 Contact module customized form

Better Together: Contact Module + Contact Storage Module

One major inconvenience of the Contact module is that is doesn't store any messages that are sent. Your only option is to send the message via email and afterwards there is no copy of the message in your Drupal site. The contact storage module will store your messages as entities. It lets you administer the messages and provides integration with the views module. Since the messages are stored as Drupal entities you also gain interoperability with other modules in the Drupal ecosystem. This will allow you to do even more, for example exporting messages as CSV, searching messages, and pushing messages to your CRM.

Webform Module

Drupal's popular webform module is a massive framework that offers a ton of extra options that the contact module doesn't have. You should choose the webform module if these extra features are useful to you and you're prepared to learn the ropes around a more complex user interface. The webform module can be intimidating at first because there are so many elements and settings... but once you're familiar with the interface you can configure and design very powerful forms fairly easily. 

To see what the webform module offers it's really better for me to show than tell. Check out the youtube video above where I show you the interface of the webform module.

Drupal 8 Webform Module

Drupal 8 Webform module form using the flexbox layout option

Contact Module vs Webform Module

Personally I choose the webform module for anything that is more complicated than just the standard contact form with a subject and message field. The contact module is powerful and extendable, but the webform module gives you everything you need in one place. It's a purpose-built single-purpose application within Drupal and once you get familiar with it it's really very powerful. 

It also lets met build multi-column form layouts, a feature that I use often.

A feature-base comparison of Contact and Module based on features that I think are important:

Feature

  • Multi-column layouts
  • Control labels and placeholders
  • Control Submit Button Text
  • Route email with form options
  • Search in submissions
  • Export submissions

Contact

  • ✔ (can't remove Preview)
  • ✔ (needs additional modules)
  • ✔ (needs additional modules)

Webform

Placing Drupal 8 Forms With Our Visual Page Builder

We believe interoperability with the Drupal ecosystem is important for Glazed Builder. This is why we don't include a proprietary form builder in Glazed Builder and instead encourage you to create forms with Drupal's webform module. Currently Glazed Builder let's you place blocks created with the webform module anywhere in your drag and drop page. The contact module doesn't provide blocks that we can drag and drop natively, but you can install the contact_block module to fix that.

Drupal

8.x
0 Comments
Apr 18, 2018 By Jurriaan