Creating/Editing Webforms

Webforms like this one can be used to collect information from website visitors. The results will be stored in the database, and can optionally be emailed to you or exported to Excel.

Before you can create a Webform, you will need to be given the "Form Editor" role - please contact IT support to request that.

Terminology

There are two (confusingly similar) terms that you need to know about:

  • Webform: This is the actual form that contains the questions and stores the results.
  • Webform Page: This is the page on the website that contains the Webform, as well as any introductory text. It can be added to the menu like a regular page.

The reason they are separate is, in theory, you can have multiple pages containing the same form. In practice, we usually have one page for each form.

This page will walk you through the process of creating both a Webform and a Webform Page.

1. Create a Webform

The options for creating a new Webform are:

1a. Duplicate an Existing Webform

If there is an existing form (that you have permission to edit) that you want to copy:

  1. Go to the Webforms list
  2. Next to the relevant Webform, click the dropdown arrow
  3. Click "Duplicate"
  4. Enter the new title
  5. Click "Save"

1b. Create a Webform From a Template

If not, we recommend using our "Basic form" template, which has the standard functionality (e.g. email notifications) set up for you.

  1. Go to the Webform templates page
  2. Next to "Basic form", click the "Select" button
  3. Enter the form title
  4. Click "Save"

2. Build the Webform

Click the "Build" tab to see and edit the list of fields on the Webform.

(To get back to the Build tab at a later date, go to the Webform Page and click "Webform".)

Adding New Fields

To add a new field:

  1. Click the "Add element" button
  2. Select the element type (see below)
  3. Fill in the field title
  4. Fill in the other field settings as required
  5. Click the "Save" button

Alternatively, click the dropdown next to an existing field and click "Duplicate".

There are lots of field (element) types to choose from. The most commonly used are:

  • Text field - The user can enter a single line of text, such as their name
  • Email - The user can enter a single line of text, which must be a valid email address
  • Textarea - The user can enter multiple lines of text, such as their address
  • Checkboxes - The user can select any number of options from a list of checkboxes
  • Radios - The user can select a single option from a list of radio buttons (good for shorter lists)
  • Select - The user can select a single option from a dropdown list (good for longer lists)
  • Likert - The user answers several questions using the same scale - e.g. a rating from 1 to 5

If you are planning to do something more advanced (file uploads, complex layouts, multiple pages, conditional logic, etc.), please check with IT support first.

Editing Fields

Warning: If users have already submitted results, be aware that some changes will affect existing results. For example, if you change the field title, the existing submissions will now have the new question paired with the old answer.

To edit an existing field, simply click the "Edit" button next to the field, make your changes, then click "Save".

You cannot change the "key" (machine identifier) for an existing field. If you have just created the field and realise you made a typo, the quickest fix is to duplicate the field, correct the spelling, then delete the original. Alternatively, you can live with the mistake - the key is not displayed to end users anyway.

Reordering Fields

To change the order of fields, drag & drop the arrow icons using the mouse. When they are in the correct order, click the "Save elements" button at the bottom.

Deleting Fields

Warning: If users have already submitted results, be aware that deleting a field will delete the existing results for that field. If you need to keep the existing results, you may need to export the data first, or start a new form instead (perhaps duplicate this one).

To delete a field, click the dropdown arrow next to the field, click "Delete", then click the "Delete" button to confirm.

3. Configure the Webform Settings

There are various settings you can configure. Only the most commonly used ones are described here. Please contact IT support if you need assistance with anything else.

Confirmation Message

To change the message that is displayed after the form is submitted:

  1. If you are on the Webform Page, click "Webform"
  2. Click the "Settings" tab
  3. Click the "Confirmation" sub-tab
  4. Under "Confirmation message", enter the message to be displayed
  5. Scroll down and click "Save"

Email Notifications

You can set up email notifications to (a) yourself or your team, and (b) the person who submitted the form.

Before doing this, carefully consider data protection and security. Email is inherently insecure, so shouldn't be used for sensitive or confidential information. In particular, the user could make a typo in their email address, causing a copy of their information to be sent to someone else. Please contact IT support if you need guidance.

The following instructions assume you started from the "Basic form" template.

To configure email notifications to the form owner (you or your team):

  1. If you are on the Webform Page, click "Webform"
  2. Click the "Settings" tab
  3. Click the "Emails / Handlers" sub-tab
  4. The default recipient is the form owner (you) - if you need to change that:
    1. Click "Email notification to form owner"
    2. Change "To email" to "Custom To email address..."
    3. Enter the email address in the text field that appears below it
    4. (You can also change other fields, such as the Subject and Body text if you want to)
    5. Scroll down and click "Save"
  5. Click the dropdown icon to the right of "Email notification to form owner"
  6. Click "Enable"

