How To create Contact us page for Blogger?

0
61
views
How to create contact us page on blogger

Every blog should have a contact us page. It helps your readers to easily communicate with you also your clients can communicate with you using this contact us form. This contact form helps to reduce your readers valuable time to note your e-mail open an email app like Gmail/Hotmail and then type an E-Mail. Instead of this, they can come to your blog contact us page and simply can contact you by filling up this Contact us form and pressing the send button.

On the Internet, there are many tutorials available about how to create a Contact us page but most of them are very complicated. In this post, I am trying to keep it as simple as possible. So let see How To create Contact us page for Blogger.

Let’s Create Contact us page for Blogger

To create your Contact us page or Contact Form follow these steps below.

  • Go to your blogger dashboard (Blogger.COM)
  • Pages
  • New Page
  • Add Your Page Title: Contact us
  • Switch to HTML compose modeBlogger Contuct us page
  • Copy the code below
<script>
var blogId = '4739749415063587003';//this number should be mandatorily edited.
//The below message 5 Strings can also be edited
var contactFormMessageSendingMsg ='Sending...';
var contactFormMessageSentMsg = 'Your message has been sent.';
var contactFormMessageNotSentMsg = 'Message could not be sent. Please try again later.';
var contactFormEmptyMessageMsg ='Message field cannot be empty.';
var contactFormInvalidEmailMsg = 'A valid email is required.'

var widgetLoaded=false;
function sendEmailMsg() {
if(widgetLoaded== false) {
_WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'sidebar', null, document.getElementById('ContactForm1'), {'contactFormMessageSendingMsg': contactFormMessageSendingMsg , 'contactFormMessageSentMsg': contactFormMessageSentMsg , 'contactFormMessageNotSentMsg': contactFormMessageNotSentMsg , 'contactFormInvalidEmailMsg': contactFormInvalidEmailMsg , 'contactFormEmptyMessageMsg': contactFormEmptyMessageMsg , 'title': 'Contact Form', 'blogId': blogId, 'contactFormNameMsg': 'Name', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Message', 'contactFormSendMsg': 'Send', 'submitUrl': 'https://www.blogger.com/contact-form.do'}, 'displayModeFull'));
widgetLoaded=true;
document.getElementById('ContactForm1_contact-form-submit').click();
}
return true;
}
</script>
<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' onclick="sendEmailMsg()"/>
<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>
  • Remove anything on your New page then Paste The code
  • Replace the red bog id with your blogger id
    If you don’t know your blog id then Open your blogger dashboard copy that URL
    like my Blog dashboard URL: https://www.blogger.com/blogger.g?blogID=4739749415063587003, in this case, the red one is my blog id.
  • Now click on post settings
  • Options
  • Readers Comments > Don’t allow Compose Mode
  • Click on publish Button

Other Popular Posts

Things to Check

To avoid any Error! you have to check some things.

My Contact form is not working!

After publishing this page open an incognito tab and test your Contact Us Form. If it does not work then add a contact form on your sidebar from your blogger dashboard >> layout >> ad gadget >> Contact Form >> save. After that check your contact form if it works then you can remove the Contact form widget From your Blog layout.

All e-mails are going to Spam list!

If you are not receiving e-mails then you can check the spam list. To avoid this issue go to your e-mail open your contact form e-mail then click on the Report as not spam and test it again.

In Conclusions

Hope I explain all steps correctly if by chance I missed something lets me know in the comment section. If you are having some problems then feel free to ask. If you like this tutorial then like it and feel free to share this with your blogger friends.

LEAVE A REPLY

Please enter your comment!
Please enter your name here