How to create Contact form (Official) to contact page

Contact form widgets move to Static Contact Page in 3 simple step.....

URL like that http://yourname.blogspot.com/p/contact-us.html

Step 1: Add Contact form widgets

सबसे पहले Blogger में Login
उसके बाद Layout में जाए,
कही भी किसी भी कॉलम में Contact from widgets जोड़े,
उसके बाद non-display code से, जो नीचे दिया हैं उससे Hide करे,

div#ContactForm1 {

display: none !important;

}

Step 2: Hide Contact form

Hide करने के लिए सबसे पहले Blogger के Theme में जाएँ Blogger Theme Designer में आने के बाद Advanced मे जाए, उसके बाद Add CSS पर Click करें ऊपर दिए CSS Code को Copy कर Paste  करें Save बटन click करें।

How to Add Contact Page in Blogger view video 

Step 3: Create Contact Page

अब आपका Contact from, Hide हो चुका है। इसे Contact Page में Change करने के लिए आप Blogger Page में जाएँ, Create new page पर click करें। उसके बाद HTML पर click करे फिर नीचे दिए Code को Copy कर Paste करें। और Publish करें।

<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("ContactForm1"));" href="//www.blogger.com/rearrange?blogID=8271139629621125205&widgetType=ContactForm&widgetId=ContactForm1&action=editWidget&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>

blogID=8271139629621125205,please change my blogID, put your blog ID....

Note: Layout में जाकर Cross-Column में   Pages जोड़े।

अगर कोई परेशानी हो, तो आप हमें Comment कर पुछ सकते हैं।
see you Happy Blogging.....