Monday, February 13, 2012

How to Make a Contact Page in Blogger

Do you want to make a contact page in your blog so your readers don't have to leave your website to email you? 

Here's an easy way to make a contact form in Blogger -- using Google Drive (formerly Docs). I learned how from
 Blogger Xpertise, but I tweaked its instructions to make it even easier to create a contact form. I have also updated it for Google Drive:   


Step 1: Create the Contact Form 
  • Go to Google Drive --> Create ---> Form. You will get this screen:
How to make a contact page in blogger

  • Give your form a name, like "Contact Me" or "What's On Your Mind?"
  • Create questions, which will be the fields in the form. The three basic questions I use are: Name, Email, and Comments. Choose from the drop down menu the type of comment each question requires: Name and Email use "text" comments, and Comments are "paragraph text." You can choose which questions are mandatory.
  • Preview the form by clicking "View Live Form."


Step 2: Get the html code

After you are satisfied, click "Send Form." Click "Embed." Google will give you an html code to copy. You can change the size of the form based on your blog template. Mine looks like this:


Step 3: Create Your Contact Page on Blogger
  • Go to your "Contact Me" page (or create one) on your blog. (Go to Posting --> Edit Pages). Open the "Edit HTML" tab and paste the code from Google Drive.
  • Preview how it will look on your blog. You can adjust the width of the form at this stage too. 
  • Publish. My contact form looks like this:


Step 4: Make Sure You are Notified When Someone Uses the Form

Go back to your Google Drive form and click on, "Choose response destination" and click, "create a new spreadsheet." When someone fills out the contact form, the information will go into the spreadsheet. Turn on email notification:
  • Go back to Google Drive and click on your form. A spreadsheet will open. Click Tools --> Notification Rules.
  • Check the box "a user submits a form" and "email-right away." Save.
That's it.  Go ahead and test it by sending yourself a comment. (P.S. Test your own form, not mine. I've gotten several test comments!)





This is one of several posts on improving the look and feel of your Blogger blog. I am not a coder and all of these tweaks are easily done. Just remember to save a copy of your template before making any changes. Other posts you may enjoy:

