home > content management systems (CMS) > drupal

Easily Add Email Forms to Your Drupal Web Site

This tutorial features step by step guidelines for adding an email form to Drupal. A demonstration form created using a Drupal web site can be seen here.

1. Create Your Form HTML

The first step for adding a contact form to Drupal is to create the actual HTML code for the form. The best way to do this is to use a free email form service such as myContactForm.com. We've written a complete myContactForm.com tutorial here.

2. Login to the Drupal Administration Interface

a. Go to your Drupal web site and login to the administration panel.

Login to Your Drupal Panel

3. Add the Form Code to Your Content Page

a. You can add your email form to either an existing content page on your site or you can create a new content page for the email form.

To Create a New Content Page, click the Add Content Button

Click the Add Content Button

To Edit and Existing Content Page:

1. Navigate to the page that you would like to edit and add the email form to.

2. Click the Edit Tab

Click the Edit Tab

b. In the new window that opens which allows you to add/edit the content of your page, scroll down to the selection box that says Text Format and select Full HTML.

Select Full HTML for the Text Format

c. Paste the form HTML into the Body box (CTRL+V or Right Click and Select Paste). If you do not have your form code created and copied, please read this tutorial to learn how to do so.

Paste in Your Form Code

d. Click the Save button

Click the Save Button

4. Test Your Form

Open a web browser and go to the web page containing your form. Fill out the form and press the submit button to test it.

A demonstration form created using a Drupal web site can be seen here.

 

Common Problems Encountered by Users:

The web page is showing a bunch of HTML instead of a form.

When this occurs, it is caused by the form HTML being pasted into the Body of your web page using plain text formatting instead of full HTML formating. When inputting the form code, make sure you select Full HTML for the Text Format.

Select Full HTML for the Text Format

I submit the form and get a form location error.

If you are using myContactForm.com, you will need to login and make sure that you've set the Form Location setting to the proper URL for your form.

a. Login to myContactForm.com

b. Click the Edit Button

c. Click the Basic Form Information Button

d. Enter all variations of the URL where the form will appear. Typically this is the full URL of your web form with and without the www subdomain. You can also use wildcards (*) in this setting. For examples using http://www.mydomain.com/* would allow the form to be placed on any page uploaded to mydomain.com.

e. Click