Latest Updates: Facebook Connect RSS

  • Post to Facebook with Javascript SDK

    Ellen 13:55 on December 21, 2010 | 0 Permalink
    Tags: , Facebook Connect, ,

    Posting a message to someones wall can contain the following parameters:

    var my_message = ‘This is just a test!’;
    var url = ‘http://www.sundh.com/’;
    var title = ‘This is the name of my post’;
    var desc = ‘Optional description of my link’;
    var picUrl = ‘http://www.sundh.com/blog/images/led.jpg’;

    To post the following to my wall this javascript code is executed:

    FB.api(‘/me/feed’, ‘post’, {message:my_message,link:url,name:title,picture:picUrl,description:desc },
    function(response) {
    if (!response || response.error) {
    alert(‘Error occured’);
    } else {
    alert(‘Post ID: ‘ + response.id);
    }
    });

    If I decided to not define the parameter “description” the post will grab the text appearing on the URL.
    facebook_post

    Youtube clip

    Posting a YouTube clip to someone’s wall requires a little bit different code in order to be able to play the YouTube clip within Facebook. Note that the URL to the YouTube clip is different from the URL shown in the browser when you watch the clip. Instead of “http://www.youtube.com/watch?v=VIDEO_ID”, it is set to “http://www.youtube.com/v/VIDEO_ID”. The thumbnail of the YouTube clips is easly retreived by accesing the URL “http://img.youtube.com/vi/VIDEO_ID/0.jpg”.

    var my_message = ‘My message here’;
    var url = ‘http://www.youtube.com/v/VIDEO_ID’;
    var title = ‘Title of YouTube clip’;
    var desc = ‘Description of YouTube clip’;
    var picUrl = ‘http://img.youtube.com/vi/VIDEO_ID/0.jpg’;

    The trick that makes the YouTube clip embeddable on Facebook is to add the parameter “source” in you API call to Facebook. The source is the same as the URL to the video clip.

    FB.api(‘/me/feed’, ‘post’, {message:my_message,link:url,name:title,picture:picUrl,source:url,description:desc }, function(response) {
          if (!response || response.error) {
            alert(‘Error occured’);
          } else {
            alert(‘Post ID: ‘ + response.id);
          }
        });

    The result looks like this:
    facebook_youtube

  • Facebook Connect: Only for grown ups

    Ellen 13:03 on February 6, 2010 | 0 Permalink | Reply
    Tags: Facebook Connect,

    In some Facebook Connect apps you might want to target an older audience. Any Facebook user is required to fill in their date of birth so the birthday field of the profile can be a way to check that your user has the appriopriate age for your application. This can be done by checking the birthday date of the user (birthday_date) using the function

    users_getInfo($uid, ‘birthday_date’).

    birhtdate

    Important to remember though is that if the Facebook user has chosen not to show the birth year, this will not be available for the Facebook Connect application. To determine that the Facebook user has the appropriate age her settings on Facebook must look as follows:

  • Facebook Connect: No server-side needed

    Ellen 17:27 on January 15, 2010 | 1 Permalink | Reply
    Tags: Facebook Connect,

    With the Facebook Connect API comes javascript functionality. This means no server-side scripting needed. You can create your application on Facebook and connect to it from your website thought javascript. Use the API Key and Secret Key to connect to you application. Make sure your callback URL is set on Facebook to be the URL of the page you are connecting from.

    Create your customized Facebook Connect login button through this wizard. Paste in the code into your site.

    Enabling calls to the javascript API on Facebook:

    <script src=”http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/sv_SE” type=”text/javascript”></script>

    Generating the login button on your site:

    <fb:login-button v=”2″ size=”medium” onlogin=”window.location.reload(true);”>Log in to Facebook Connect</fb:login-button>

    The Facebook Connect login will appear in a pop-up window. When successfully logged in, the window closes and your main page reloads.

    The output
    In the Javascript function FB.ensureInit you can then put in your API calls and generate your HTML from that. Below is an example of showing selected information from a user’s profile.

    <script type=”text/javascript”>
    var widget_div = document.getElementById(”profile_pics”);
    FB.ensureInit(function () {
    FB.Facebook.get_sessionState().waitUntilReady(function() {
      var session = FB.Facebook.apiClient.get_session();
      FB.Facebook.apiClient.users_getInfo([session.uid], ["about_me","books","interests","movies","music",
    "religion","tv","quotes","education_history","political","sex","meeting_for"],
    function(result) {
      var markup = “”;
      for(var o in result[0]) {
      markup += “<br>” + o + ” : ” + result[0][o];
    }
    widget_div.innerHTML = markup;
    FB.XFBML.Host.parseDomElement(widget_div);
    });
    });
    });
    </script>

  • Add Facebook Connect to your blog comments

    Ellen 11:09 on December 15, 2009 | 0 Permalink | Reply
    Tags: comments, , Facebook Connect,

    This neat video explains how you can add Facebook Connect to your blog and let users add comments by logging into Facebook Connect! No server-side scripting needed!

c
compose new post
j
next post/next comment
k
previous post/previous comment
r
reply
e
edit
o
show/hide comments
t
go to top
esc
cancel