Make Yourself a contact form for your blog

Contact Us

When it comes to design 'contact' is an integral part of the blog in order to get approval from adsense and also to get visitors to contact you easily.
This post is especially for new bloggers to set up contact form instead of simply giving your email id to contact.
I have mentioned 2 methods to set up contact form for your blog.see the final outcome at the end of the 'method' which i have given below and decide yourself which method you want to go with.

Method one

• Create a page

Visit blogger.com and log in to your account in order to make a contact form,then click on pages.there you will see the option 'new page' just click on that.

Now you reached a new page.Here you have to do three important things before adding the code in the page

• Give a name to the page

Give a tittle name to the page like contact us

• Delete the existing html codes

You can see two options there on the top 'compose and html'.click on html.now select all the codes you see in the page and delete it.

• Change the setting of page

By this setting we are just avoiding readers to comment.Just do the same setting as shown in the photo given below then click on 'Done'.

• Paste the code given below 

Make sure you delete the existing code before pasting which I mentioned above. Then hit publish.

<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="widget ContactForm" id="custom_ContactForm1">
<div class="contact-form-widget">
If you have any enquiry please feel happy to Get in touch with us by filling out the form below.<br />
<div class="form">
<form name="contact-form">
Name
<br />
<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />
Email
<span style="font-weight: bolder;">*</span>
<br />
<input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" 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" />
<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>
<span class="widget-item-control">
<span class="item-control blog-admin">
<a class="quickedit" contactform1="" href="https://www.blogger.com/rearrange?blogID=8799058979810298021&amp;widgetType=ContactForm&amp;widgetId=ContactForm1&amp;action=editWidget&amp;sectionId=sidebar-right-1" onclick="return _WidgetManager._PopupConfig(document.getElementById(" target="configContactForm1" title="Edit">
<img alt="" height="18" src="//img1.blogblog.com/img/icon18_wrench_allbkg.png" width="18" />
</a>
</span>
</span>
<br />
<div class="clear">
</div>
</div>
</div>

•  Final outcome

Thats it,this is how it shows when readers click on 'contact'.You can change the description of the contact form if you want.you will find it if you click on 'compose'.admin will receive email when readers send message from this form.

Method two 

Follow the steps given below to add 'contact form' gadget on the side bar.

• Blogger - layout - add a gadget(sidebar) -

Visit blogger.com,Log in to blogger.click on layout,there you can see 'add a gadget' on the right sidebar.clicking on it will bring you to the list of gadgets.

• more gadgets - contact form - save     

Click on 'more gadgets' will bring you to the list,from there you will see contact form.hit the blue coloured [+] button and save it.

That's it,I hope everyone has made a contact form for your blog and please don't forget to share this post to help other bloggers.it means a lot to them cause these things are very important to get approval from Google adsense.share maximum.