How To Add Contact Form to blogger Page

In last tutorial, I showed you how to Add A Contact Form to your Blogger blog. You can also add Blogger contact form into a page of your Blogger website. It will work absolutely fine and it will not break anything. Let me show you how:

In order to add contact form to a page, you first need to add the contact form widget to the sidebar of your Blogger.

How To Add Contact Form In Blogger Page

After Adding The Contact Form To The sidebar Now We Have To Hide It From The sidebar .First, we need to hide the default contact form from your Blogger’s sidebar widget. Navigate to your Dashboard > Template > Edit HTML. Search and paste this code just above ]]></b:skin>:

#ContactForm1{
display: none !important;
}

Save your template.

Now What We Have To Do Is To Add The Contact Form To A Particular Page Of The Blog/website.

Now, we will add the contact form to a static page of your Blogger blog. Navigate to The Dashboard > Posts, and click on New Page and the select Blank Page.

Now, in the blank page, click on HTML option to switch to HTML editor mode. Add following code and publish your page:

<form name='contact-form'>
<p></p>
Name<br />
<input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='30' value='' type='text' />
<p></p>
Email
<span style='font-weight: bolder;'>*</span><br />
<input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' size='30' value='' type='text' />
<p></p>
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>
<p></p>
<input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' value='Send' type='button' />
<p></p>
<div style='text-align: center; max-width: 222px; width: 100%'>
<p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>
<p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>
</div>
</form>

Now You Are Done .

Every Entry Of The Contact Form Will Be Forwarded To The Blog Owner Mail Id.

Conclusion- The Post Was All About Adding The Contact Form To A Page In A Blogger Blog And Hiding It From The sidebar.This Will Let The Blog Owner To Customize And Personalize His/her Blog By Adding The Contact Form To A Particular Page Of The Blog.