Search This Blog

Tuesday, November 15, 2016

How To Create Contact Page For Your Blog On Blogger/Blogsport

The importance of feedback to both business and bloggers cannot be said to be overly stressed, because when your visitors gives you feedback, it help you (the owner of the website or blog) know what your audience is looking for from your website and that will enable you to better plan for future posts. But can you create a Contact Page for your blog in blogspot?

YES!!! You can. And this article will help you out.

To be able to create a contact page for you blogspot blog, you do not need to any programming/codding or coding knowledge prior to this, neither are you going to be editing the template or layout of your blog. No you will not be needing that. What you will be needing is just:
  1. Your Blog's ID number
  2. Copy and Paste the code below in a new page you will create.
How To Know You Blog ID Number.
When you sign into your blog's dashboard, just look at the URL in the address bar of your browser and you will see your Blog's ID number there. The image below will help you easily identify your blog ID number when you see it.

Now that you have known your blog's ID number, note it down or copy and paste is somewhere, so that we can move to the next step.

Creating The Contact Page
  1. Create a New Page.
    To do this, click on the Page tab at the left navigation section and click on the New page button.

  2. Switch the post editor of the new page from Compose to HTML then copy and past the code below.
    var blogId = '5050757548295981564';//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': ''}, 'displayModeFull'));
    return true;
    <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>
    <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>
  3. Now change the blog id which we have highlighted in red to your own blog id.
    Add the Page title in the title bar of the post editor and any other thing you will like to include in the page.
  4. Finally, click the Publish button and your contact form page have been created.
You can view it and try use it to send yourself a message through it to confirm that it is working. But we are 101% sure that if you can copied the code above correctly and have insert your blog's right ID, then it should be working.

If it is not working, please check the blog's ID you inserted in the code above.

Where will the message from the contact form be sent to?
 The message will be sent to the mail you are using for your blog, that is, the email address you will use to sign into blogger in order to view and edit your blog.

Also know that if you have added other people as admin to the blog, the message from the contact form will also be sent to them.

And you can reply to the message right from your email address.

Also Read:
Team Pinfoltd



Search This Blog