home > html editors > iWeb

How to Add Email Forms Using iWeb

Using Apple iWeb to add an email form to your website is fairly easy. The steps for doing so are outlined below. Please note that this tutorial was created without actually owning a copy of iWeb, so there are limited screen captures. The basic procedure however should be fairly accurate. If it is not, please let me know.

1. Create Your Form HTML

The first step in integrating an email form into your website is to build the actual HTML code for the form. The easiest and quickest way to create the form code is to use myContactForm.com.

myContactForm.com features a free online wizard that steps you through the entire form building process. myContactForm.com has just about any feature you could ask for including auto-responders, CAPTCHA, file attachements, CSS styling, data exports (Excel, CSV, Text, HTML, etc.), pre-made templates, and much more.

Click Here to read a tutorial on creating the form HTML using myContactForm.com.

2. Open iWeb

3. Create or Open the Page Where You Want the Form

4. Add the Form HTML to Your File

a. Click the Web Widget button.

b. Click HTML Snippet to create a new HTML Snippet Widget.

c. Paste the form HTML into the HTML Snippet Window (Edit > Paste). If you do not have your form code created and copied, please read this tutorial to learn how to do so.

d. Click Apply

5. Save your Form

a. Select File > Save

6. Publish the Form to Your Website

There are a variety of ways to publish your website depending on whether it is being hosted on .MAC or your own private web server. Publish the file containing your form as you would typically do so.

7. 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.

Common Problems Encountered by Users:

I submit the form and get a form location error.

This is typically caused when you are testing a form that has not yet been published to your live website. In addition, because iWeb places HTML Widgets within a separate iframe, the location is not always as you would expect. If you are still having this problem once you have uploaded the file to the live website, please read below.

If you are using myContactForm.com, you will need to login there 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 the iframe that iWeb creates to hold your form. Because iWeb uses an iframe to display the HTML Widget, you are best off copying the form location directly from the error message that is displayed. This URL will probably look odd (name you don't recognize, extra forward slashes, etc.) but, it is correct.

e. Click