Facebook is the fastest growing social networking application that currently has more than 350 million active users. One of it’s key features is Facebook Platform, that enable us to build applications on Facebook. Currently there are a lot of Facebook applications built by developers around the world such as game, which is the most popular application on Facebook.
This tutorial will guide you through the creation of a Facebook application using Facebook PHP API that will display Hello World text, called Hola Mundo. Before we begin to create Facebook application, there are a few things that you have to know:
- You should be familiar with PHP programming language
- You need to be familiar with web hosting fundamentals and have a place to deploy your application
- You must have a Facebook account
If you have meet the requirements above, you are ready to get started building Facebook application through this tutorial.
A. Setting Up Your Application
- Go to Facebook developers area, and click Set Up New Application button
- Type the application name (Hola Mundo), choose Agree on Facebook Term and then click Create Application button
- Then Facebook will create two keys for your application, the API key and the secret key, write them and save on a file for later use.
- Go to Canvas tab and type a unique URL for your application (hollamundo) on Canvas Page URL, it must be unique or you’ll get error message if the URL has been used by another application. In this case i use hollamundo rather than holamundo because it has been used by another application. On Canvas Callback URL, type the URL for the application page on your server . Choose FBML On Render Method option under Canvas Settings, which enables you to build full Facebook Platform applications that deeply integrate into a user’s Facebook experience. Let another setting options to it’s default then click Save Changes button.
- At this time your application is ready, try to type your Canvas Page URL on browser and see what the results. What you get is an error message because your application doesn’t exists on your server, ok don’t worry, lets go to next steps.
B. Configure Application on Your Host
After configuring your application on Facebook, it’s time to do a little bit coding and some server administration tasks.
- Download Facebook Client Library and extract it, you will find two directories inside, footprints and php. Copy all files from php directory and upload them to your facebook application directory on your server, that must be the same with Canvas Callback URL you set before.
- Create index.php file with the following contents:
<?php include_once 'facebook.php'; $apikey = 'typeyourapikeyhere'; $secretkey = 'typeyoursecretkeyhere'; $fbObj = new Facebook($apikey, $secretkey); $myuid = $fbObj->require_login(); $fbml = "<h2>Hello world, my name is <fb:name uid=\"$myuid\" useyou=\"false\" />," . "welcome to my first facebook application!</h2>"; echo $fbml; ?>
Simple right ? Facebook has made it simple using FBML, all you have to do is apply the predifined tags on your code. You can read the complete explanation about FBML on Facebook Developers Wiki page here .
line 2: include the facebook main library file
line 4&5: define your api key and secret key
line 7: create an instance of Facebook client class
line 8: get your facebook user id (uid), the require_login method is used to force user to logged into Facebook before using the application. If they are not logged in, Facebook will redirect them to Facebook login page first and then brings them to your application page after they logged in.
line 9: your page content’s that display your name using FBML Fb:name tag.
Now your application is complete and ready to be accessed by anyone in the world. Type your Canvas Page URL on browser and you’ll get Allow Access page which is default for Facebook application for the first time access, click Allow button to access your application.
You can view live example application above hereby