Customizing the Contact Form Module - Adding or Changing Fields

The default Contact Form Module for Exponent CMS only has a few fields. In this tutorial, you will learn how to change these fields, or add new fields. You can also customize the layout of the email that you recieve.

First, open the file exponentroot/modules/contactmodule/views/Default.tpl in a text editor. If you cannot edit them directly on the server, first download this file, make your changes, save it again, and upload it. I recommend that you use Filezilla as your FTP client.

In this tutorial, I will add a field for their name.

Find the line:

<tr>
    <td width="10" style="width: 10px" valign="top">Email:</td>
    <td>
        <input type="text" name="email" />
    </td>
</tr>

Above this line, insert this code:

<tr>
    <td width="10" style="width: 10px" valign="top">Name:</td>
    <td>
        <input type="text" name="name" />
    </td>
</tr>
...

On this page you can add any fields you want, change the layout of the form, etc. Just remember what the name="" is for each of the forms--you'll need this for later.

Now, open the file exponentroot/modules/contactmodule/views/_Default.tpl in a text editor. Note the _ character in front of Default.tpl.

Find the code:

MESSAGE:

Email:    {$post.email}
Subject:  {$post.subject}
Message:  {$post.message}

This is what the email will look like. Note, the variable names after $post. are the names of the input fields that are on Default.tpl. So if I want to add a name field, replace that code with this:

MESSAGE:

Name:    {$post.name}
Email:    {$post.email}
Subject:  {$post.subject}
Message:  {$post.message}

That's it! Just change these 2 files to change how the form will look and how the email will look.

Rate this Tutorial

Rate this Tutorial:

Current Rating:

4.5 out of 54.75/ 5.00 with 4 votes.

Current Comments

2 comments so far (post your own)

I was thrilled to see how to change the layout of the email that comes from the form.
Unfortunately this advice won't fit for me since I have made my form with the form module instead of this contact module.

Any idea how to modify the layout of the email sent by a form made by form module? Now everything looks messed. Maybe some <br /> added somewhere would already help.

Thanks!

Gene

Posted by Gene on Monday, 04.25.05 @ 03:10pm | #511

I think you have to add the word into language file also in subsystem/lang

Posted by Eric on Friday, 10.12.07 @ 05:23pm | #3045

Leave your comment:

Learn how to add this comment form to your site with our comment form tutorial!

Name:

Email:

URL:

Comments:
 
Guess the letters and numbers (passphrase riddle) -- 3 chars before V, 1 chars before N - :P: and small 'W' +2 letters; 3 chars before Q & 2 chars before small Z and not a "R", but 'D' +2 letters , → retype that here
Enter the correct letters and numbers from the image into the text box. This small test serves as access restriction against malicious bots. Simply reload the page if this graphic is too hard to read.
 

Note: Emails will not be visible or used in any way, and are not required. Please keep comments relevant. Any content deemed inappropriate or offensive may be edited and/or deleted.

No HTML code is allowed. Line breaks will be converted automatically. URLs will be auto-linked. Please use BBCode to format your text.