Create a Drupal webform
- Hayley Stockall (Unlicensed)
- Marcella Marino
Learn how to create and build a webform in the content.vic.gov.au CMS as well as add it to a webpage.
Note: there are some limitations with our Drupal webforms settings – not every field and option that you can see in the CMS back-end is currently set up. Read our advanced guide to building Drupal webforms to find out more.
On this page:
Privacy requirements
Make sure you've considered the privacy requirements you must follow for webforms, such as including a collection notice if you’re collecting personal information and creating a Privacy Impact Assessment (PIA).
Create a new form
Go to the main top ribbon in the CMS and select Structure and then Webforms.
Select the +Add webform button.
Create a title for your form – this will only display in the CMS back-end.
Fill in the administrative description with the below information (this will only display in the CMS back-end):
Form contact:
Department or agency:
Embedded on page: [Add the URL of the webpage]
Submissions to: [The email address that submissions will be sent to, if setting up email notifications.]
Data export plan: Data is exported [choose either weekly, fortnightly or monthly] by [person responsible] and then deleted from the CMS.
Tested by:
Description: [Purpose of your form]
Select Save.
You can duplicate an existing form if you have a template or a similar form that you would like to use as your starting base.
Search for the form you’d like to copy and choose the Duplicate option from the dropdown menu under the Build button.
Build your form
Go to the Build tab.
Add your form fields by selecting +Add elements and choosing from the range of form elements. For more information on each of the form elements, hover your mouse over the question mark next to each one.
For each form field/element:
The General tab allows you to add in a title, description text, any options for elements such as radio buttons, set the field to be “required” (make it mandatory to be filled in by the user) and add character or word count limits.
The Conditions tab allows you to add basic conditional logic to your form, such as making the field visible or hidden depending on the answer given in an earlier field.
For more detailed information about the form elements and their customisable settings, please read our advanced guide to building Drupal webforms.
Options for the submit button
It's possible to make the Submit button visible or hidden based on conditional logic, if you have specific answers to questions that make the form user ineligible to submit their form. You can set this up in the same way that you add conditional logic to all other form elements.
To remove the submit button (e.g. for decision tree forms that don’t need to collect submissions), when building your form in the CMS click on the dropdown arrow next to the “Edit” button for the Submit button element and choose “Delete”. Although it will still be visible in the CMS (the “Edit” button will have changed to say “Customize” though), it won’t appear on the live version on your webpage.
If you click the “Customize” button at any point, you will need to repeat the above steps to remove it again.
Customise your form settings
Successful submission message
Go to the Settings tab (next to the Build tab) and click on the Confirmation tab below.
In the first Confirmation type section, change this setting to “Inline” – this will make the form disappear from the page once the user has submitted it, and replace it with a successful submission message.
We recommend choosing this setting as it will prevent users from submitting multiple duplicate copies of the form accidentally, and makes the successful submission message more obvious.
The default setting of “Page” will keep the form visible and filled in on the same page after the user clicks Submit, but will also display the confirmation message at the top of the form. This can be easy for the user to miss if your form is long.
No other options in this section are currently configured.
To customise the confirmation message that displays, go the field below labelled Confirmation settings.
If left blank, the default confirmation message is “Thank you! Your response has been submitted.”
Webform tokens (e.g. displaying the submission ID number) aren’t currently configured to work on the front-end display.
The field “Confirmation page/modal title” is not currently supported, so just fill in the “Confirmation message” field only.
Email notifications – internal and customer emails
You can set up options to email the form submissions to specific email addresses. This can be found under the Settings tab > Emails / Handlers tab.
Leave the Title field as is.
Change the To email option to either:
“Custom To email address” – for an internal VPS email address where you’d like to collect the submissions
An email address field that is in the form – to send confirmation messages to the user who filled in the form.
You can choose whether any other email addresses are CCed or BCCed in the emails as well.
Do not change the From email address – this must remain as the default [site: mail] option otherwise the emails won't send. The email address that will appear as the sender is “noreply@dpc.vic.gov.au”.
You can add a custom “From name” to display as the sender of the email though.
You can also set up a custom Reply-to email.
View and test your form
There are some discrepancies between how the form displays in the View or Test tab of the CMS and how it displays when embedded on a webpage.
The best option for checking and testing your form is to embed it on a CMS page, save as a draft and use the preview link to see it on the front-end. This allows you to see and interact with the form without it being visible to the general public.
Once you have finished testing your form, delete all the test submissions from the CMS.
Embed your form on a webpage
In the edit screen of your page, click the Add Component button and select 'Form embed (Drupal)'.
In the title field you can either add a heading for this form (it will display as a Heading 2 size) or you can leave this field blank.
In the webform dropdown, scroll to find the name of the form you want to embed. The names displayed on this list are internal names and won't show on the page.
Example form
To see how the various form elements display and work for website users, check out our sample form.