How to Use MailTo Forms
You use a web form to collect information directly through a site, for example, to provide a method of contact, conduct a survey, request an RSVP, place an order or solicit feedback.
Note: Do not use a MailTo web form to request personal or sensitive information, such as Social Security numbers, banking information, passwords, and so on.
Follow these three steps to create a MailTo web form.
Build an HTML Page
To add a form to your web page, first create it in HTML using a text editor or the HTML source option in the CMS. You can also use a web authoring tool such as Dreamweaver, available in the Computer Labs, which enables you to build the form in preview mode. Before you begin, it may be helpful to document the information you want to request on the form or sketch how you want the form to look.
IMPORTANT: HTML field names are case sensitive and cannot contain spaces.
- Begin your HTML form with the <form> tag and end with the </form> tag.
|
<form id="my-form" name="my-form" method="post" action="https://www.cmu.edu/cgi-bin/mailto"> |
- Select the form input elements to request information. This example has text fields to request a customer's name, email address, phone number, and a Submit button.
|
<form id="my-form" name="my-form" method="post" action="https://www.cmu.edu/cgi-bin/mailto"> |
- Add optional items to customize your form: required fields, restricted access, directory information.
- Specify the CMU email address of the person who will receive the form responses (@andrew.cmu.edu or @cmu.edu). This email address is a hidden field and will not display on the published form.
|
<form id="my-form" name="my-form" method="post" action="https://www.cmu.edu/cgi-bin/mailto"> |
- (Optional) Add the MailCC attribute with the CMU email address of a second person who will receive the form responses. This email address is a hidden field and will not display on the published form.
|
<form id="my-form" name="my-form" method="post" action="https://www.cmu.edu/cgi-bin/mailto"> |
Note: Contact the Computing Services Help Center if you want to email form results to a non-cmu.edu address.
Create the Email Template for Form Results
Follow these steps to create a text file that acts as the template for the email message sent to the specified recipient when the form is submitted.
- Create your email template using a web authoring tool or text editor (e.g., Dreamweaver, TextEdit, Notepad or SimpleText). Your text file should include variables for all information that is submitted on the form. See Example - Text File for Email Form Results.
- Include typical headers: To, From, CC (if you want the message sent to a secondary recipient) and Subject.
- Do not include a header for the date; this will be included as part of the email message.
- Use an input name variable for each item (%InputName). The variables must be the same as those defined in your HTML form.
- Save your email message template as a text (.txt) file in your web form folder.
- In the HTML web form, reference the text file by adding the hidden field EmailForm with the value set to the path (complete URL) of the email message template. The complete URL includes the name of your website, text file folder name and email message template name.
|
<form id="my-form" name="my-form" method="post" action="https://www.cmu.edu/cgi-bin/mailto"> |
Example - Text File for Email Form Results
The following example uses these variables:
- %MailTo - the email address of the person who will receive the form results
- %UserID - the email address of the person who submitted the form
- %MailCC - the email address of the second person who will receive the form results
- %Name - the name of the person who submitted the form
- %Phone - the phone number of the person who submitted the form
|
To: %MailTo The following person submitted a website form: %Name, %UserID, %Phone |
Develop a Response Page
There are two options to define the action (or response) presented to the user when the form is submitted:
- Redirect an individual to a web page
- Create a custom response page that contains variable text based on form responses (AWPS, UserWeb and CourseWeb forms only)
Redirect to a Response Web Page (RedirectURL Attribute)
- Select an existing page or create a new web page containing the information you want to display after an individual submits a form. If creating a new response page, save the HTML page in a separate response page folder.
CMS Note: The response page appears in the side navigation by default, but you can choose to hide it. - In the HTML web form page, add the hidden field RedirectURL with the value set to the path (complete URL) of the response page you created. The response page must be a web page published to a CMU web server (cmu.edu or andrew.cmu.edu).
In this example, the form named "my-form" redirects to a page named "response.html" when submitted.
|
<form id="my-form" name="my-form" method="post" action="https://www.cmu.edu/cgi-bin/mailto"> |
Create a Customized Response Page With Variable Text (ResponseForm Attribute)
IMPORTANT: If you create your web form page in the Content Management System (CMS), you CANNOT use the ResponseForm attribute to create a customized response template.
- Create a new web page as your response form template, then save the page as an HTML file in your response page folder.
- Write the response message you want to display after an individual submits a form. Use variables (%VariableName) in the HTML code to pull responses from the submitted form into the response page.
In this example, the Name (%Name) and UserID (%UserID) entered on the web form will display within the custom message of the response page.
|
<html> |
- In the HTML web form page, add the hidden field ResponseForm with the value set to the name of the response form template page you created.
In the example below, the web form named "my-form" uses a custom response page named "acknowledge.html."
|
<form id="my-form" name="my-form" method="post" action="https://www.cmu.edu/cgi-bin/mailto"> |