Building Web Forms in the CMS

Using the Forms Module

Site editors can create forms inside the CMS to collect submissions from site visitors. This type of content is created through the Form Module where you can add various data fields, including plain text, checkboxes, radio buttons and even an area for file attachments. Once a form is created, it can be placed on the Form template or any other page so you can begin collecting submissions.

Important Security Notice: CMS forms should never be used to collect sensitive data (such as social security numbers, etc.) as our system does not contain the appropriate certifications to house this type of information. This includes data related to regulations surrounding FERPA, HIPAA, PII or other sensitive data. If you require the need to collect sensitive details on a form, please visit the UW Qualtrics information page which is managed by the university's IT team.

View Tutorial   

Form Creation Video Tutorial

Creating a form in the Form Module is a simple user experience with "drag and drop" functionality to create your data fields. This tutorial contains some important features and tips for successful form creation.

View Instructions

 

Step-By-Step Instructions - Creating a Form

Let's cover the steps for creating a form and then placing it inside a page. We strongly encourage you to follow along with the forms video tutorial when building your first form.

An icon of a pencil and paper checklist

From the CMS dashboard, go to Content > Forms in the dropdown menu at the top of the screen.


Screenshot of modern campus CMS interface showing navigation and recently visited page section.



Then, click New, give your form a unique name using the SITE NAME - Form Name naming convention, and select Create to open the form builder.

Screenshot of a CMS interface with a list of forms and a "+ NEW" button.


example naming convention for forms WEB - Form Tutorial

Open the Properties tab and select Access. Choose the correct access group for your site so the form is connected to the right editing permissions. Site editors will only see the access groups they already have permission to use.

 

Screenshot of Modern Campus CMS showing access settings for a form titled "Test 3."

 

Drag and drop the fields you need into the builder. Make sure the blue "Insert Here" line is visible before placing or moving elements.

FORM ELEMENTS AND SETTINGS GLOSSARY

 

CMS interface with form elements toolbar and workspace for editing "Test 3" form.

 

Important Security Notice: CMS forms should never be used to collect sensitive data (such as social security numbers, etc.) as our system does not contain the appropriate certifications to house this type of information. This includes data related to regulations surrounding FERPA, HIPAA, PII or other sensitive data. If you require the need to collect sensitive details on a form, please visit the UW Qualtrics information page which is managed by the university's IT team.

Click directly on any form element to edit its settings inside the panel that appears on the right-hands side of the screen. Add clear labels, helpful descriptions and mark fields as required when needed.

 

Adjust settings for items like placeholders, default values, check boxes and file uploads. For file upload fields, include helpful guidance such as allowed file types, file size limits and error messages.

 

Remember: CMS forms can only accept up to 5 MB file, so avoid video or large file submissions.


Web-based form creation interface with form elements menu and settings panel.

 

In the top left of the form module, select Form Settings.

 

Modern Campus CMS interface showing form editing options and settings.

 

Custom Style URL

Do not use this field. Global styling will be automatically applied to your forms. Do not click the "Download the starter CSS file"—this will serve no purpose to you.

 

Submissions Settings

Choose what happens after submission, such as showing a success message or redirecting to another page. Then complete the email settings, including reply-to information, internal notifications, external confirmation emails and enabling a one-time download if needed.

 

Important Note: An external confirmation email can only be selected if an Email field is added to the form.

                               The one-time download link can be enabled only if the internal emails are present. 

 

Screenshot of a form editor in Modern Campus CMS with form elements and email settings.

 

After making changes to form fields or settings, save your work and select the green Launch button. If your are editing a previously built form, this updates the live version that will be used on your page.

 

User interface for a form creation tool in a CMS, showing form elements and the Launch button circled.

 

Open the page where you want the form to appear, place your cursor in the editable content area, and use the Insert Form icon (denoted as a pencil inside a rectangle icon) inside the WYSIWYG toolbar.

Toolbar interface with a highlighted forms insertion icon.

 

Tip: If you need a new form page, try using the Form template which is pre-formatted to display your forms in an attractive, simple layout.

 

You will then be prompted to select your form. Save and publish the page and test the form in Dev first. 

 

Select the right form from the dropdown menu after clicking the forms icon in the WYSIWYG toolbar

 

 

Site editors can view all form submissions directly in the CMS by going to Content > Forms > Submissions. Submissions are grouped by the version of the form that was active when the submission was received, allowing you to view, search and export submissions for each form version.

 

With the recent Forms update, Modern Campus has improved the Form Module to now include one-time download link in the submission email. When internal email notifications are enabled, submission emails can include a unique, one-time download link that allows recipients to download the submission data as a CSV file. This will be useful to form recipients who do not have access to the CMS to view submissions.     
A few things to note for the one-time download option:

  • The download link is unique to each submission email.
  • The CSV file contains the data for the individual submission associated with that email.
  • The link can be used once and remains active for up to 7 days after the email is sent.

one-time-download screenshot

*IMPORTANT: Forms cannot be recovered once they have been deleted. Due to this, it is important to follow these steps in order prior to form deletion*

  1. Locate the form and select FileView Dependents

    Locating dependecies on a form

  2.  Open up each page where the form is linked and remove it from the page(s). Make sure to save and publish page(s) to Production and Dev.

    View each page where the form is located 

  3. Once it is confirmed the form is not linked to any pages. Navigate back to the form module page and select File Delete. Remember, this cannot be undone and forms will not be able to be recovered once deleted.

    select the delete option for a form