How to Set Up a Custom Contact Form in Drupal 8

How to Set Up a Custom Contact Form in Drupal 8

Introduction: Drupal 8 Contact Form & Secure Email Data

This Tutorial will show how to build a custom Contact Form to collect a user’s name, address, phone number, email address, & other details on a Drupal 8 website.

With Drupal 8’s core Contact Form module, administrators can set up multiple forms for different departments or sales & marketing campaigns for a business organization.

Web publishers can also install the Secure Login module for Drupal 8 which will ensure that SSL/TLS Encryption is enforced on all versions of the contact form.

Step One:
Enable the Contact Form Module

The Contact form module is part of the Drupal 8 core distribution so administrators only need to navigate to: /admin/modules and enable the module to begin using it for email.

How to Set Up a Custom Contact Form in Drupal 8

For this Tutorial, there is the additional requirement of the Secure Login module which will be used to force secure connections with SSL/TLS Certificates on contact forms.

Required Modules:

Navigate to: /admin/modules/install and upload the module files. Enable the module and save the settings. Continue to the next step to build the site-wide Contact Form.

How to Set Up a Custom Contact Form in Drupal 8

Drupal 8 publishers using the Contact Form for site-wide email need also consider installing the Captcha, ReCaptcha, & HoneyPot modules for anti-spam protection.

Step Two:
Add a New Contact Form for Website Emails

To begin building a site-wide Contact Form for emails on Drupal 8, navigate to: /admin/structure/contact & click on the link: “Add Contact Form”.

How to Set Up a Custom Contact Form in Drupal 8

On the subsequent screen, create a new label for the Contact Form, i.e. ‘website feedback’ or ‘product information’. Then specify the recipients of the form:

How to Set Up a Custom Contact Form in Drupal 8

For recipients, use standard email values like ‘webmaster@example.com’. For multiple copies,use comma-separated values, i.e. ‘sales@example.com,support@example.com’.

Next specify any particular message to display to the user after submission of the form. Leave the section blank for no message. Then set a Redirect Path after submission.

There are also Contact Form options for Auto-reply, Weight, & use as the Default Form for site-wide email contacts. This includes use of the /contact URL for the form.

Step Three:
Add Fields for Address, Phone, & Business URL

After the Contact Form has been created, right click on the “Edit” menu & select “Manage Fields” from the list of options.

  • Navigate to: /admin/structure/contact/manage/feedback/fields

In this section, additional fields can be added to the form to collect information for the customer’s address, phone number, email address, & business URL.

In order to add these fields to the Contact Form, click on the “Add Field” button.

How to Set Up a Custom Contact Form in Drupal 8

Select the “Address” field (if installed) or use Text, Date, Integer, Paragraph Field, etc. options as required for the customer information collection on the form.

Add a label, then save & continue the configuration. Set the number of allowed values.

How to Set Up a Custom Contact Form in Drupal 8

After setting the help text, required values, & other variables for each field, the Contact Form will have the ability to collect addresses, phone numbers, links, uploads, etc.

Step Four:
Manage Custom Contact Form Display

To manage the Field display on a Contact Form, right-click on the “Edit” menu for the form and choose “Manage Form Display”. The module provides two tabs with options.

How to Set Up a Custom Contact Form in Drupal 8

Use the drag-and-drop levers on the Fields to arrange the display order on the Contact Form. Position the Address, Phone Number, Email, & Business URL above the Message text box. The Sender Name & Sender Email fields are defaults.

How to Set Up a Custom Contact Form in Drupal 8

Select the “Manage Display” tab & a choice of options are available to build a theme template for the Contact Form, for example using Twitter Bootstrap or Panels.

Step Five:
Force SSL/TLS Connections on Contact Forms

After the custom fields & display are established on the Contact Form, remember to configure the Secure Login module to protect the form using encryption on submit.

How to Set Up a Custom Contact Form in Drupal 8

Navigate to: /admin/config/people/securelogin & make sure that the “Contact Form” is checked as an option under Forms to protect. Set a secure base URL as optional.

Secure Login will force SSL/TLS Encryption using HTTPS for all of the Contact Form submissions, insuring that the address, phone, email, etc. is not plain text in transit.

Conclusion: Simple & Easy Drupal 8 Contact Forms

Drupal 8 permits the creation of multiple Contact Forms for different departments, website sections, special promotions, or individual use by custom labels & URLs.

The Contact Module is part of Drupal 8 core and is a standard aspect of all CMS websites. Expand functionality with CCK Field modules & build complex forms.

Drupal 8 developers can use Twitter Bootstrap & Panels templates to add custom blocks with images, code, video, links, etc. to Contact Form pages in theme display.

Check out these top 3 Drupal hosting services:

Kamatera
NZ$6.76 /mo
Starting price
Visit Kamatera
Rating based on expert review
  • User Friendly
    3.5
  • Support
    3.0
  • Features
    3.9
  • Reliability
    4.0
  • Pricing
    4.3
Hostinger
NZ$5.05 /mo
Starting price
Visit Hostinger
Rating based on expert review
  • User Friendly
    4.7
  • Support
    4.7
  • Features
    4.8
  • Reliability
    4.8
  • Pricing
    4.7
FastComet
NZ$3.03 /mo
Starting price
Visit FastComet
Rating based on expert review
  • User Friendly
    4.7
  • Support
    5.0
  • Features
    4.8
  • Reliability
    4.5
  • Pricing
    5.0

Your query to the best web hosting can end by clicking on this link.

How to Use Let’s Encrypt SSL Certificates with Drupal 8

This Tutorial will show Drupal 8 website owners how to install Let’s Encrypt S
3 min read
Jeffrey Scott
Jeffrey Scott
Hosting Expert

How to Create a Custom Content Type for Drupal 8 with Fields

This Tutorial will show how to create a database application for Drupal using cu
4 min read
Eliran Ouzan
Eliran Ouzan
Web Designer & Hosting Expert

How to Install & Configure Ubecart with Drupal

This Tutorial will show how to install & configure UberCart to run a complete ec
3 min read
Idan Cohen
Idan Cohen
Marketing Expert

How to Create a Drupal Commerce Site with Drupal 8

This Tutorial will go through three main methods for creating ecommerce websites
4 min read
Idan Cohen
Idan Cohen
Marketing Expert
HostAdvice.com provides professional web hosting reviews fully independent of any other entity. Our reviews are unbiased, honest, and apply the same evaluation standards to all those reviewed. While monetary compensation is received from a few of the companies listed on this site, compensation of services and products have no influence on the direction or conclusions of our reviews. Nor does the compensation influence our rankings for certain host companies. This compensation covers account purchasing costs, testing costs and royalties paid to reviewers.
Click to go to the top of the page
Go To Top