How to create Contact Form for Blogger Easily

Make Contact Us Form Page

You can make it form your gadget setting or you also make it by using custom HTML code.

How to Make Contact form Page

First, make a blank Contact Us page to your Blogger

Copy the HTML code from below and paste it into your page HTML option

Contact us form using code

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

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

<p>Get in touch with us by filling out the form below.</p>

  <div class="form">

   <form name="contact-form">

    <p></p>

    Name

    <br>

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

    <p></p>

    Email

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

    <br>

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

    <p></p>

    Message

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

    <br>

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

    <p></p>

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

    <p></p>

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

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

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

    </div>

   </form>

  </div>

 </div>

 <div class="clear"></div>

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

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

   <a title="Edit" target="configContactForm1" onclick="return _WidgetManager._PopupConfig(document.getElementById(&quot;ContactForm1&quot;));" href="//www.blogger.com/rearrange?blogID=8799058979810298021&amp;widgetType=ContactForm&amp;widgetId=ContactForm1&amp;action=editWidget&amp;sectionId=sidebar-right-1" class="quickedit">

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

   </a>

  </span>

 </span>

 <div class="clear"></div>

</div>

How to add your contact form by using the gadget?

     Go to your Layout option

• 
  

• 
  

Contact us form add to blogger

• Add Gadget
  Go to more Gadget
•       Search contact Form and click to Plus(+)
•      Save setting  
•         Done

     

           You also check how to create privacy policy page making way