How To Add Contact Form (Contact Page) in Blogger

Blogger contact form or contact form html workable code you can get from here i this tutorial i m showing to add contact form ( contact page ) in blogger .

How To Add Contact Form (Contact Us Page) in Blogger?

OK friends in this tutorial i will teach you that how can you create a contact Us page. In this page the visitor can tell you his problem . In simple contact us form you are offering to the people many contact sources .if you want to add contact form in your page then i am going to show some simple and understand able procedure only follow our step and become your contact page contact form page . In this page the visitor can send you his openion about your blog or another massages . this will send your massage in to Mail inbox .These massage will not show in your blog .you can check these massage also in your mobile .Go to your gmail box and open your inbox here is your massages from your contact form page.

for example i have made a website in which i m helping people .They sent their problem i m giving his solution related with their blog you can see below . if you want to make then follow the simple page.

How To Add Contact Form (Contact Page) in Blogger

and one more thing when the visitor send you massage from your blog the massage will laying in Gmail Inbox > Social like given below in photo .

here is your massage

How can you add contact form in Blogger Page

First of all Go >Template
click on ''Edit Html''
a page will open click in code area and press '' Ctrl + F '' from you key board
Search will open copy this code
]]></b:skin>
and past in search box and search It when you found then paste this code above from that Tag .
div#ContactForm1 {
display: none !important;
}

and save Template ''
and Go to Layout and Add Contact form .

Note :

after adding this code your widget contact form will not showing or working.

Now How can you add contact form in Blogger Page Tutorial with the help of screen shoot.

Code for Add Contact Form (Contact Page) in Blogger

Select able Code Copy From Here

<div class="widget ContactForm" id="custom_ContactForm1">

<div class="contact-form-widget">

<br />

<span style="background-color: black; color: yellow; font-size: x-large;">      Thank You For Coming Our Help Center     </span><br />

<br />

<span style="color: red; font-family: "times" , "times new roman" , serif; font-size: large;"><br /></span>

<span style="color: red;"><span style="font-family: "times" , "times new roman" , serif; font-size: large;">TYPE YOUR PROBLEM WE WILL SOLVE AND REPLAY WILL AS SOON AS SOON IS POSSIBLE</span>.</span><br />

<br />

<div class="form">

<form name="contact-form">

<span style="background-color: blue; color: white; font-size: large;">Type Your Name

</span><br />

<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />

<br />

<span style="background-color: blue; color: white; font-size: large;">Mobile Number

</span><br />

<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />

<br />

<span style="background-color: blue; color: white; font-size: large;">Country Name

</span><br />

<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />

<br />

<span style="background-color: blue; color: white; font-size: large;">Your Email

<span style="font-weight: bolder;">*</span>

</span><br />

<input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" />

<br />

<span style="background-color: blue; color: white; font-size: large;">Your Problem In Detail <span style="font-weight: bolder;">*</span>

</span><br />

<textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea>

<input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Send" />

<br />

<div style="max-width: 222px; text-align: center; width: 100%;">

<div class="contact-form-error-message" id="ContactForm1_contact-form-error-message">

</div>

<div class="contact-form-success-message" id="ContactForm1_contact-form-success-message">

</div>

</form>

</div>

<div class="clear">

</div>

<span class="widget-item-control">

<span class="item-control blog-admin">

<img alt="" height="18" src="//img1.blogblog.com/img/icon18_wrench_allbkg.png" width="18" />

</a>

</span>

<br />

<div class="clear">

</div>

You Might Also Read these posts for making your Blog SEO friendly .

· Learn How To Build a Website For Free
· How To Submit Blogger Site map To Google Webmaster...
· How To Write a Good Blog
· How To Write Seo Friendly Blog Posts
· How Can You Add Metadata Tags
· Some Important and Basic SEO Blog Tips
· A Cookie to display the number of times Visit-2
· How To Change Default Title Tag on Blogger for SEO
· How To SEO Optimize your Blogger Blog Titles For Blogger
· How To Change Heading Tag For Better SEO in Blogger
· How To Earn Money From Google Ad sense
· How To Make Money Online Fast
· Learn How To Build a Website For Free

How To Add Contact Form (Contact Page) in Blogger Thank you for adding our code to your blogger for more interesting beautiful contact form ,Face book widget and recent post widgets.visit our homepage . if you face any problem during creating contact form page then take help from us For Go to Our Help Center Click here .

Go To Home