In the past, adding a custom contact form for Blogger was quite a complex process, and many bloggers were forced to use third party websites. However, even after Blogger launched its own contact form gadget, it was still considered as highly inadequate. This is because the official gadget would only be implemented on the footer the sidebar. Most bloggers preferred having a separate blogger contact form placed on its own page to make their blogs appear well arranged and more professional as well.
Having a well laid-out Blogger contact form is very important. This is the tool that visitors, companies, and brands can use to contact you and it is simply a must-have feature for every blogger. If you are not comfortable with sharing your main email address directly on your blog, then a custom Blogger contact form offers an effective way in which people can easily reach you.
1. Log into your Blogger dashboard and go to "Layout" > click on the "Add a gadget" link on the page elements area.
2. Select "More Gadgets" below the "Basics" tab and click the "+" button to add the Contact Form Gadget.
1. Go to "Template" and press the "Edit HTML" button. Once the code editor opens, click anywhere inside the code area and press CTRL + F keys (or Command + F for mac) to open the search box.
2. Type or paste the following tag inside the search box and hit Enter to find it:
1. Go to "Pages" and click the "New page" button. If you already have a Contact us page, just click the "Edit" link below the page title.
2. Once the Page editor opens, fill up the page title with Contact/Contact Us or any title you want to show. It is recommended doing this before anything in order to make the permalink SEO friendly.
3. Click on the HTML tab as there we will add the code to make the custom Blogger contact form work. On the right site, change the Page settings to hide ("Don't allow" or "Don't allow, hide existing") the reader comments, then click the "Done" button:
4. Below are 5 custom Blogger contact form styles. Pick your favorite and copy the code provided, then paste the code inside the HTML box of your page editor:
5. After you added the code, click the "Publish" button on the upper right side. Now you should be able to see the Blogger contact form live on your static page. To ensure that everything works fine, you can send a message as a test. The message should be delivered to your inbox in a matter of seconds, just make sure that you're checking the email that you're using with your Blogger account.
Ultimately, by using the custom Blogger contact form you gain from consistency in the type of information you request and also reduce spam since you will not have to display your email directly on the blog.
Having a well laid-out Blogger contact form is very important. This is the tool that visitors, companies, and brands can use to contact you and it is simply a must-have feature for every blogger. If you are not comfortable with sharing your main email address directly on your blog, then a custom Blogger contact form offers an effective way in which people can easily reach you.
Why you should use a Blogger Contact Form?
If you are still stuck on third party providers, you should definitely consider switching to the official custom contact form for Blogger since it has various unique benefits, like:- Messages are delivered immediately - As the blog administrator, you will receive a message immediately the visitor clicks send.
- Reliable - It is the official form developed by Blogger, which makes it more trustworthy and reliable way to initiate contact as compared to using third-party services.
- Questions - The contact form offers a platform for your visitors to ask specific questions that they might have regarding the blog you wrote or your business in general. It can be an excellent way of capturing leads and even lead to conversions if you are selling a certain product or service.
- Feedback - Visitors can easily comment on your blog by leaving their feedback through your contact form. This feedback can help you determine which post to do next or what areas to address based on the visitors' comments.
- Information or service request - For those who are using the blog as a way of marketing a product or service, potential clients can use the custom contact form for Blogger to reach out and request additional information.
How to Add Blogger Contact Form Gadget
Before adding a custom Blogger contact form to a static page, we need to add the default contact form in the blog's sidebar to make it functional:1. Log into your Blogger dashboard and go to "Layout" > click on the "Add a gadget" link on the page elements area.
2. Select "More Gadgets" below the "Basics" tab and click the "+" button to add the Contact Form Gadget.
Hiding Blogger Contact Form from the Sidebar
Once the contact form has been added, next step is to hide it so that it will appear only in the static page.1. Go to "Template" and press the "Edit HTML" button. Once the code editor opens, click anywhere inside the code area and press CTRL + F keys (or Command + F for mac) to open the search box.
2. Type or paste the following tag inside the search box and hit Enter to find it:
]]>3. Just above the ]]> tag, add this CSS code:
#ContactForm1{display: none !important;}4. Click the "Save template" button on the upper left side and view your blog. The contact form widget should be gone.
Adding Custom Blogger Contact Form in a Static Page
Finally, now that we enabled the functionality of the contact form, let's add a custom contact form in our Blogger blog...1. Go to "Pages" and click the "New page" button. If you already have a Contact us page, just click the "Edit" link below the page title.
2. Once the Page editor opens, fill up the page title with Contact/Contact Us or any title you want to show. It is recommended doing this before anything in order to make the permalink SEO friendly.
3. Click on the HTML tab as there we will add the code to make the custom Blogger contact form work. On the right site, change the Page settings to hide ("Don't allow" or "Don't allow, hide existing") the reader comments, then click the "Done" button:
4. Below are 5 custom Blogger contact form styles. Pick your favorite and copy the code provided, then paste the code inside the HTML box of your page editor:
Simple Contact Form
Contact form with CSS rainbow divider
Blogger Contact Form with CSS Ribbon
Minimal Contact Form
Contact form with speech bubble
5. After you added the code, click the "Publish" button on the upper right side. Now you should be able to see the Blogger contact form live on your static page. To ensure that everything works fine, you can send a message as a test. The message should be delivered to your inbox in a matter of seconds, just make sure that you're checking the email that you're using with your Blogger account.
Frequently Asked Questions about the Custom Contact Form for Blogger
Where do the messages go?
Once a visitor asks a question or sends feedback through the Blogger contact form, it is instantly delivered to the email associated with your Blogger account. If a blog has several administrators, then all the individual administrators will receive the comments or questions asked by the visitor.What is the benefit of using a separate "Contact Us" page?
Even though it all comes down to your personal preferences, your blog will look more professional if it has a separate page for the custom contact form for Blogger. It gives you credibility and also offers you the chance to add a specific call to action in the new "Contact Us" page.Is it possible to add extra fields?
Unfortunately, no. You can't add custom fields such as website, phone number or mailing address since Blogger uses special tags in order to transfer data. In any case, the default fields are well laid-out and will help you to get the basic information you need about your visitors.I have installed the Blogger contact form, but it is not working. What could be the problem?
There are several reasons why you may be having trouble setting up your contact form. The simplest way to troubleshoot is to countercheck the email you linked to the blog and also reinstall the form again.Ultimately, by using the custom Blogger contact form you gain from consistency in the type of information you request and also reduce spam since you will not have to display your email directly on the blog.