16
Sep
2010
admin

FBML-Anwendungen

Auch wenn Facebook den FBML Support bald einstellt, ist FBML zurzeit leider immer noch die einzige Möglichkeit Anwendungen für Tabs in Facebook-Seiten oder Benutzerprofilen zu erstellen. Aus diesem Grund möchte ich Euch hier die Grundlagen von FBML näher bringen.

Was ist FBML?
FBML (Facebook Markup Language) ist eine Erweiterung von HTML. Es stehen uns damit, zusätzlich zu den HTML-Elementen, weitere Elemente zur Entwicklung zur Verfügung, die sich perfekt an das Facebook Design anpassen.

Was muss ich bei der Entwicklung einer FBML-Anwendung beachten?
Die Anwendung darf nur aus den Teilen bestehen, die vom <body>-Tag umschlossen werden. Es dürfen also weder <html>-Tag noch <head>-Tag (oder die normalerweise im <head>-Tag enthaltenen Tags) benutzt werden. Facebook würde das Nutzen dieser Tags mit einer Fehlermeldung quittieren.

Hinweis
Um in einer FBML-Anwendung JavaScript einsetzen zu können, muss man auf FBJS zurückgreifen. Externes CSS hingegen, kann wie gewohnt eingebunden werden:
<link rel="stylesheet" type="text/css" href="http://www.example.com/style.css">

Ein Beispiel
Die folgende FBML-Anwendung erzeugt ein Formular, welches via HTTP-POST übertragen wird.

<fb:editor action="?do-it" labelwidth="100">
     <fb:editor-text label="Titel" name="title" value=""/>
     <fb:editor-text label="Autor" name="author" value=""/>
     <fb:editor-custom label="Status">
          <select name="state">
               <option value="0" selected>gelesen</option>
               <option value="1">werde ich noch lesen</option>
          </select>
     </fb:editor-custom>
     <fb:editor-textarea label="Kommentar" name="comment"/>
     <fb:editor-buttonset>
          <fb:editor-button value="Speichern"/>
          <fb:editor-cancel />
     </fb:editor-buttonset>
</fb:editor>

Ruft man diese Anwendung auf, erhält man folgende Ausgabe:

Dank FBML müssen wir uns nicht um das Aussehen unserer Anwendung kümmern. Die FBML-Elemente erscheinen standardmäßig im Look and Feel von Facebook. Eine vollständige Liste der FBML-Elemente gibt es hier.

Ähnliche Artikel

X
Laden