I trust that you found this blog post to be enjoyable. If you are interested in having my team handle your eCommerce setup and marketing for you, Contact Us Click here.

How to Create multi step form using Webform module With email handling in Drupal

How to Create multi step form using Webform module With email handling in Drupal

With Webforms, it is possible to create forms that span more than one page. These forms are known as multistep, or multipage forms. To create a multistep form, create the form elements you want to appear on your form. Then, add one or more elements of the pagebreak type.

Step 1: Install and Enable Webform Module

  • Install tha webform module from drupal.org using composer
    ptiwebtech_website
  • Enable Webform Module from Extend in your drupal project

Note: The Webform module is a powerful and flexible Open Source form builder
and submission manager for Drupal. The Webform module for Drupal provides all
the features expected from an enterprise proprietary form builder combined with the flexibility and openness of Drupal.


ptiwebtech_website
  • Select check box according to your requirement and enable the module.

Step 2: create multi step form

  • Open your webform in Structure --> Webform in your admin panel
    ptiwebtech_website
  • Afte click the webform, click on add webform button first give your form title afte write tite and click on save button
  • Add element field according to your requirement
    ptiwebtech_website
  • For next page click on Add page button and add the element for next page.
    Like this you can add multipal pages in webform
  • After create multipal page and fields you click on save element button.
  • For view this form click on view
    ptiwebtech_website
  • After create form click on the "Emails/Handlers" tab. In settings
    ptiwebtech_website
  • Click on the "Add handler" button to add a new email handler.
  • Choose "Email" as the handler type from the dropdown list. After click Add email button
  • Enter the recipient email address(es) where you want to receive form submissions.
  • Configure other email settings such as the email subject, sender name, sender email address, etc.
  • Save the email handler configuration.
  • Save and Publish the Form

Step 4: Embed the Form:

  • You can embed the form using a block in Structure --> Block layout and place the block of webform

ptiwebtech_website

Step 5: Test the Form

  • Visit the page where you embedded the form and test it by submitting some sample data. Ensure that the form submission is received at the specified email address
Back to blog