Dreamweaver Tutorial – Creating a Contact Form, Adding the HTML Code

Posted on April 14th, 2010 in Dreamweaver Tutorials by admin

Hi, welcome to Dreamweaver tutorial. In this tutorial, you will learn about how to create a contact form and add the HTML code. In this video, we have given you simple to follow steps that will help you to easily create a contact form and add the HTML code.

Hi, welcome to MakeA site Guide. We have taken our website in those last tutorials and now I would like to show you how to create a contact form that you will place on your contact page so that people can reach you. So, let’s open up our contact HTML and create a Div tag for that contact from that we are going to create. So, div tag after start of tag after body area and let’s name it contact form, okay. And let’s create a layout for it, okay.

And lets say we will give it a width of six hundred pixels and a height of four hundred pixels. We are going to margin it from the top, let’s give it a sixty pixel margin and from the left a fifteen pixel margin so that it doesn’t stick on the side of our page. Click apply. I will not apply any borders because we don’t need that really. Accept if you want one. So, delete that text and let’s go to this very nice webpage that website that’s named www.emailmeform.com. Now you can make great email forms here, contact forms. All you have to do is come to this website and sign up with them.

Now I have got contact forms ready here, let’s look at this one. This is the one I use on my website, you can see it has this verification numbers and everything that you need so that you will not have any spams and rob out writing to you. So, it is very easy to create an email forms. Just sign up with this guys and go to create a new form and they have very easy steps just follow those steps and create your self a form. So, let’s get a code of this, of my contact form. So, HTML and see it this is what you are going to get when you finish creating the forms. So just click into that or Ctrl ALL and copy and I am going to show now how to implement it on your site, site.

So, go to code and find the div you have created for this form. Here it is opening directly the contact form and the closing div. so we are going to paste this code in between the opening and the closing div. so, right click and paste and refresh and we go back to the design view. And you can see here is our contact form now, it is little bit out of a form dividing.

So, we are going to come back to div and give it a height of five hundred, apply and ok. So it’s okay now. And, we are going to preview it, so we can see it really works. Yes we want to save changes and here it is your contact form. So, this is it, it’s so easy. Just go to the emailme.com and create your own contact from and implement it on your site. And when people write to you, it will arrive, the emails will arrive straight at the email address that you gave them. So, thank you for watching, good-bye.

Tags: , , , , ,

Tags

3 Responses to 'Dreamweaver Tutorial – Creating a Contact Form, Adding the HTML Code'

Subscribe to comments with RSS or TrackBack to 'Dreamweaver Tutorial – Creating a Contact Form, Adding the HTML Code'.


  1. on May 9th, 2010 at 12:19 pm

    [...] This post was mentioned on Twitter by Tom Brat. Tom Brat said: New blog entry: Dreamweaver Tutorial – Creating a Contact Form, Adding the HTML Code http://www.dreamweavertutorial.net/?p=339 #fb [...]

  2. slacik said,

    on October 7th, 2010 at 9:04 am

    privet

  3. test said,

    on October 22nd, 2010 at 12:01 am

    sasadssdssdds

Post a comment