Facebook Cookbook

how to show facebook friends status

facebook status api is still in beta, in one of previous posts hasin showed how to set status of users with their permission. now, let’s see how we can get our facebook friend’s status, in next step i will show a tricky way to get a random person’s status who is not your facebook friend.

first let’s see how we can show our friends status. these following lines of code will return us an array

include_once("config.php");
//i'm using my own id
$user_status= $facebook->api_client->fql_query("SELECT status FROM user WHERE uid =579152077");
echo "<pre>";
print_r($user_status);
echo "</pre>";
//this will return an array like following
Array
(
    [0] => Array
        (
            [status] => Array
                (
                    [message] => is testing facebook status api.
                    [time] => 1234464510
                    [status_id] => 53699066735
                )

        )

)

so we can get any of our facebook friends’ status like this. If no status messages are found, the method returns an empty status_get_response element. now, the thing is, we can check our friends status from “live feed” tab on our home page right? so this status api could be interesting if we can show random friend’s status eh? unfortunately, this current beta API doesn’t support to get any random friends status but for the time being there is a possible way to get status of a person who is not our facebook friends BUT if he/she has at least 1 mutual friend. so let’s find a least possible way to get a random friend’s status who is NOT our friend on facebook but has a mutual friend. don’t worry, you don’t have to know his or her id let’s have a look at following code.

include_once("config.php");
//get id by the random person's full name
$user_details = $facebook->api_client->fql_query("SELECT uid FROM user WHERE name = 'your_random_friend_full_name'");
//if this full name is unique and has a mutual friend with you, you can get his/her id like this...
$user_details[0]['uid'];
//now let's find out the status of that person
$status_array= $facebook->api_client->fql_query("SELECT status FROM user WHERE uid = {$user_details[0]['uid']}");
//now, simply it will return an array with status message like before.

I know this is not the right way to get status. i strongly believe facebook should open this status access to random friends with email id or full name – only then we can expect lot’s of cool application on facebook based on this status api.

how to resize facebook popup dialog box

while developing facebook applications, sometimes we don’t like to use the default facebook popup dialog box, we want to resize/modify to show it on our own way. but how can we do it? we don’t have the css class on our hand right. but don’t worry, we have this simple trick to make it on our own way.

let’s see how we can do it….

first let’s see how a default popup box looks like. let’s print something pretty simple and set a button that will call the javascript function which will create the default popup dialog box. following code will do it for us..

<?php
include_once("config.php");
?>
<input type="button" value="click me" onclick=" return showMe()">
<script language="javascript">
function showMe()
{
   new Dialog().showMessage('Hi There', ' Hi, i\'m a default pop-up, but shh you can play with me!' );
}
</script>

and this will generate a popup like the following screen shot.

Default Dialog Box

now, we want to change this default dialog box right. ok, this default dialog box uses some css classes which can be found using firefox add on firebug. one of them is called “dialog_body” which contains the body of the dialog box. Idea is to overwrite the css class to make it our own let’s change the “dialog_body” class in the following way…

<style>
.dialog_body{
   background-color:#CCCCCC !important;
   font-weight:bold !important;
   font-size:16px;
   text-align:center !important;
   padding-left:0px !important;
   padding-top:10px!important;
   padding-bottom:10px!important;
}
</style>

just set the “!important” to get the priority over the existing properties. now let’s see how out new dialog box looks like ..

Changed Dialog Box

cool eh?
now, how about make this popup dialog box wider than the default size? well, we have that trick too!
this css class called “pop_dialog_table“, which holds the whole dialog box’s div. so increasing it’s width will also increase the size of the dialog box. so let’s do it!

<style>
.pop_dialog_table {
   width: 650px !important;
}
</style>

how this will look like then? have a look at the following screen shot

Wider Dialog Box

simple eh? hope it helps to play with this popup dialog box on your own way!

how to add profile tab for your facebook application

in new facebook design, users can add an application tab in their profile page along with 4 default tabs Wall, Infos, Photos & Boxes. In this tutorial we will see how we can add profile tab for our facebook application.
so, let’s go through couple of simple steps that will get this process done.
first of all, let’s keep something in our mind before we jump into it.

• an application tab is 760 pixels wide. You can make your canvas pages as wide as an application tab if you want.
• each application tab has a label. The labels are text only; a favicon cannot appear on the tab label at this time. by default, the tab uses the application name as the label

now, you have to register an application tab on facebook by specifying a tab URL in your application settings. go to your application settings> Edit Settings, from left nav select “User Profiles” – you there right? In the tab name, give something easy and related to your application name so that user can find it by search. In the second row, you are supposed to see “Tab URL”. In the box just enter a name of your page or the location (i.e. my_tab.php)

save the change and close the window. now create a new page called “my_tab.php”. open the page in your favorite IDE. now, let’s print something pretty simple to make sure our tab is working fine. you can print anything you want or you can copy & paste the following peace of code to see something on your tab page.

<?php $user = $_POST['fb_sig_profile_user'];
?>
hi <fb:name uid=<?=$user;?> linked='true' size='normal' useyou='false' firstnameonly='false'/>, glad to see your profile tab is working!

now, there is a common problem for those who added their profile tab before, they are getting this following message, although it worked before.
“fb:redirect: redirect forbidden by flavor TabFBMLFlavor on the profile tab.”
you are facing the same problem? Don t worry at all. Just check if you have this require log in in your profile tab page
i.e.:

  $user = $facebook->require_login();

if so, just remove it and instead that get the user’s id from “fb_sig_profile_user” parameter.
example:

user = $_POST['fb_sig_profile_user'];

so, to avoid this above problem don’t do the followings…

• do not use $facebook->require_login() for profile tab views
• do not use external javascript libraries for profile tab views

ok, I believe we are done creating a simple profile tab. Now, let’s check whether it’s working or not. go to your profile page and click on the “+” sign under your name. If you don’t see the label of your application then search with the label you gave on your application settings.

you supposed to see the message “hi, your_name, glad to see your profile tab is working! ”

Reference:
http://forum.developers.facebook.com/viewtopic.php?id=23956