Tutorials von Thomas Frei-Herrmann
Facebook Plugin als Comments - Datenschutzerklärung
im März 2013
Diese Einträge beziehen sich auf meine “NetObjects Fusion Hilfe Seite” zu NOF auf Facebook.
Wenn Ihr einen “Facebook - Like Box” Plugin auf Eurer Seite einbauen wollt, dann könnt Ihr die Einträge auf einer Seite direkt anzeigen lassen.
Geht dazu zunächst auf diese Seite von Facebook
http://www.facebook.com/
und klickt dann ganz unten auf den Link “Entwickler”. Klickt anschließend in diesem Fenster (oben) auf “Dokumente” und weiter auf
“Social Plugins” und weiter auf “Like Box”.
Dort tragt Ihr die URL der anzuzeigenden Seite ein. Ich habe hier meine Facebook “NetObjects Fusion Hilfe Seite” eingetragen.
Nun könnt Ihr wieder verschiedene Optionen wählen, wie z.B. die Breite bestimmen. Wenn Ihr fertig seid, dann klickt ganz unten auf den Button “Get Code”. Ich habe hier dann die Variante “HTML5” (als Skripte) gewählt
Ihr erhaltet 2 Skripte.
Das obere Skript kopiert Ihr und fügt es in die HTML des Layouts ein.
> Layout markieren > Fenster “Layout-Eigenschaften” > Button “HTML” > “Beginn des Haupttextes”
und den bereitgestellten Code einfügen, der dann so aussieht:
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/de_DE/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Das untere Skript ist ein DIV-Container, den Ihr an beliebiger Stelle in die HTML eines Textfeldes kopiert.
Dazu den bereitgestellten Code in den HTML-Code Editor eines Textfeldes kopieren und fertig.
> Textfeld aufziehen (Cursor blinkt im Textfeld) > im Fenster “Text-Eigenschaften” 2. Button “Textfeld” > Button “HTML” und Code einfügen.
So sieht dieser DIV-Container meiner Seite hier aus, in dem ich meine Seite “NetObjects Fusion Hilfe Seite” als Ziel eingetragen habe:
<div class="fb-like-box" data-href="https://www.facebook.com/NOF.Tutorials" data-width="890" data-show-faces="true" data-stream="true" data-header="true"></div>
Viel Spaß !