For this post I will show you how to add a Contact Us page on Blogger or Blogspot with a real and functioning Contact Form. When your reader used the form to send an email, it will be received by the email that you are currently using to login your Blogger account.


LIVE DEMO


This post will tackle two tutorials. First is making a Contact Us page. And second is, making a Contact Form for that page. So without further ado, lets start!


Here are the stepson how to add Contact Us page in Blogger with a real and functioning Contact Form


How to add Blogger Contact Us page?


1. Login and open your Blogger account. Go to Pages.



2. Then click +New Page to add a new one.



3. Give a Title to your Contact page page.



4. Then write the content of your Contact page.



5. When done, click the Publish button to save your page.



How to add Blogger Contact Form inside your Contact page?


1. Now, go to Layout.



2. Click any Add a Gadget link that you will see inside your Blog Layout.



3. Inside Add a Gadget, find and click Contact Form.



4. Under Configure Contact Form, give a title for your contact form or just leave it as it is and click the Save button.



5. Now, click Theme.



6. Under My Theme, click Customize button.



7. In the dropdown menu click EDIT HTML.



8. Click anywhere inside the area code and press CTRL + F. Copy and paste this code <b:widget id='ContactForm1' in the search/find field and press ENTER. When done continue to the next step.



9. Below <b:widget id='ContactForm1' you will see there the <b:include id='main'>. Copy and paste this code: <b:if cond='data:blog.url == "PASTE-HERE-URL-OF-YOUR-CONTACT-PAGE"'> below <b:include id='main'>.

Now, scroll down a little bit to find <b:include name='quickedit' /> , and below it copy and paste this code: </b:if>

Your code should look like the image below.



10. Press the Save button to save your HTML.



11. View your blog to see your new Contact Us page and contact form. The widget will only show in your Contact page because we set the condition that it will not show on other pages, posts, and even in the homepage and other static pages.



Done! You have successfully add a Contact Us page on your Blogspot with a working Contact Form.

If you have question, leave a comment below.