21
Sep
2010
admin

Facebook IFrame-Anwendungen

Mit IFrame-Anwendungen bietet Facebook uns ein Höchstmaß an Flexibilität für unsere Anwendungen. Im Grunde ist es damit möglich, ganze Webseiten in Facebook zu integrieren, da wir in unseren Technologien und der Art und Weise, wie wir sie nutzen, nicht eingeschränkt werden. So ist es z.B. ohne weiteres möglich, JavaScript in IFrame-Anwendungen zu nutzen.

Im Gegensatz zu FBML-Anwendungen können wir hier, wie gewohnt, komplette Seiten einbinden, inkl. der <html>-, <head>- und <body>-Tags. Allerdings müssen wir hier in der Regel das Styling komplett selbst übernehmen, da wir im Normalfall nicht auf FBML-Elemente zurückgreifen werden. Im Normalfall heißt konkret, dass wir es nicht tun werden, es aber durchaus möglich ist. Durch die JavaScript-Bibliothek können wir unsere IFrame-Anwendung um XFBML (Cross-FBML) erweitern und so FBML-Elemente in einem IFrame nutzen.

Beispiel für die Nutzung von FBML Elementen in einer IFrame-Anwendung:

<html xmlns:fb="http//www.facebook.com/2008/fbml">
  <head>
    <title>Meine Anwendung</title>
  </head>
  <body>
  <div id="fb-root"></div>
  <script>
    window.fbAsyncInit = function() {
      FB.init({appId: 'Anwendungs-ID', status: true, cookie: true,
               xfbml: true});
    };
    (function() {
      var e = document.createElement('script'); e.async = true;
      e.src = document.location.protocol +
        '//connect.facebook.net/de_DE/all.js';
      document.getElementById('fb-root').appendChild(e);
    }());
  </script>
    <fb:serverFbml>
      <script type="text/fbml">
        <fb:fbml>
          <fb:wall>
            <fb:wallpost uid="12345">Das ist ein Pinnwandeintrag von Benutzer 12345</fb:wallpost>
          </fb:wall>
        </fb:fbml>
      </script>
    </fb:serverFbml>
  </body>
</html>

In diesem Beispiel sind es die Zeilen 22-24, die die FBML-Elemente enthalten, welche wir auf unserer Anwendung anzeigen wollen. Rufen wir die Anwendung auf, erhalten wir folgendes Bild:

Hinweis
Eine Beschreibung der hier verwendeten und aller anderen FBML-Elemente findest Du hier.

Trackback-URL für diesen Beitrag

http://www.abouttheweb.de/trackback/574

Ähnliche Artikel

X
Laden