UPDATED: We have an updated Tutorial for Embedding SWF’s into Facebook. Please refer to this new page.

Happy Streaming!

~Influxis Team

Many social networking sites allow you to directly embed a Flash (SWF) file onto your profile or blog including Facebook, but the process for Facebook is a bit different.

The only way to add a SWF to Facebook is on a “Page,” i.e. Fan Page, or Business Page.  These are Public profile pages because no privacy settings can be defined and are open to everyone.

The first step of this process is to create a page:

http://www.facebook.com/pages/create.php

After you have created the page, click on the “Edit Page” tab.  Once here scroll down through “Applications” and click on “Static FBML,” click add, then press the “Add to My Page” button.

Once this is done go back to your page and click the “Edit Page” button again.  If you scroll down you will see the new application “FBML” and click “Edit.”  This is where you can add the title of your SWF and add the embed code.

The embed code will need to be set up according to Facebook’s outline.  The code is similar ““ at least in structure ““ to standard <object> <embed> code used in HTML. There are, however, more specific attributes that must be used.  The only necessary attribute is swfsrc ““ which defines the URL that points to your SWF file.  For more information on this here is a link to their developer page:

http://wiki.developers.facebook.com/index.php/Fb:swf

Here is the basic embed code for our tv2beta application with a few variables added:

<fb:swf
swfbgcolor="000000"

swfsrc='http://66.135.33.137/apps/hhrtzasokq0urnka5ppa/tv2beta/tvstation_viewer_v2.swf'

imgsrc="http://labs.influxis.com/vidtuts/Influxis.jpg"

flashvars='RTMP=rtmp://XXXXXXX.rtmphost.com/tv2beta'

width='700px'

height='600px'

waitforclick='true'

/>

Once you have saved the page you can go back to your profile and add a “Tab” (Wall, Info, Photos, etc.) to link it to your FBML application.

SWF files are initially inactive. The user must click on the SWF in order to activate it. You can define an image file in the FBML code that displays a static image that the user can click on to initialize the SWF file.

We hope that this helps all you Facbookers and if you have any questions, please feel free to ask.

Sample

11 Responses to “Embedding SWF’s in Facebook”

  1. mike d

    What’s the max width of the swf you can embed, there seems to be talk of 520px being the new fan page max width, but I can see plenty that are obviously a lot wider. The old width was 760 which seems a lot more sensible.

    Reply
  2. curtis

    Facebook has lowered their Fan Page size from 760px to 520px as far as we know.

    Reply
  3. Scott B

    I get a connection failed message…whether I am broadcasting the app or not. Even basic code of yours gives same result before I change parameters to point to my channel.

    Reply
  4. curtis

    Hello Scott,

    We were able to replicate the problem on your Facebook page. We believe it may be an issue with how you are defining the rtmp path:

    RTMP=rtmp://66.135.33.137/tv2beta”

    The rtmp connection path should be pointing at your Influxis account not, our web server IP (66.135.33.137).

    To further investigate we would ask that you contact support@influxis.com.

    Reply
  5. Richard Cairns

    Dam facebook, I will try convert the swf to a flv and upload to my wall.

    Reply
  6. violet

    Hi,

    if I want to embed a swf file into fbml, do I have to have an own homepage, on which my swf is uploaded, so that I link the swf from there, or is it possible to link it from a swf hoster?

    Thanks for your help!!!

    Reply
  7. Kada Mati

    Hi, i m not that expert so my question might be foolish a bit.

    Where should i upload the swf ? It is surely not going to be working if i put the source directory path from my hard drive!

    Please tell..

    Reply
  8. Pete Marriott

    Hmmm….this doesn’t look like a good match for Facebook. Is there a way to just let the player standalone without video cue in the right panel showing?

    Reply
  9. Webtv

    hola todavia podemos ponerlo en facebook

    Reply
  10. FaceCodes

    sorry i have forget another thing…it is allso possible to poast to the timeline an mp3…
    see you guys !

    Reply

Leave a Reply to Richard Cairns

Click here to cancel reply.

Current day month ye@r *