How To Add jQuery Contact us Page to Blogger

1.Sign up in http://www.emailmeform.com

2.Click on Create New Form

3.Create your contact us form using webform creation wizard

4.After creating your form, copy HTML CODE for your form.

5.Now Convert your HTML code to XHTML code using this site.

6.Login to your blogger dashboard--> layout- -> Edit HTML

7.Scroll down to where you see </head> tag .

8.Copy below code and paste it just before the </head> tag.

<!-- Import jQuery and SimpleModal source files -->
<script src='http://h1.ripway.com/bns/lightbox-comment/jquery.js' type='text/javascript'></script>
<script src='http://h1.ripway.com/bns/lightbox-comment/jquery.simplemodal.js' type='text/javascript'></script>

<!-- Contact Form JS and CSS files -->
<script src='http://h1.ripway.com/bns/lightbox-comment/basic.js' type='text/javascript'></script>
<link type='text/css' href='http://h1.ripway.com/bns/lightbox-comment/basic.css' rel='stylesheet' media='screen' />

<!-- IE 6 hacks -->
<!--[if lt IE 7]>
<link type='text/css' href='http://h1.ripway.com/bns/lightbox-comment/basic_ie.css' rel='stylesheet' media='screen' />
<![endif]-->

9.Now again scroll down to where you see </body> tag .

10.Copy below code and paste it just before the </body> tag and save your template.

<div id="basicModalContent" style='display:none'>

ENTER XHTML FORM CODE HERE(in step 5)

</div>

Note : Replace "ENTER XHTML FORM CODE HERE(in step 5)" with your XHTML Code in step 5.

11.Now Add below code Anywhere in your blog to bring contact us form.

<div id='basicModal'><a href='#' class='basic'>Contact US</a></div>

12.Now you are done.