Web Development

How to Create a Facebook Contact Form Using ExpressDB

As Facebook becomes increasingly important for businesses who want to interact with customers online, many business managers are looking for simple ways of adding interactivity to their Facebook marketing campaigns. Ideally, you want to be able to give Facebook users a way to do things like fill out a contact form without being redirected to another website. ExpressDB provides a simple way of accomplishing this.

Note: I came up with this demo app as part of my work with Caspio, the maker of ExpressDB.

ExpressDB is a service of Caspio Inc. that will record the input from any web form with zero database configuration. Just point your form at the ExpressDB service, and you’re done.

To put a form on Facebook, you start by preparing your form as usual, replacing the action tag in the form’s HTML with the one generated by ExpressDB. The ExpressDB forms gallery provides several common types of forms, such as contact and inquiry forms, that you can download and customize. The resulting web page with all formatting should be no more than 700 pixels wide to display properly on Facebook.

Copy the ExpressDB activation code and use it to replace the <form> tag in your HTML

Upload the page to your website and confirm that it works as a stand-alone web form. Next, we’ll turn it into a Facebook app.

Now log into Facebook and visit the developers section. You won’t have to do any programming, but you do need to fill out an online application to register your web form as a Facebook app.

Click on the Set Up an App button. Type in a name for your App, agree to the terms of service, and click Create App.

You now need to add your domain and the address of your web page in a couple of different spots. Facebook expects you to append a query string to the end of the web address, and here we’ve just added ?facebook after our HTML filename. For the domain, you should fill in just the root address without the http part (“” in this example).

Step 1

On the Canvas page, enter the address you’re requesting to be assigned to this application. In this example, we have entered “expressdb-contact” which means the application will be available at

Step 2

Once you have saved these settings, you should be able to navigate to the app page address you established and see your form. Note that there is room in this example to add more branding and promotional copy along with the form. You can also use this web address as the landing page for Facebook advertisements, targeted by interests, affiliations, demographics, and geography.

Your form on Facebook

When a user submits the form, ExpressDB will display either the default confirmation page shown below or a custom confirmation page, if you’ve configured one within ExpressDB.

The ExpressDB confirmation page on Facebook

Learn more at For a richer, but still very easy to use online database environment for creating forms, reports, charts, graphs, mashups, check out Caspio Bridge and the instructions for publishing Caspio apps to Facebook.