Mit einer Landingpage könnt ihr eure Fanseite auf Facebook interessanter und individueller machen. In diesem Beitrag wird euch gezeigt, wie ihr eure eigene Landingpage mit PHP einrichtet und auch den Fanstatus eurer Besucher abfragen könnt.
Landingpages gehören bei Facebook-Fanseiten größerer Unternehmen zur Grundausstattung. Sie animieren dazu, Fan einer Seite zu werden und geben der Fanseite einen individuellen Anstrich. Seitdem Landingpages nicht mehr per Static FBML erstellt werden können, führt der Weg zur Landingpage über einen IFrame.
Der Vorteil: Die Landingpage ist eine beliebige Website, die eingebunden wird. Entsprechend flexibel ist man bei der Gestaltung. Lediglich die Breite von 520 Pixel schränkt die Landingpage ein. Es lassen sich so auch komplexe Funktionen wie zum Beispiel ein Shopsystem in die Fanseite einbinden.
In vielen Fällen offenbaren Landingpages ihren Mehrwert jedoch erst, wenn man Fan einer Seite geworden ist. Die Unterscheidung zwischen Fan und Nicht-Fan einer Seite übermittelt Facebook mittels eines Requests an die im IFrame eingebundene Website. Über PHP lässt sich dieser Request auslesen und für eigene Zwecke verwenden.
Die Landingpage der Facebook-Fanseite von Otto sieht für Fans (re.) anders aus als für Nicht-Fans.
Landingpage über Facebook-Anwendung anlegen
Die Landingpage wird über eine Facebook-Anwendung angelegt, die später einfach in die Fanseite eingebunden wird. Also zuerst eine Facebook-Anwendung erstellen und den App Scretet (zu finden in den Anwendungseinstellungen) notieren. Der wird für das PHP-Script zur Authentifizierung gebraucht.
Unter On Facebook > Canvas Settings muss die Canvas URL (sowie die Secure Canvas URL) angegeben werden. Das ist die URL zu deinem Webprojekt.
Unter Tab URL und Secure Tab URL wird die URL zur Seite eingegeben, die als Landingpage per IFrame auf eurer Fanseite angezeigt werden soll (in diesem Fall eine PHP-Datei). Die Angaben „sicherer URLs“ (also mittels HTTPS) sind zwar nicht zwingend; wenn diese Angaben jedoch fehlen, bekommen Benutzer, die Facebook über eine sichere Verbindung nutzen, eine unschöne Meldung: „Wir können diesen Inhalt nicht anzeigen, solange du Facebook über eine sichere Verbindung nutzt.“
Nun noch einen Tab Name angeben und fertig. Ein eigenes Icon kann hochgeladen werden, muss aber nicht. Das Icon wird dann zusammen mit dem Tab Name in der Navigation der Fanseite angezeigt.
Die erstellte Anwendung kann jetzt auf eurer Fanseite eingebunden werden und taucht dann entsprechend in der Navigation der Seite auf. Dazu die Profilseite der Anwendung aufrufen (unter Related Links) und dann auf Zu meiner Seite hinzufügen auswählen. Die Profilseite der Anwendung ist übrigens für jeden zugänglich, ihr könnt allerdings verhindern, dass Fremde die Anwendung erfolgreich in ihre Fanseite einbauen.
Mit PHP bei Facebook den Fanstatus für Landingpage abfragen
Was Aussehen, Funktionalität und Inhalt eurer Landingpage betrifft, seid ihr frei. Alles, was sich mit HTML, JavaScript, PHP etc. realisieren lässt, könnt ihr machen. Möchtet ihr den Inhalt der Landingpage abhängig davon machen, ob euer Besucher Fan oder Nicht-Fan ist, könnt ihr dies mittels PHP realisieren.
Facebook übermittelt eurer Landingpage dazu den sogenannten SIGNED_REQUEST, der Aufschluss darüber gibt, ob euer Besucher Fan eurer Seite ist, welche Sprache er bei Facebook eingestellt hat und aus welchem Land er kommt.
Ihr fragt den Request mit $_REQUEST["signed_request"] ab und erhaltet einen mittels SHA-256 kodierten Hashwert zur Authentifizierung sowie ein JSON-Objekt. Beides ist durch einen Punkt im Request voneinander getrennt und mittels Base64 kodiert:
$facebook_request = explode(".", $_REQUEST["signed_request"], 2);
$facebook_data = json_decode(base64_decode($facebook_request[1]), true); $facebook_hash = base64_decode(strtr($facebook_request[0], "-_", "+/"));
Die drei Codezeilen extrahieren den Hashwert sowie das JSON-Objekt und übergeben es je einer Variable zur weiteren Verwendung. Um sicherzustellen, dass eure Landingpage nur mit eurer Anwendung funktioniert und sie nicht in eine fremde Anwendung eingebunden wird, könnt ihr mit eurem App Sceret einen Vergleichshashwert erstellen, den ihr anschließend mit dem ersten Hashwert vergleicht. Dazu muss im ersten Wert jedoch eine Zeichenfolge („-_“) ersetzt werden. Sonst klappt es nicht.
Der Vergleichshashwert wird mit dem App Secret als Key (mittels SHA-256) berechnet:
$facebook_secret = 0000000000000000; // App Secret deiner Anwendung
$facebook_hash_app = hash_hmac("sha256", $facebook_request[1],
$facebook_secret, true);
Folgende Abfrage gibt nur dann den richtigen Inhalt aus, wenn beide Hashwerte übereinstimmen, was immer dann der Fall sein wird, wenn die Landingpage über deine Facebook-Anwendung aus aufgerufen wird:
if ($facebook_hash == $facebook_hash_app) {
echo "Die richtige Anwendung versucht, diese Seite aufzurufen.";
} else {
echo "Eine falsche Anwendung versucht, diese Seite aufzurufen.";
}
Wird eure Landingpage nicht über eure Anwendung aus aufgerufen, bekommen Besucher die zweite Meldung zu lesen.
Über eine abgewandelte Abfrage wird geprüft, ob die Landingpage über die richtige Fanseite (mittels der Page ID) aufgerufen wurde und ob der Besucher Fan der Seite ist oder nicht:
if ($facebook_hash == $facebook_hash_app) {
$facebook_page = 00000000; // ID deiner Fanseite
if ($facebook_data["page"]["id"] == $facebook_page &&
$facebook_data["page"]["liked"] == true) {
echo "Du bist Fan dieser Seite.";
} else if ($facebook_data["page"]["id"] == $facebook_page) {
echo "Du bist nicht Fan dieser Seite.";
} else {
echo "Du bist nicht auf der richtigen Fanseite.";
}
} else {
echo "Eine falsche Anwendung versucht, diese Seite aufzurufen.";
}
Durch die Abfragen wird sichergestellt, dass die Landingpage weder von anderen Anwendungen eingesetzt werden kann, noch von anderen Seiten aus aufgerufen werden kann.
Wie haltet ihr es mit Landingpages? Setzt ihr sie für eure Fanseite(n) ein und wenn ja, ist euch eine Fan-/Nicht-Fan-Unterscheidung wichtig?
Landingpages gehören bei Facebook-Fanseiten größerer Unternehmen zur Grundausstattung. Sie animieren dazu, Fan einer Seite zu werden und geben der Fanseite einen individuellen Anstrich. Seitdem Landingpages nicht mehr per Static FBML erstellt werden können, führt der Weg zur Landingpage über einen IFrame.
Der Vorteil: Die Landingpage ist eine beliebige Website, die eingebunden wird. Entsprechend flexibel ist man bei der Gestaltung. Lediglich die Breite von 520 Pixel schränkt die Landingpage ein. Es lassen sich so auch komplexe Funktionen wie zum Beispiel ein Shopsystem in die Fanseite einbinden.
In vielen Fällen offenbaren Landingpages ihren Mehrwert jedoch erst, wenn man Fan einer Seite geworden ist. Die Unterscheidung zwischen Fan und Nicht-Fan einer Seite übermittelt Facebook mittels eines Requests an die im IFrame eingebundene Website. Über PHP lässt sich dieser Request auslesen und für eigene Zwecke verwenden.
Die Landingpage der Facebook-Fanseite von Otto sieht für Fans (re.) anders aus als für Nicht-Fans.
Landingpage über Facebook-Anwendung anlegen
Die Landingpage wird über eine Facebook-Anwendung angelegt, die später einfach in die Fanseite eingebunden wird. Also zuerst eine Facebook-Anwendung erstellen und den App Scretet (zu finden in den Anwendungseinstellungen) notieren. Der wird für das PHP-Script zur Authentifizierung gebraucht.
Unter On Facebook > Canvas Settings muss die Canvas URL (sowie die Secure Canvas URL) angegeben werden. Das ist die URL zu deinem Webprojekt.
Unter Tab URL und Secure Tab URL wird die URL zur Seite eingegeben, die als Landingpage per IFrame auf eurer Fanseite angezeigt werden soll (in diesem Fall eine PHP-Datei). Die Angaben „sicherer URLs“ (also mittels HTTPS) sind zwar nicht zwingend; wenn diese Angaben jedoch fehlen, bekommen Benutzer, die Facebook über eine sichere Verbindung nutzen, eine unschöne Meldung: „Wir können diesen Inhalt nicht anzeigen, solange du Facebook über eine sichere Verbindung nutzt.“
Nun noch einen Tab Name angeben und fertig. Ein eigenes Icon kann hochgeladen werden, muss aber nicht. Das Icon wird dann zusammen mit dem Tab Name in der Navigation der Fanseite angezeigt.
Die erstellte Anwendung kann jetzt auf eurer Fanseite eingebunden werden und taucht dann entsprechend in der Navigation der Seite auf. Dazu die Profilseite der Anwendung aufrufen (unter Related Links) und dann auf Zu meiner Seite hinzufügen auswählen. Die Profilseite der Anwendung ist übrigens für jeden zugänglich, ihr könnt allerdings verhindern, dass Fremde die Anwendung erfolgreich in ihre Fanseite einbauen.
Mit PHP bei Facebook den Fanstatus für Landingpage abfragen
Was Aussehen, Funktionalität und Inhalt eurer Landingpage betrifft, seid ihr frei. Alles, was sich mit HTML, JavaScript, PHP etc. realisieren lässt, könnt ihr machen. Möchtet ihr den Inhalt der Landingpage abhängig davon machen, ob euer Besucher Fan oder Nicht-Fan ist, könnt ihr dies mittels PHP realisieren.
Facebook übermittelt eurer Landingpage dazu den sogenannten SIGNED_REQUEST, der Aufschluss darüber gibt, ob euer Besucher Fan eurer Seite ist, welche Sprache er bei Facebook eingestellt hat und aus welchem Land er kommt.
Ihr fragt den Request mit $_REQUEST["signed_request"] ab und erhaltet einen mittels SHA-256 kodierten Hashwert zur Authentifizierung sowie ein JSON-Objekt. Beides ist durch einen Punkt im Request voneinander getrennt und mittels Base64 kodiert:
$facebook_request = explode(".", $_REQUEST["signed_request"], 2);
$facebook_data = json_decode(base64_decode($facebook_request[1]), true); $facebook_hash = base64_decode(strtr($facebook_request[0], "-_", "+/"));
Die drei Codezeilen extrahieren den Hashwert sowie das JSON-Objekt und übergeben es je einer Variable zur weiteren Verwendung. Um sicherzustellen, dass eure Landingpage nur mit eurer Anwendung funktioniert und sie nicht in eine fremde Anwendung eingebunden wird, könnt ihr mit eurem App Sceret einen Vergleichshashwert erstellen, den ihr anschließend mit dem ersten Hashwert vergleicht. Dazu muss im ersten Wert jedoch eine Zeichenfolge („-_“) ersetzt werden. Sonst klappt es nicht.
Der Vergleichshashwert wird mit dem App Secret als Key (mittels SHA-256) berechnet:
$facebook_secret = 0000000000000000; // App Secret deiner Anwendung
$facebook_hash_app = hash_hmac("sha256", $facebook_request[1],
$facebook_secret, true);
Folgende Abfrage gibt nur dann den richtigen Inhalt aus, wenn beide Hashwerte übereinstimmen, was immer dann der Fall sein wird, wenn die Landingpage über deine Facebook-Anwendung aus aufgerufen wird:
if ($facebook_hash == $facebook_hash_app) {
echo "Die richtige Anwendung versucht, diese Seite aufzurufen.";
} else {
echo "Eine falsche Anwendung versucht, diese Seite aufzurufen.";
}
Wird eure Landingpage nicht über eure Anwendung aus aufgerufen, bekommen Besucher die zweite Meldung zu lesen.
Über eine abgewandelte Abfrage wird geprüft, ob die Landingpage über die richtige Fanseite (mittels der Page ID) aufgerufen wurde und ob der Besucher Fan der Seite ist oder nicht:
if ($facebook_hash == $facebook_hash_app) {
$facebook_page = 00000000; // ID deiner Fanseite
if ($facebook_data["page"]["id"] == $facebook_page &&
$facebook_data["page"]["liked"] == true) {
echo "Du bist Fan dieser Seite.";
} else if ($facebook_data["page"]["id"] == $facebook_page) {
echo "Du bist nicht Fan dieser Seite.";
} else {
echo "Du bist nicht auf der richtigen Fanseite.";
}
} else {
echo "Eine falsche Anwendung versucht, diese Seite aufzurufen.";
}
Durch die Abfragen wird sichergestellt, dass die Landingpage weder von anderen Anwendungen eingesetzt werden kann, noch von anderen Seiten aus aufgerufen werden kann.
Wie haltet ihr es mit Landingpages? Setzt ihr sie für eure Fanseite(n) ein und wenn ja, ist euch eine Fan-/Nicht-Fan-Unterscheidung wichtig?