Create contact us form for blogger

What is contact us blogger?
Contact us bloggers is a page that should be provided by admin blogger function to make it easier for visitors to contact the admin. Be able to give advice, give criticism, ordering goods if the blog is used for the purpose of sales or just to get acquainted with the admin. Contact us usually made on a static page, and then link rather than contact us at put on the menu bar, or there are also put in the footer of the blog.


Without discussing at length about conact us, then it's good we try to follow the steps to make it:
Create contact us form for blogger, the first stage
(1) log into your blogger account.
(2) Add Widget
(3) layout > Add a Gadget
(4) find Contact Form > Add

Create contact us form for blogger, the second stage
(1) Position you are still logged in blogger
(2) Template edit html
(3) Find code:

<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='ContactForm1' locked='false' title='Contact Form' type='ContactForm'>
<b:includable id='main'>

<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='contact-form-widget'>
<div class='form'>
<form name='contact-form'>
<p/>
<data:contactFormNameMsg/>
<br/>
<input class='contact-form-name' expr:id='data:widget.instanceId + &quot;_contact-form-name&quot;' name='name' size='30' type='text' value=''/>
<p/>
<data:contactFormEmailMsg/> <span style='font-weight: bolder;'>*</span>
<br/>
<input class='contact-form-email' expr:id='data:widget.instanceId + &quot;_contact-form-email&quot;' name='email' size='30' type='text' value=''/>
<p/>
<data:contactFormMessageMsg/> <span style='font-weight: bolder;'>*</span>
<br/>
<textarea class='contact-form-email-message' cols='25' expr:id='data:widget.instanceId + &quot;_contact-form-email-message&quot;' name='email-message' rows='5'/>
<p/>
<input class='contact-form-button contact-form-button-submit' expr:id='data:widget.instanceId + &quot;_contact-form-submit&quot;' expr:value='data:contactFormSendMsg' type='button'/>
<p/>
<div style='text-align: center; max-width: 222px; width: 100%'>
<p class='contact-form-error-message' expr:id='data:widget.instanceId + &quot;_contact-form-error-message&quot;'/>
<p class='contact-form-success-message' expr:id='data:widget.instanceId + &quot;_contact-form-success-message&quot;'/>
</div>
</form>
</div>
</div>

</b:includable>
</b:widget>

(4) Remove code :

<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='contact-form-widget'>
<div class='form'>
<form name='contact-form'>
<p/>
<data:contactFormNameMsg/>
<br/>
<input class='contact-form-name' expr:id='data:widget.instanceId + &quot;_contact-form-name&quot;' name='name' size='30' type='text' value=''/>
<p/>
<data:contactFormEmailMsg/> <span style='font-weight: bolder;'>*</span>
<br/>
<input class='contact-form-email' expr:id='data:widget.instanceId + &quot;_contact-form-email&quot;' name='email' size='30' type='text' value=''/>
<p/>
<data:contactFormMessageMsg/> <span style='font-weight: bolder;'>*</span>
<br/>
<textarea class='contact-form-email-message' cols='25' expr:id='data:widget.instanceId + &quot;_contact-form-email-message&quot;' name='email-message' rows='5'/>
<p/>
<input class='contact-form-button contact-form-button-submit' expr:id='data:widget.instanceId + &quot;_contact-form-submit&quot;' expr:value='data:contactFormSendMsg' type='button'/>
<p/>
<div style='text-align: center; max-width: 222px; width: 100%'>
<p class='contact-form-error-message' expr:id='data:widget.instanceId + &quot;_contact-form-error-message&quot;'/>
<p class='contact-form-success-message' expr:id='data:widget.instanceId + &quot;_contact-form-success-message&quot;'/>
</div>
</form>
</div>
</div>

(6) Save template


Create contact us form for blogger, the third stage
(1) Position you are still logged in blogger
(2) layout > Page
(3) click New Page
(4) On Page Title type with Contact us/Contcat Me (just select who you like)
(5) the width of the box write a message in the contact us
(6) Then enter the code form under your writing
(Make sure your script on the page mode in the form of html not Compose)

<form name="contact-form">
Name   
<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="40" />
Email  
<span style="font-weight: bolder;">*</span>

<input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="40" />
Message<span style="font-weight: bolder;">*</span>

<textarea class="contact-form-email-message" cols="40" id="ContactForm1_contact-form-email-message" name="email-message" rows="5" style="height: 91px; width: 270px;"></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>

(8) click option and tick conteng on Press "Enter" for line breaks
(9) continue to Publish