How to Add Contact Form to a Blogger Page

One way of getting in touch with your visitors is through email. Instead of posting messages in the post comment section which are shown publicly, you and your visitors can have a one on one conversation in private. The visitor will need to fill up the information asked on the contact form, type his personal message and send this to the blog's author. The author will then receive this message in his email inbox.

Google Blogger has already prepared a widget for this contact form, however, the form is limited with details. Some of you maybe looking for a form that you could add or change the fields. 

In this article, I will show you how to do this on your blog.


Step 1. Go to wufoo.com and Signup for free. 

Step 2. Start creating your account by filling in few needed details. Please save a copy of this information in your notes in case you forget them. Click Create Account to proceed.

Step 3. In your wufoo dashboard, go to Forms tab and click New Form.

Step 4. Under Add a Field sub-tab, choose a control from standard or fancy pants, drag one and drop it on the panel next to it. Do the same step until you selected whatever control you want to include in your form.

Step 5. To make changes on how each field looks like and behave, go to Field Settings sub-tab. Select a field on the right panel and set changes on the left panel.

Step 6. To make changes on how each form looks like and behave, go to Form Settings sub-tab. Change the Form name and give a description. Check the Send Confirmation Email to User check box, select email for Send to and type your email address for  Reply to. You 
may change the settings of Limit for Activity tab also.

Step 7. After making your form and setting some changes, click Save Form just below the right panel to save your new form.

Step 8. Choose to go back to the Form Manager.

Step 9. In your Form Manager, go to Notifications found under the first form you created. You will need to enter your email address and Set Reply to as Email to receive the messages sent directly to your email inbox. You can also see the messages sent in your wufoo account inbox. Click Save to proceed.

Step 10. After saving your Notification settings go back to Form Manager. Finally, you can now add your form in your blog. Just click Share button found under the first form you created, scroll down to Advanced Sharing Methods and copy the code for iframe embed code.

Step 11. Go to your Blogger account and click the blog where you want to embed this form. (You need to sign in to your Blogger to access your account.)

Step 12. Click Pages, and click New Page in your blogger dashboard to create new page.

Step 13. Enter your Page tittle, click HTML and paste the code of your wufoo form iframe code. Then click Publish. 

Step 14. Test your page first before making a link to your blog Contact Form menu. Try to send a test message and confirm if you received it by checking your email inbox or wufoo inbox.

 And wait!  You may also paste the code directly to your template gadget. Go to Layout tab.Click Add Gadget > select HTML/ JavaScript gadget. Paste the code and click Save.