How To Add a Contact Form and Create a Contact Us Page in Blogger

A contact page is how generally a reader of your blog or an advertiser, sponsor or someone with a general query would reach you through. BlogSpot (Blogger) is an ideal choice for beginners to learn the basics of blogging and understand how it works. BlogSpot users can use a contact form in their widgets, but you can not add them to the pages. This a problem for newbies. AdSense, including most of the other quality ad networks, and affiliate marketplaces won’t approve you to join them if you don’t have an about, contact and a privacy policy page. So make sure you create these pages as soon as you start your blog. In this tutorial, I’ll help you to create a contact us page and add a contact form in your BlogSpot blog. I’ll show you two different and easy way to do this, you’ll have choices. Method one is by using a third-party tool, and method two is by using an official Blogger “contact us” gadget. Feel free to choose any. Method No. 1 – Using 123FormBuilder This is my favourite tool to create any kind and type of forms for all non-WordPress sites. 123FormBuilder (previously 123 ContactFormBuilder) is a cloud tool to build any type of online forms, manage workflows, and collect their data very quickly. It works for every CMS platform, including BlogSpot and WordPress. Step 1- Go To 123FormBuilder and Create A Free Account Step 2 – Login To Your Dashboard and Click On The Arrow Next To The Create A New Form Button. Click on contact form & Lead form option. click-on-create-a-new-form A Contact Form Will Appear On The Second Page Which Is Ready To Be Used. You can add any extra fields you may want by clicking the fields button. contact-form-layout Click on save and publish button. Step 3 – Copy the javascript code from the screen. (Press CTRL + C) copy-the-contact-form-code Step 4 – Go to your Blogger blog dashboard and click on add new page. Name this page, “Contact Us.” click-on-new-page Step 5 – Click on the HTML format editor button and paste the code here (Press CTRL + V to paste) and click publish. Your contact form is now live on your blog. Take a look at it. Let’s move to our second method Method 2 – Customizing the Blogger “Contact Us” Gadget Blogger Gadgets section has an official contact us gadget, but you can not use it on any of your pages. It’s only accessible through sidebars. Follow this tutorial below to customize it for using it on pages. Step 1 – Go to your Blogger dashboard and click on the layout tab. Step 2 – Click on add new gadget. layout-add-a-gadget Step 3 – Select the contact us gadget from the menu and click on the add button. Uncheck the visible option and save the gadget. uncheck-the-visible-box Step 4 – Add a new page to your blog. Name this page, “Contact Us.” In the HTML editor of this page copy and paste the following HTML contact form code:

Get in touch with us by filling out the form below.

Your Name

Your Email *

Your Message *

Important – Make sure you change the BlogID located in line 33 of the code above with your blog’s original ID. You can find your BlogSpot blogID by going to your BlogSpot blog dashboard and looking at your URL in the browser’s’ address bar. Here’s how it looks for reference: blogid-location-for-blogspot-blogs Turn off the comments for your contact us page and make sure you add it to your menu so that it is easily accessible. Congratulations! – Your contact us page is now live. Go have a look at your contact form and test it for the first time. I hope this tutorial was helpful to you. You would also like to read about the best chrome extensions for bloggers and the best blogging tools. Share this post to help others and also leave a comment below sharing your thoughts.