8.7.14

How to Create Separate Contact Page in Blogger

Posted by IAStoday

Today we provide you full tutorial about how to Create Separate Contact Page in Blogger for visitor which one contact you directly from contact us page. Blogger launched contact form widget officially but its woks only on blogger sidebar so we provide you tutorial about how to you add contact page separately in blogger. Many blogger didn't want the contact form everywhere on blog so you can easily move contact page to separate page.
How to Create Separate Contact Page in Blogger

How to move Contact Page to a separate Page

Follow below steps to move contact form widget to separate page. If you want to see demo then go to our Contact Us Page:

Step 1

First add contact us widget to your sidebar. If you want to see how to add contact us widget then go to our tutorial about how to add contact us widget to know more about this.

Step 2

Now create new blank page in your blog as shown at below picture.
Create Separate Contact Page in Blogger

Step 3

Copy below code and paste it into html code in blogger page as shown in below picture.
Create Separate Contact Page
<form name='contact-form'>
<div>Your Name : </div>
<input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='30' type='text' value=''/>
<div>Your Email: <em>(required)</em></div>
<input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' size='30' type='text' value=''/>
<div>Your Message: <em>(required)</em></div>
<textarea class='contact-form-email-message' id='ContactForm1_contact-form-email-message' name='email-message' rows='5'></textarea>
<p></p>
<input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='Send'/>
<div style='text-align: center; max-width: 450px; width: 100%'>
<p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>
<p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>
</div>
</form>

Step 4

Now go to Template then click on Edit HTML as shown in below picture.
How to Create Separate Contact Page

Step 5

Now jump to the Contact Form code with click on jump to widget code as shown in below picture.
Create Contact Page

Step 6

Now expand the main b:includable as shown in below picture.
Separate Contact Page

Step 7

Now delete the highlighted code for prevented contact form widget to appear anywhere on the sidebar as shown in below picture.
Contact Page

Step 8

Click on Save the Template button.

0 comments:

Feel free to drop your feedbacks;
Its our pleasure to hear it from you...

Recommended for you>>>

Don't Forget To Join Our Community
×