How to Add Contact Us Page in Blogger

Having to contact us page in blogger, most important for you. Because it increases your communication with blog readers. After reading your blog, if anyone needs your help or contact privately or suggest something, then they need this page. But if you don’t have this page in your Blogspot site, then you will miss them.

In this article, I will share how to add contact form in blogger and how to add this in the contact us page.

Add Contact Us Page in Blogger

If you want to create a custom contact form for a blogger, then you just need to follow these steps:

#1 Step: Go to your blogger dashboard > Layout > Add a Gadget

#2 Step: Now click on Contact form & finally save.

#3 Step: In this step, you need to hide the Blogspot contact form from the sidebar. So, go to Theme > Edit HTML > Paste following CSS code before </head> tag. (you can use Ctrl+F to find the tag).

div#ContactForm1 {display: none ;}

Now you have successfully hide contact form blogger widgets from the blog sidebar.

#4 Step: Now go to Pages > New Page > HTML & paste following code:

If you need help, have suggestion or complain, then use this contact form to contact with us!<br />
<div class=”widget ContactForm” id=”custom_ContactForm1″>
<div class=”contact-form-widget”>
<div class=”form”>
<form name=”contact-form”>
Name
<br />
<input class=”contact-form-name” id=”ContactForm1_contact-form-name” name=”name” size=”28″ type=”text” value=”” />

Email
<span style=”font-weight: bolder;”>*</span>
<br />
<input class=”contact-form-email” id=”ContactForm1_contact-form-email” name=”email” size=”28″ type=”text” value=”” />

Message
<span style=”font-weight: bolder;”>*</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>
</div>
</form>
</div>
</div>
<div class=”clear”>
</div>
</div>

Note: You must give your page name as Contact us and finally Publish the page.

#5 Step: Now you save successfully added awesome contact form for Blogspot website. Just publish a page and make visible for readers.

If you follow these step by step tutorial, then you able to add contact us page in blogger. But if you face any problem during page creation, then put your important feedback comment. Because comments are a great solution for everyone.