To configure email notifications to the submitter:

  1. If you are on the Webform Page, click "Webform"
  2. Click the "Settings" tab
  3. Click the "Emails / Handlers" sub-tab
  4. Click "Email notification to submitter"
  5. Change "From email" to "Custom From email address..."
  6. Enter the appropriate email address in the field that appears (preferably a role-based address rather than an individual) - this ensures any replies come to you
  7. Change "From name" to "Custom From name..."
  8. Enter the appropriate name (matching the email address) in the field that appears
  9. Optionally, change "Subject" from "Confirmation for [webform_submission:source-title]" to a more appropriate subject
  10. Optionally, change "Body" to include more user-friendly text (you can remove [webform_submission:created] and [webform_submission:values] if you don't want to include the date/time and submission data, respectively)
  11. Click "Save"
  12. Click the dropdown icon to the right of "Email notification to submitter"
  13. Click "Enable"

Remember to fill in the form yourself to test the email notifications before sending it out.

Opening/Closing the Webform

Closing the Webform can be useful when you are not yet ready to accept submissions, or you don't want to accept any more submissions.

  1. If you are on the Webform Page, click "Webform"
  2. Click the "Settings" tab
  3. Click the "Form" sub-tab
  4. Change "Form status" to "Open" or "Closed" (note that "Scheduled" may not work for non-logged in users, as the warning message explains)
  5. Optionally, fill in "Form closed message" with a message to display when the form is closed
  6. Scroll down and click "Save"

Limiting the Number of Submissions

This can be useful when you people are signing up to something with limited capacity, such as an event.

  1. If you are on the Webform Page, click "Webform"
  2. Click the "Settings" tab
  3. Click the "Submissions" sub-tab
  4. Under "Submission limit settings", click "Total submissions"
  5. Enter the limit in "Total submissions limit"
  6. Make sure "Total submissions limit interval" is set to "ever"
  7. Under "Total submissions limit message", enter a message to display when the limit is reached
  8. Click "Save"

If you want to test this, to see what the message looks like, make at least one test submission and then set the limit to 1.

Note: If you do make some test submissions (which you should!), remember to delete them from the "Results" tab, else they will count towards the limit.

Access Control

Warning: Access control on Webforms is more complicated - and more dangerous - than on basic pages. Incorrect configuration could lead to a data breach! In particular, all of the "Permissions" fields should be left blank. If you are unsure what to do, please contact IT support for assistance.

To restrict webform submission to logged in users:

  1. If you are on the Webform Page, click "Webform"
  2. Click the "Settings" tab
  3. Under "Create submissions" > "Roles", untick "Anonymous user"
  4. Click "Save"

You may also want to remove the "View" permission for the Webform Page, so anonymous users see "Access Denied" rather than a blank page:

  1. Go to the Webform Page
  2. Click the "Edit" tab
  3. Click "Access control"
  4. Under "View access" > "Groups", remove "Anonymous user"
  5. Click "Save"

To allow other users within the department to view/download submissions but not edit the webform:

  1. If you are on the Webform Page, click "Webform"
  2. Click the "Settings" tab
  3. Under "View any submissions" > "Users", enter the users that should have access (separating multiple users by a comma)
  4. Click "Save"

Or to allow other users within the department to edit the webform and view/download submissions:

  1. If you are on the Webform Page, click "Webform"
  2. Click the "Settings" tab
  3. Under "Administer webform & submissions" > "Users", enter the users that should have access (separating multiple users by a comma)
  4. Click "Save"

4. Create the Webform Page

While it is possible to link directly to the Webform ("View" tab), we generally recommend creating a Webform Page. The benefits are:

  • You can add introductory text at the top of the page
  • The form can be added to the menu, like other pages
  • Breadcrumbs are displayed at the top of the form, so users can find their way back more easily

Now we have finished creating the Webform, we need to create the associated Webform Page:

  1. Go to Add webform page (or navigate to Manage > Content > Add content > Webform page)
  2. Enter the page Title
  3. Start typing the Webform title into the "Webform" field, then select it from the list
  4. Enter the introductory text into "Body"
  5. Click "Menu settings" and add the page to the menu (as with normal pages)
  6. Click "Save"

Now you can share the link to this page with the people you want to fill in the form.

Warning: "Webform settings", "Access control" and "Password protection" only affect the Webform Page - users can still access and submit the Webform directly - so we advise against using these. See above for how to close or restrict access to the Webform itself.

Webform Submissions

Once you've gathered some data from your form, you can view and download the results as needed.

Viewing Submissions

To see all the results for a form click the "Results" tab. You can access this from either the Webform or the Webform Page (though the former seems to be more reliable in some cases).

In most cases, the table will be too wide to view all of the data, but you can click the Submission ID to view the details for an individual Submission. If you need to work with the data as a whole, you may prefer to download it.

Downloading Submissions

Since Submissions generally contain personal data (including IP addresses), please ensure you take appropriate security precautions. For example, if you are working on a personal machine, use the Remote Access Portal rather than downloading the data locally.

  1. Click the "Results" tab
  2. Click the "Download" sub-tab
  3. Click the "Download" button
  4. Open the downloaded file in Microsoft Excel or LibreOffice Calc
  5. Optional: Click the top-left corner (left of the "A") to select all columns, then double-click the line between "A" and "B" to auto-size all columns

Deleting Submissions

One of the GDPR data protection principles is that personal data should not be kept for longer than is necessary - so we recommend deleting Submissions from the web server when they are no longer needed.

To delete an individual submission:

  1. Click the "Results" tab
  2. Optionally, search for the Submission using the "Filter submissions" form at the top
  3. Click the Submission ID
  4. Click the "Delete submission" button
  5. Click the "Delete" button to confirm

To delete multiple submissions:

  1. Click the "Results" tab
  2. Optionally, search for the Submission(s) using the "Filter submissions" form at the top
  3. Tick the Submission(s) to be deleted
  4. In the "Select operation" dropdown, select "Delete submission"
  5. Click the "Apply to selected items" button
  6. Tick "Yes, I want to delete these submissions"
  7. Click the "Delete" button to confirm

To delete all submissions to date:

  1. Make sure the form is no longer in use (e.g. set it to Closed) - otherwise you could accidentally delete a submission before processing it
  2. Click the "Results" tab
  3. Click the "Clear" sub-tab
  4. Tick "Yes, I want to clear all <form> submissions"
  5. Click the "Clear" button to confirm
Please contact us with feedback and comments about this page. Last updated on 05 Dec 2023 13:48.