How to Set Up an Iframe App for Facebook to work with WordPress In Blog Plugin

Posted on February 4, 2012 by dhanee — 1 Comment ↓

[one_third]

Step 1
Go to http://facebook.com/developers. If you have not already granted
developers access to your facebook profile you will be asked to do so.
At the top right of the page Choose Set up New App
As per Image Below

[/one_third][one_third]

Step 2
Choose a name for your app and agree
Read Facebook Terms
Agree

[/one_third][one_third_last]

Step 3
Enter Captcha and Submit

[/one_third_last][one_third]

STEP 4
1. Application Name is filled out so just check you are happy with it.
2. Write a description
3. Choose a favicon to go on the fanpage (optional)
4. Choose your language
5. Choose whether you want support to go to a URL or an Email
6. Modify your Address/email for support and contact email accordingly
7. Enter your Privacy Policy URL
8. Add additional users to the app if you want to

[/one_third][one_third]

Step 5
1. Take a note of your application ID for the WordPress post
2. Use the Url of your website (e.g. http://yourdomain.com/fanpage/ (
3. If you have a Secure URL (One with https use that here)
4. Choose Iframe as Canvas Type
5. Choose Auto resize assuming you dont want scroll bars
6. Choose What you Want the Page tab to be called
7. Check this is Iframes…
8. For the Tab URL Enter where you want the page to come from. (This so
for example: www.yourdomain.com/fanpage/tabname
9. Where relevant enter the url you want the secure tab to come from
10. Click Save Your app is complete.

[/one_third][one_third_last]

Step 6
On the right hand side Choose Application Profile Page

[/one_third_last][one_half]

Step 7
On the left hand side of this image you will see Add to my Page and this is what
you need to use to add the app to Facebook.

[/one_half][one_half_last]

Step 8
Choose which of your pages you would like to add your new tab to and you will
now have a menu item on your facebook page which will give you the same
content as you chose to pull it in from in as per Step 5 No. 8
(www.domain.com/fanpage/tabname)

[/one_half_last]

Step 9 – Integrating with WordPress
You now need to go to your wordpress blog and set up a fanpage.
With our plugin once you have installed and activated it you have a new fanpage
section on the site.
It should look something like this:
On the right hand side you will see the fanpage settings where you can choose
the different background colours for the tabs.
This is also where you should put in your App id.
In this plugin three additional tabs have been added. One to add in your custom
autoresponder code. And then two hearts which you can use to show which
parts of the page should be seen when you like a page or stop liking a page.
You would then create and publish the post.
The permalink should look something like what you used within facebook for the
taburl. Ie: http://www.yourdomain.com/fanpage/tabname.
As you get more proficient with this process the time taken to set up fanpages
can be really quite fast!