Contact form in Blogger - Add one to your Blog

December 13, 2008

Contact forms are a great way of communication with your readers. They are simple to integrate, simple to use, and quite reliable, too...

• the message from Contact form is redirected to your e-mail (the one you choose) automatically
• it gives your site a warm, but professional look
• you can customize the form to fit your Blog (web page) design

WHERE CAN I GET ONE?
Like always, there a whole bunch of providers, but I'll stick with ones I've used (am using) . They work perfectly.

ZOHO CREATOR
ZOHO is a company with a reputation. And style. They have lots of services to offer, but here, we'll talk about the Zoho Creator.
With them, you are safe. By safe, I mean you don't have to worry about ZOHO breakdown, or sudden disappearance (which is, unfortunately, a case with some other providers I've used...)
- it is highly customizable..
- your current Google (or Yahoo) account works with ZOHO, so there's no need of opening a new one..
- it' free!

To create a Contact Form for your Blog, go to:
Zoho Creator

If you'll have problems figuring out how to do this, take a look at:
video tutorial about integrating ZOHO into Blogger


Email Me Form

This is free online Contact Form Generator. They have practical interface, and it's quite easy to create a form.
1. Create an account at: Email Me Form
2. Sign in, and create a new form using online Form Wizard
3. Fill the required fields (name the form, place your email as a recipient, for the Thank you page you can put your blog URL address, or create one post which will represent a thank you message...)
4. Enter the names for the fields and types (I left this as default)
5. Choose the size of the rows.
6. If you want, apply some text in the form, or change colors....
7. Choose some advanced settings, or just skip to the next step...
8. Preview the form, if you're satisfied, click "Finish", and if you'd like to change something, click "Back"
9. Click on "Get the HTML code"
10. Check Get HTML for displaying the form inside a page on your site
11. Copy the code

WHERE TO PLACE THE CODE?
The idea is to create a "special" page in Blog, the one where we will add our Contact form. Because we're doing this in a Blog, which is constructed a bit different than a regular web site, we have to use some tricks...

1. We will create a normal Post, and add the CODE for the contact form in it.
2. Next thing is to backdate this post (far far in the past). Then Publish it. Doing this, we will prevent it from appearing as a new Post (on the main page).
3. To access this Post go to DASHBOARD --> POSTING --> EDIT POSTS (find the certain post, and click on "View")
4. From the browser's address bar, copy the URL address of this Post --> we will use this address as a Link to Contact Form in our Blog
5. You can place this Link wherever you want (in your sidebar, header....). In my case, I have created a menu on the top, and used this Link under "Contact" (it leads you to a post in which I've placed my code)

With ZOHO, this works all right, because we have embedded code from their site.

But with Email Me Form, we've created a HTML table, and in order to display it properly, we have to add this part of code at the beginning of the Table:

<style type="text/css">.nobrtable br { display: none }</style>
<div class="nobrtable">

...and this UNDER the Table:

</div>

...well, that's it! If you'll need some help about it, just ask...

Smile!