Blogger

How to add Contact form Page in Blogger

Hi Guys!! Hope you are well. In this tutorial I will show you, How to add Contact form Page in Blogger. Honestly, It is not a Hard work. We can do it in 3 steps. So, Let’s do it.

Also Read:

How to add Contact form Page in Blogger

Follow those steps to add contact from on Blogger. If you have little knowledge about Html you can do it more easily.

Add a Contact Form Gadget in Layout

First, we need to Add a Contact Form Gadget in Layout. Login to your blogger Dashboard > Layout > Add Gadget > Contact Form > Save it

Hiding Contact Form From Your Sidebar

Then, we need to hide the default contact form from Blogger’s sidebar widget. Navigate to your Dashboard > Template > Edit HTML. Search and paste this code just above ]]>: Then save the template.

#ContactForm1{
display: none !important;
}

Adding Contact Form To A Page

Now, we will add the contact form to a static page of your Blogger blog. Navigate to your Dashboard > Posts, and click on New Page and select Blank Page.
Now, in your blank page, click on HTML option to switch to HTML editor mode. Add following code and publish your page.

<form name='contact-form'>
<p>Name</p>
<input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='30' value='' type='text' />
<p>Email</p>
<input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' size='30' value='' type='text' />
<p>Message</p>
<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' value='Send' type='button' />
<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>

That’s it! Note that, It is just a Html structure but, You can also customize the contact form with custom CSS styling or jQuery. If you have any question about How to add Contact form Page in Blogger topic please comment below!

Imran Hossan

I am Imran, a student with the dream of becoming a professional developer, I love to explore, explore, learn interesting things on the Internet.

Related Articles

2 Comments

Leave a Reply

Your email address will not be published. Required fields are marked *

Back to top button

Adblock Detected

Hey Dear!! Thank you for visit on TuneBN. Please Disable your AD Blocker to continue browsing.