Posted on 21 September, 2010 By 2 Comments

How to Create a Simple Contact Form for a Facebook Fan Page

 

It isn’t exactly easy to integrate a website’s contact with Facebook but many people want to collect customer or visitor data via a contact form.

Fortunately, Response-o-matic has created an online tool that makes form creation and integration a snap. Here I will show you how to do this.

 

About

Response-o-matic has free and paid versions. The free version will allow you to create one form and doesn’t include too many extras. The free version also contains an ad. You may want to use the paid version if you have an issue with that. All accounts, however, have the form data stored on their server and is stored on their servers for 6 months. You will receive an email with each form submission but if you want to export the data to a csv file to import into a spreadsheet or database, you will have to upgrade to one of the paid versions.

What To Do

  1. Create an account
  2. You will be sent a confirmation email. Click on the link in the email to confirm the account.
  3. You will immediately be taken to the form builder page.
  4. Start creating the fields you want to include in your form. The form starts you with name and email, which you can keep, delete or move to a new location in the form.
  5. Creating new fields is done on a question/answer model. For example, to create a new field click on the Ask a Question button and then select a question type. By question types they mean a text field, check boxes, radio buttons, etc.

    In this example, I will create a drop down box for favorite types of videogames.

  6. Set whether the field is required and save. Continue until you have created all of the fields that you want. You can always edit the form later, if you want to add or remove a field.
  7. Click the Save and Continue to Step 2 button.
  8. In Step 2 you can set the Form Options. You can have a page that the user returns to after filling out the form. This can be back to the facebook wall, your website, or a thank you page that you have made on your server. A thank you page would probably be best but in this example I’m going to direct the users to my website.
  9. You can also set whether you want to receive an email when there is a new form submission.
  10. Click the Save and Continue to Step 3 button.
  11. On the next page you will have the block of code for your form that you can add to a custom tab on Facebook or to your website.
  12. You can see a quick example on the demo tab of my Facebook fan page.
  13. Of course, you will want to style the form to match the design on your custom fan page tab.
  14. Logging into your Response-o-matic account will show you the form submissions.

Do you think this is useful? I like the idea and it is easy to use but there do seem to be limits to the free version. For example, I would prefer to not have ads and I would like to export the user data. And if someone has a need for managing a lot of user data they are probably already using something like Aweber or Constant Contact, which already provides html code for forms that can be used on a custom Facebook fan page. If you wanted to add a quick and easy contact form, and didn’t mind dealing with the data manually and the ads this solution would just fine.

If you would like to hire me to assist in creating a contact form and styling it, please contact me.

photo credit: NASA Goddard Photo and Video


Thesis Theme for WordPress:  Options Galore and a Helpful Support Community

Keep Reading:
Posted In : Facebook

Did you enjoy this article? I can assist you with your WordPress or Facebook project. Contact me and I will provide you with an estimate. You can also connect with me on Facebook or follow me on Twitter. If you are looking for Hosting, WordPress Theme, Newsletter or other recommendations, please view my detailed list

.


2 Responses to “How to Create a Simple Contact Form for a Facebook Fan Page”

Leave a Comment
You may use: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> .

CommentLuv badge

About

Kim Woodbridge is an accomplished Information and Technical Consultant specializing in the entire implementation of a WordPress based website including installation, theme design, upgrades, unique customizations and ongoing site maintenance.

Recent Comments

    • Fred: Thank you for this post. I am using NGG slideshow in the header of a site and I would like the slideshow to cycle thr...
    • Nick: Has anyone found an app that allows you create a "favorite" (the little box) where it is an image you define and it link...
    • Rajesh: Hey , really great... its help me a lot to fix the issue in IE..... thanks......
    • oliver: Thank you very much. This is exactly the solution I was hoping for....
    • Rick Wolff: I'm considering a graphic design specialization: custom blog post images designed to be eagerly shared on Pinterest. I g...

Wordpress Services

  • Installation, upgrades and maintenance
  • Conversion of existing html and css templates
  • Theme and plugin recommendations
  • CSS customizations
  • Troubleshooting and tweaks for unique situations
  • Customization for individual blogging goals and needs
  • Training and advice