122 comments:

  1. Sylvia,
    Thanks so much for this! I've found several sets of directions regarding comments and yours works like a charm- you should write cookbooks!

    ReplyDelete
  2. Thanks so much, Sylvia. I've been wanting to do this for ages!

    ReplyDelete
    Replies
    1. So have I! I would REALLY like to know how people make ebook and software selling websites right here on blogger!!!!!

      Delete
  3. Thank you! I just did this. Your instructions were so helpful!

    ReplyDelete
  4. This is exactly what I was looking for- easy directions. Flawless instructions. Thank you Sylvia!

    ReplyDelete
  5. Excellent tip. Have incorporated it into our website. Thanks.

    Only thing I need to figure out is how to get rid of the info on the response note asking the user to create their own form.

    http://maidstoneinvicta.blogspot.co.uk/p/contact-us.html

    ReplyDelete
    Replies
    1. Yeah, I just noticed that too. I guess that's the price of using free services like Google Docs; we have to put up with the advertising. At least it's pretty subtle.

      Delete
    2. Hi, I've just created a form but does anybody know how to remove "This content is neither created nor endorsed by Google.
      Report Abuse - Terms of Service - Additional Terms"

      The form would look much more professional if it could be removed.

      Cheers

      Delete
    3. Really Thank You ... I did amazing contact form :)

      Delete
  6. Thaaank you so much for your help! :D

    ReplyDelete
  7. Thank You! I was able to create the page in like 5 minutes, Thanks to you!

    ReplyDelete
    Replies
    1. You're welcome, and thanks for stopping by!

      Delete
  8. thanks for giving good things to us
    see my blog http://comptutorkg2pg.blogspot.in/

    ReplyDelete
  9. i Just Create in 2 minutes not yet publish as i need to master in tabbing just started my blog.
    www.iosstuff.blogspot.com

    don't know how to create better.
    pls help me and advice me.
    Thanks,

    ReplyDelete
    Replies
    1. I checked out your blog. It looks like a good start. I would suggest moving the widgets that you currently have at the bottom of the page to a sidebar so people don't have to scroll all the way down. You can also check out my post, "8 Ways to Make a Blogger Blog Look and Act Like a Website" for other tips. Good luck!

      Delete
  10. Thank you for putting this on your blog! I was searching all throughout google when I finally came across this post. This tutorial that you put up has really improved my blog :) Thank you again!

    ReplyDelete
  11. Silvia, I just wanted to say thank you so much for all your helpful blogger tips. Thanks to you I have been able to make several changes to my blog for the better including adding social media icons and a contact page. Your step-by-step tutorials are so helpful for a beginning blogger like myself who is figuring out all this one step at a time (HTML?!). So thank you for sharing your knowledge!

    ReplyDelete
    Replies
    1. Oops - just realized I misspelled your name - sorry Sylvia ;)

      Delete
    2. Thanks, Haeley. Glad to be of help. I'm basically learning as I go too, and thought people would appreciate learning the things I've found useful. Your blog has a nice clean look!

      Delete
  12. Best help ever. You are helping me to accomplish my blog dream.

    ReplyDelete
  13. Hi Sylvia. I've been looking at other contact me form too but yours is easy and the best. Thank you so much.

    ReplyDelete
  14. Sylvia, thanks so much. Mega helpful! :) x

    ReplyDelete
  15. thanks a lots for this (http://movies-mypassion.blogspot.in/)

    ReplyDelete
  16. You have been a Godsend!! I owe most of my blog set up to you!!!

    ReplyDelete
  17. its better to make form in jotform.com you gonna check it out

    ReplyDelete
    Replies
    1. Thanks, I will check it out. Do you have an example of a form made with this?

      Delete
  18. Thank you so much! This is exactly what I was looking for and it works very well on my blog, http://thefrugalmum.blogspot.ie.

    ReplyDelete
  19. Thank you Sylvi dear :)
    My Blog :http://the-prodigal-paradox.blogspot.in/

    ReplyDelete
  20. Thanks a lot :) It works great ... what an idea !

    ReplyDelete
  21. Wonderful tutorial thanks - the only problem I had was trying to resize the form - I keep getting an error code. Did you have any problem with that at all?

    ReplyDelete
    Replies
    1. I haven't had that problem. Make sure you're working in the "HTML" form, and just change the number itself (nothing else, leave the quote marks). See if that helps. Otherwise, I'm not sure what to suggest.

      Delete
  22. thank you very much for this article

    ReplyDelete
  23. Hi Sylvia,

    I have just started a blog on my fav football team. request your expert eye

    http://justgooners.blogspot.in/

    ReplyDelete
    Replies
    1. It looks great...love the colors and the layout. Very clean and appealing!

      Delete
    2. Thanks the kind words, and your article helped me a lot. I request your suggestions.

      Delete
    3. If you have any specific questions, please feel free to send them to me (use the contact form). It's hard for me to give suggestions at this point because it's such a new blog with a few posts. One quick tip: add labels to your posts so that readers can eventually pull up articles by topic.

      Delete
  24. Was looking for it for a long time!Just in minutes I could creat it.
    God bless you!

    ReplyDelete
  25. Thanks for the info! You are a great teacher! Any advice on my blog I would definitely appreciate it. Thanks! www.ilovekingjesus.blogspot.com

    ReplyDelete
    Replies
    1. And I turned the email notifications on like you said and checked it 3 times to make sure was done right and I still get no email when I try the test...The only place I see it is in the spreadsheet on the docs.???? Thanks

      Delete
    2. Mmm. I'm not sure what to say. I'll try to send you a message on your contact form to see how it works.

      Delete
    3. The message you sent me only shows up on the spreadsheet in google docs, I don't get a notification through my email...well thanks for trying!

      Delete
  26. Thank you so much ,sylvia.........

    ReplyDelete
  27. Thanks for the tutorial however I tested it and sent myself various comments and they only shows on my spreadsheet

    ReplyDelete
    Replies
    1. Hi Claudia, Did you do the last step, where you turn on the email notification? Also, since you are doing it through your Google account, make sure you are checking the email account you have on file or that you are using with Google.

      Delete
    2. Hi Sylvia! I did the last step = tools, notification rules, user submits a form is checked and also email notification is checked, I saved. My email is the correct one and I even checked my spam box and nothing :/ I only see them in the spreadsheet.

      Thanks for your help

      Delete
    3. Sorry, Claudia! I'm not sure why it doesn't work for you. Here's a post at Blogger Xpertise that gives instructions on how to have Blogger email you the comments directly. I haven't tried this yet.

      Delete
  28. Thank you so much for the detailed tutorial! Easy to understand and setup my contact meet page in minutes.

    ReplyDelete
  29. Truly wonderfully done instructions! I was able to put this together in less than 15 minutes! Thank you so much for taking the time!!!

    ReplyDelete
  30. Hi Sylvia! Thank you for this post. However, I'm going crazy here . For some reason when I follow your steps my Contact form never publishes. I've followed your steps exactly and can't see my form when I view my blog. Shows up fine in preview but when I go live nothing. Anyone else experience this? I can't figure out what's going wrong.

    ReplyDelete
    Replies
    1. Hi Daniel. Have you made a separate Page for your contact page? Go to "Pages" in your dashboard, then "New Page," title it "Contact Me" or something like that, and click on the HTML editing mode, then paste your code from Google Drive. Then go back to "Pages" and make sure you have "Show Pages as Top Tabs." Hope that helps?

      Delete
  31. Hey Sylvia, thanks for this wonderful post. This is very useful and helpful, it helped me a lot to improve the view of my blog. As a novice it takes very long to learn these things but you did really awesome job with this post.

    Please give a look at my blog : http://prasantmishra.blogspot.com

    Do suggest me some tips so that I can make it more dynamic and scenic to attract readers.

    ReplyDelete
  32. Thank you, you've helped me. :)

    ReplyDelete
  33. Thank you so much! Such easy and clear instructions x

    ReplyDelete
  34. Thankyou so much its really helped me. I made a form to let people report copyright infringement. Kinda helps with a blog that sources images:

    Owner of www.wildprocrastination.blogspot.com

    ReplyDelete
  35. great!! thanks for the idea. I was looking for a secure and simple solution, and got it :D

    ReplyDelete
  36. I did use this Google contact form and wasted a good part of a day trying to get this form to work properly. It filled in the spreadsheet and all but wouldn't send me the email. Yes I checked all the setting and redid the form to make sure it was set up right. I even posted the issue on their forums for these forms and no one responded to my inquiry either. I am leaning towards the idea that the problem was due to the fact I am not a "Google+" member. I want to keep my private life separate from my blog life and do not want Google+ membership. I was able to find Kontactr and install it in minutes and it works. It does have Captcha which I find a bit annoying but other wise it looks and works fine for now.

    ReplyDelete
    Replies
    1. Hi. I'm glad you found a way to work it out, even though these instructions didn't help. Sorry to hear that, and good luck with your blogging!

      Delete
  37. thank You Please Tell Me What Changes I Want to Do With This Blog
    http://guitar4learners.blogspot.in/

    ReplyDelete
    Replies
    1. Your site looks fine. The one thing I might recommend is uploading a customized banner to make it more personal. You can even just upload a photo cropped in the shape of the banner to add some additional interest.

      Delete
  38. Thank you so much. Our blog now looks more like a professional website, http://fundasinfinance.blogspot.in/

    ReplyDelete
    Replies
    1. Thanks for stopping by. Your blog looks very nice.

      Delete
  39. Thank you so much for this tutorial - everything worked great for me! But I was kind of expecting something to come in my email box that I could directly respond to. How do you handle things once you get the notification? Do you copy and paste their email address from the spreadsheet and send an email? I don't anticipate getting many messages (small blog), but was wondering what you do. Thanks again!

    ReplyDelete
    Replies
    1. Yes, it's a little cumbersome. So far, I don't have such a volume of questions that it's a big deal. Good luck!

      Delete
  40. nice tip to incorporate Contact form into blogger. I just made one using your valuable tip..check at http://www.mastientertainment.in/p/contact-us.html

    ReplyDelete
  41. Hi Sylvia,

    Thank U so much for this article my contact page looks awesome with this....
    U can check it here:
    http://www.dreamiit.in/p/contact-us_21.html

    only thing I am concerned here a bit is how can I get all the things viz. Name,mail and message directly into my inbox instead of opening the spreadsheet all the time...

    ReplyDelete
    Replies
    1. There is a way to do it, though I haven't tried it yet. Go to this Blogger Xpertise post which explains how to do it.

      Delete
  42. Thank you! This is SOOO helpful!

    ReplyDelete
  43. hi! thanks for this. it's so easy to do, i just followed everything you said. :)

    ReplyDelete
  44. Thanks, it helped me create a Contact Page :) - simple and super fast!

    ReplyDelete
  45. Hi, it seems you have got a pretty decent fan following out there. Well anyhow thank-you blogging such a wonderful way to accept responses. But there is still this one thing we have certain limited themes to accept form responses, is there any tweak for that too or I would have to be abase with ones provided by google? For most of them are contrasting to Dynamic Views which I use in my blog.

    Thanks,
    Shalin
    http://bloglovershalin.blogspot.in/

    ReplyDelete
    Replies
    1. Hi Shalin, thanks for your comment. I haven't explored whether there are ways to tweak the comment form. If you figure it out, let me know.

      Delete
  46. Thanks a lot for the help Sylvia! I always wondered how to make these things :p
    But now I know, simple and effective guide :)
    http://helpfuldarkavenger.blogspot.com/p/contact-me.html

    ReplyDelete
  47. This was super helpful. Thank you!

    ReplyDelete
  48. Sylvia thanks so much for you post. :) Very simple form and fast.

    ReplyDelete
  49. its better to make form in jotform Jersey Indonesia .com you gonna check it out...!!!

    ReplyDelete
  50. Thank you for putting this up, I was really struggling to write a contact page and this easy guide really helped!
    Sarah x
    www.alittlespaceforeverything.blogspot.com

    ReplyDelete
    Replies
    1. You're very welcome. Thanks for stopping by.

      Delete
  51. I wish I could hug you!!!
    I am an amateur at creating websites, blogs, etc. and you have made this process SO SIMPLE I just can't thank you enough!! I've used 2 of your tutorials so far and am so proud of what I've accomplished in making my blog function as a website. You are amazing. God bless you.

    :)
    Monique Gaffney
    www.2911Photography.com

    ReplyDelete
    Replies
    1. Thank you so much for stopping by. Glad these are helpful!

      Delete
  52. Thanks a lot. I did this for my business blog www.mohan-arts.co.nr

    ReplyDelete
  53. Hi Sylvia. Thank you very much for the post. Just one tiny question. Why can't I see Submit button at the end of my Contact form? What am I doing wrong? Thanks. Lana www.sweetrevolution.co.nz

    ReplyDelete
    Replies
    1. Hi Svetlana, I could see the button. I send you a message via your contact form.

      Delete
  54. Thanks a ton. I have created a Contact Us form on my blog and it is working. It is so simple and no coding needed. Thanks Sylvia.

    ReplyDelete
  55. Thanks for this wonderful tip.

    Check out my site :)
    www.knowcsgo.com
    Just added the contact me page

    Any more useful tips?

    ReplyDelete
  56. http://tiportweak.blogspot.com/

    ReplyDelete
  57. thank you so much
    http://exploretimes.blogspot.com/

    ReplyDelete
  58. This has been so helpful! Thank you for taking the time to write this.

    ReplyDelete

Join the discussion...