Untitled Document

Web Hosting by Netfirms | Free Domain Names by Netfirms

How To create forms in Dreamweaver without CGI
Forms are great for having your visitors submit information to you. This is a tutorial that will enable you to setup forms in less then 30 seconds and start using them on your site. If you are experienced with Dreamweaver read this tutorial anyway, maybe you will find my way different and possibly faster then what your used to. If you have any questions or dont quite understand one of the steps feel free to e-mail me.

Step 1: Cut and Paste
The first step to get your form started is open a new blank window in Dreamweaver. Then what you need to do is cut and paste the following code into your new blank document. Dont worry I will explain how to customize and use this code :)

<form action="mailto:youremail@test.com" enctype="text/plain" method="post" >
Your email address:<br>
<input type="text" name="emailAddress" size=64 maxlength=64 >
<br>
Your name:
<br>
<input type="text" name="theName" size=23 maxlength=64 >
<br>
Your comments
:<br>
<textarea name="theComments" rows=12 cols=55 >
</textarea>
<p>
<input type=submit value="Send">
</p>
<p>
<input type=reset value="Recycle!">
</p>
</form>

Step 2:
Once you have cut and pasted the information into your page it should look very similar to what I have in the photo to the right. If it does not then try and repaste it into your page. Make sure you are NOT pasting it as text, but pasting it as code. Which is the way that dreamweaver usually pastes it, so you should have no problems. If you have a look at the code in blue in step one you will see the first line points to an email address that I pulled out of a hat. What you want to do is change that to your email address. What this does is uses plain text mime instead of CGI to send the form to your inbox when somebody hits the SUBMIT button. To do this what you need to do is select the top red line above the form. Once you have clicked on it have a look at the properties window. This is where we will be making the changes. All you need to do is change the ACTION where it says "mailto:youremail@test.com" to your email address. Now the form will automatically send whatever is submitted by this form to your email. Try it!

Step 3:
Customizing your form to suit your own needs is actually very easy as well. Dreamweaver makes forms very easy and very customizable. In this case lets say I wanted to make the comments box bigger. All you do is select it with the left mouse button and your properties box will change to look like the image above. If you make the "Char Width" bigger it will make the box wider, if you change the "Num Lines" it will add more lines to it. You will notice that Multi Line is selected. This is what makes this box different from the email address and name boxes. If you changed it to single line it would look exactly like all the other boxes. Play around with this simple tutorial and most importantly have fun with it, if you have any questions or cant seem to get what you want, drop me a line or visit our website. I would be happy to help you. As an extra not on adding fields, you can easily add new boxes to your form, just be sure to fill the textfield in the properties box with a title that will describe whats being submitted. You will understand why when you test your form out. This is what identifies the response in your email.

Ridler Designs: This tutorial was prepared by Mike Ridler of Ridler Designs. Ridler Designs is a relatively new design firm that provides top notch Website designs. We do everything from website design to banners and flash work. Our prices are lower then all of our competition and our designs speak for themselves. Contact me to today to get your own custom quote. Visit our site