This method is deprecated. To view an updated version, click here.
- Professional look, can customize your Facebook tab icon.
- No 3rd party application providers required.
- Can not provide different content for Fans and non-Fans.
- If you choose not to use an SSL version of your form, your form will not be viewable by people browsing Facebook on a secure connection.
1. Click on the a)Form Style tab, b) Click the Form Width icon, and c) Change the width to 520, then Click OK.
2. We need to retrieve your Forms’ ID. One way to do this is to Click on the Setup & Embed toolbar, Click Embed Form, Click Embed and copy that 11 digit Form ID number. You will need this later. My Form ID is: ‘13055750337‘.
We are now ready to put our form on Facebook.
4. Click the Create New App button in the top right hand corner of this page.5. You will be presented with a dialog box. Give your new App a Display Name. You dont need to fill out the App Namespace field.
Complete the captcha in the next dialog box.
6. The first of the two fields we need to concern ourselves with are the App on Facebook field. Click on it.( Remember that 11 digit Form ID number, we retrieved in Step 2 above? We need it now. )For Canvas URL, Enter in: https://www.jotform.com/form/FORM_ID/For Secure Canvas URL, Enter: https://www.jotform.com/form/FORM_ID/
NOTE: the forward slashes at the end of the URL are important. Include them! FORM_ID is that 11 digit number you retrieved in Step 2.
The configuration for my App for the App on Facebook field looks like this:
7. The next field we need to add some information to, is Page Tab.For Page Tab URL, again enter: https://www.jotform.com/form/FORM_ID/For Secure Page Tab URL, as before, https://www.jotform.com/form/FORM_ID( remember those forward slashes! FORM_ID is the 11 digit number from step 2)My configuration for the Page Tab field looks like this:
7.a Make sure the Sandbox is disabled:
The site url set in yourfacebook should also be the same with the url provided by JotForm in your embedcode.
So if for example: the form embed codeis http://jotform.me/form/20643463926456
then http://jotform.me as the site url
and jotform.me as the app domain.
Remember: JotForm Secure(SSL) form submissions limits are counted seperately from standard non-secure submissions.
Click on Save Changes at the bottom of the App configuration page.
Thats it. Your application is configured. Easy isnt it?
8. At the top of your App configuration page. You will see its App ID. Make a note of that number or copy it into a notepad document. .
9. With that App ID, you need to use it to visit a webpage:https://www.facebook.com/dialog/pagetab?app_id=APPID&redirect_uri=http%3A%2F%2Fwww.facebook.com
where APPID is that string of numbers you gathered in Step 8.
e.g for my app above.
10. On this webpage, from the dropdown menu, select which fan page you want to add your Form to and click the Add Page Tab button.
11. How about one last finishing touch? lets change that default application icon, to something more interesting.Back at https://developers.facebook.com/apps You should see your application listed, Click on it, then click Edit App. This takes you back into the Apps configuration page.Near the top, click on the edit icon link.In the resulting dialog box, select Choose File, and find the image you want to use as your icon from your hard drive.
Thats it. All done! You can inspect my finished form on Facebook here