Answer Center/Setup

Placing Your Web Form on Facebook

Paul May 09, 2011

       

In order to add the Freedom$oft Facebook Web Form you will first need a Facebook Business Page for your business.

If you don't have one, instructions how to set up a Facebook Business page are here

Step 1: Go to the Facebook Developers site to begin creating your application. Click "Create a New App"  in the upper right-hand corner.

 Create_new_app.jpg

This will take you to a screen that looks like the one below:

 new_app_name.jpg

 

Step 2: Choose a name for your app, read and agree to the Facebook terms, and click "Continue."  

 

Step 3: Fill in the Security field:

 app_security_form.jpg

Step 4: Once redirected to your app's setting page, our one recommendation is to change the icon. Do so by clicking on "edit icon" under

your App Secret. This way an icon of your choosing will show up on your page navigation bar under your page profile picture, instead of the

default iframes icon. For best results, make sure the photo you upload is 16 x 16 pixels.

 

Step 5: Then scroll down to "Page Tab" and click on it. This will open up the "Page Tab" menu for you to fill in.

page_tab.jpg

Step 6: Name your page tab by filling in the "Page Tab Name." (This is the name that will show on your Business page.) Add the url

given to you by FreedomSoft in the Page Tab Url form field like so:

 page_tab_url.jpg

--------------------------------------------------------

To get your own FreedomSoft Page Tab URL, please go to web forms in your setup menu.

1) Click on "create web form"

2) Select buyer Facebook fan page

3) Navigate to the button and click next

4) Now name your web form, choose your autoresponder, and your thank you page. Please be sure to preview your form before creating.

5) Once you're satisfied, please click on "create web form."

6) You will be brought to a page where you can edit the settings, design your form, and publish.

7) Once you're satisfied with your design and your settings, please head to the publish tab.

8) Click on "I will install the web form." A URL in the "iFrame URL Version" should drop down. Please use this URL as your page tab URL.

--------------------------------------------------------

 

You need to enter the whole url in "Page Tab URL". For example:

http://my.freedomsoft.com/webforms/dca4b2b07fa34b04123ef48fd04e7c0a233b82f/facebook.html

You also need to add a "Secure Page Tab URL" by putting a "s" after the "p" in "http://." For example:

https://my.freedomsoft.com/webforms/dca4b2b07fa34b04123ef48fd04e7c0a233b82f7/facebook.html

Do not use the example "Page Tab URL" as your web form will not show.


Step 7: Save Changes

 

Step 8: Open notepad or a similar program. Paste the following URL into Notepad:

https://www.facebook.com/dialog/pagetab?app_id=YOUR_APP_ID&next=YOUR_URL

You will now need to change the "YOUR_URL" and "YOUR_APP_ID."  Replace the YOUR_URL part of the URL above with the same URL you put into the "Secure Page Tab URL" in Step 6. Then replace the YOUR_APP_ID with the App ID from the application you created that contains your page tab information. The id can be found toward the top part of the page:

app_id.jpg

Once you replace the necessary information, your url should look something like the following (both lines combined):

https://www.facebook.com/dialog/pagetab?app_id=28576924855083&next=
https://my.freedomsoft.com/webforms/dca4b2b07fa34b04123ef48fd04e7c0a233b82f7/facebook.html


Step 9: Copy your URL and paste it into the the URL field of your browser. Then click enter and you should

see a dialog box similar to:

add_page_tab.jpg

Choose the Facebook page you would like to add the form to and click "Add Page Tab."

 

Step 10: Go to your business page to test that it works. Your new custom tab will appear in the list under your business page’s profile picture.

All Done!

You can make your custom tab the default landing page by going to ‘edit page’ and clicking ‘manage permissions’ on

the left hand list. From here, use the drop down menu to choose your new application in the default landing tab field.

    

Video Tutorial

To enlarge this video click the full screen button Screen_shot_2011-05-20_at_10.52.41_AM.png

 
Topic is closed for comments