How To Create Contact Us Page in Blogger

Introduction

In this topic we will discuss about How we can Create Contact us page in Blogger. It is a simple process, If you do all steps correctly then the Script will work fine, Any of user can contact you easily.

Steps to Create

• First go to blogger Dashboard
• Go to Page section and create new
• copy all codes and paste it below
• publish the page

<div dir="ltr" style="text-align: left;" trbidi="on">

  <form name="contact-form">

    <i class="fa fa-pencil-square-o"></i> Name <br />

    <input

      id="ContactForm1_contact-form-name"

      name="name"

      size="30"

      type="text"

      value=""

    />

    <br />

    <br />

    <i class="fa fa-envelope-o"></i> Email Address

    <span style="color: #f56954; font-size: x-small; font-weight: bold;"

      >important</span

    >

    <br />

    <input

      id="ContactForm1_contact-form-email"

      name="email"

      size="30"

      type="text"

      value=""

    />

    <br />

    <br />

    <i class="fa fa-keyboard-o"></i> Content

    <span style="color: #f56954; font-size: x-small; font-weight: bold;"

      >important</span

    ><br />

    <textarea

      cols="25"

      id="ContactForm1_contact-form-email-message"

      name="email-message"

      rows="5"

    ></textarea>

    <br />

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

    <br />

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

      <div id="ContactForm1_contact-form-error-message"></div>

      <div id="ContactForm1_contact-form-success-message"></div>

    </div>

  </form>

  <br />

  <style scoped="" type="text/css">

    #comments,.post_meta,#blog-pager {display:none;} #ContactForm1_contact-form-name, #ContactForm1_contact-form-email{ height:auto;margin:5px auto;padding:10px;background:#fafafa;color:#444;border:1px solid #ccc;border-radius:3px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;transition:all 0.5s ease-out;} #ContactForm1_contact-form-email-message{width:95%;height:175px;margin:5px 0;padding:10px;background:#fafafa;color:#444;font-family:'Open Sans',sans-serif;border:1px solid #ccc;border-radius:3px;transition:all 0.5s ease-out;} #ContactForm1_contact-form-name:focus, #ContactForm1_contact-form-email:focus, #ContactForm1_contact-form-email-message:focus{outline:none;background:#fff;color:#444;border-color:rgba(81,203,238,1);box-shadow:0 0 5px rgba(81,203,238,0.7);} #ContactForm1_contact-form-submit{font-family:'Open Sans';float:left;background:#cf4d35;color:#fff;margin:10px auto;vertical-align:middle;cursor:pointer;padding:10px 18px!important;font-weight:700;font-size:14px;text-align:center;text-transform:uppercase;letter-spacing:.5px;border-radius:4px;border:0;transition:all .8s ease} #ContactForm1_contact-form-submit:hover {background:#e45a40;color:#fff;} #ContactForm1_contact-form-error-message, #ContactForm1_contact-form-success-message{width:100%;margin-top:35px;} .contact-form-error-message-with-border {background:#f6f6f6;border:none;box-shadow:none;color:#444;padding:5px 0;} .contact-form-success-message {background:#4fc3f7;border:none;box-shadow:none;color:#fff;} img.contact-form-cross {line-height:40px;margin-left:5px;} @media only screen and (max-width:640px){ #ContactForm1_contact-form-name, #ContactForm1_contact-form-email,#ContactForm1_contact-form-submit{width:100%;}}

  </style>

</div>

Advantages of Contact Us Page

The Advantage of Contact Us page is to contact any one with you just some simple steps like user have to enter his name, email and his message, and when he/she tap the send button than the whole message will receive your email.

When you start some business or provide any content that help the customers too much then the contact us page will most important for you. So this is the main things i think the Contact Us page is most important for every blogger.

So hopefully that You like the post and learn how to Create Contact Us page in blogger. we can make also this for WordPress but in WordPress their have special plugin. If You like the post than please send or forward your other blogger friends.