Hier erhaltet ihr ein Update für unseren vorherigen Artikel „Facebook Markup Language in validem XHTML 1.1„. Nun gibt es eine wesentlich vereinfachte Technik. Außerdem wird nur noch eine JavaScript Datei benötigt.
Wir gehen wieder davon aus, dass ihr die Social-Plugins von Facebook schon erfolgreich eingerichtet habt. Weitere Informationen dazu findet ihr hier: Facebook Developers Soziale Plug-ins.
Da dies ein Update des vorherigen Artikels ist, bezieht sich diese Anleitung natürlich wieder auf die Social-Plugins die per FBML (Facebook Markup Language) eingebunden und mittels des JavaScript SDK gerendert werden.
Update
Es ist eine neue Version mit verbesserter Technik, geringerer Dateigröße und vereinfachter Integration verfügbar. Nutze diesen Artikel und somit die neue Technik: Facebook XFBML in validem XHTML 1.1 – Version 4.0.
Die neue Funktion
Wir binden die Social-Plugins innerhalb eines bestimmten HTML-Kommentares ein (dieses dient als Marker). Dazu wird wie gewohnt ein Script am Ende der Seite eingebunden welches diese Kommentare entfernt und somit die Social-Plugins sichtbar macht.
Mit dieser Technik benötigen wir nur noch eine 457 Byte große JavaScript Datei.
So geht’s
Wir benötigen wieder die fbObjectValidationV2.js, diesmal in Version 2.
Diese binden wir am Ende unserer Seite (vor dem schließenden Body-Tag </body> ein). Und zwar so (Pfad zur Datei ggf. anpassen):
... <script type="text/javascript" src="js/fbObjectValidationV2.js"></script> </body> </html>
Nun können wir die Social-Plugins wie folgt in unser HTML Dokument einbinden. Hier wieder ein Beispiel mit dem beliebten Like-Button („Gefällt mir“-Button):
<!-- FBML <fb:like layout="standard" show_faces="false" colorscheme="light"></fb:like> FBML -->
Die Vorteile dieser neuen Technik:
- nur noch eine kleine JavaScript Datei (457 Byte)
- es müssen keine zusätzlichen HTML-Tags eingebunden werden
- lediglich ein HTML-Kommentar mit dem Social-Plugin darin
Auf diese Weise lassen sich nun alle Facebook Plugins XHTML valide per FBML und dem JavaScript SDK einbinden. Darunter beispielsweise:
- Teilen Button (Share Button)
- Gefällt mir (Like Button)
- Empfehlen (Recommend Button)
- Fanpage
Rechtliches
Das Script kann privat sowie kommerziell frei integriert und modifiziert werden. Die Verbreitung und Veröffentlichung ist ohne schriftliche Genehmigung nicht zulässig.
Vielen Dank!
