1. Dezember 2011

iFrame Apps: Inhalte nur für Fans, Fan Gate erstellen

Die Möglichkeit, Facebook Apps mittels FBML zu programmieren, wurde bereits im Mai 2011 abgeschafft. Zwar konnte man bestehende Apps behalten, kürzlich wurden aber auch diese dicht gemacht. Facebook hat in diesem Jahr auch bei den Gruppen gezeigt, dass man im Falle eines Falles schlicht und ergreifend kurzen Prozess macht. Die Zukunft gehört also den iFrame Apps.

Das hat viele Vorteile. Der größte Vorteil ist wohl die Tatsache, dass man fortan alles als Facebook App in seine Fanpage integrieren kann, was auch auf dem eigenen Server läuft. Will man zum Beispiel eine App zum Generieren von Fans nutzen oder seinen Fans einfach nur exklusive Inhalte bieten (auf die Nicht-Fans keinen Zugriff haben sollen), dann muss man sich um eine sogenannte “Fan Gate” Lösung bemühen.

Auch das ist wie das Programmieren von Apps seit Mai 2011 relativ unkompliziert. Nachfolgend will ich erläutern, wie man Inhalte einer Facebook iFrame App exklusiv nur für seine Fans darstellen kann (und im Gegenzug angepasste Inhalte für diejenigen, die keine Fans sind).

Voraussetzung für die Erstellung einer Facebook App mit Fan Gate ist die Verifizierung des Entwickler Accounts bei Facebook. Das geht via SMS oder Kreditkarte. Ebenfalls notwendig ist ein Webspace, auf dem man PHP ausführen kann.

1. Erstellung einer Facebook App

Ohne eine App, in der man entsprechende Inhalte hat, geht natürlich nichts. Der erste Schritt ist also die Programmierung der App und die anschließende Anmeldung der App bei Facebook selbst.

2. App für Fan Gate vorbereiten

Im nächsten Schritt ruft man die Entwickler Sektion von Facebook auf. Unter “Meine Anwendungen” findet sich die eigene App. Hier wählt man “Einstellungen bearbeiten” und entscheidet sich für die Option “Fortgeschritten”. Dort muss “OAuth 2.0 für Canvasseiten” aktiviert sein.

3. PHP API besorgen

Nun folgt der Download der PHP API, die zwingend notwendig ist, um das Feature “Fan Gate” innerhalb einer Facebook iFrame App zu nutzen. Der Download bringt diverse Dateien, wichtig für die App ist aber nur die “facebook.php”, welche nach dem Download in dem Verzeichnis auf dem eigenen Server abgelegt werden muss, in dem sich auch die App befindet.

4. Quellcode der App ergänzen

Der folgende PHP Code muss zum Quellcode der App hinzugefügt werden. Die Parameter “Anwendungsnummer” und “Anwendungs-Geheimcode” müssen durch die jeweiligen Daten ergänzt werden, die die Übersicht der eigenen App bei den Facebook Developers anzeigt.

<? require(‘facebook.php’);
$app_id = “Anwendungsnummer”;
$app_secret = “Anwendungs-Geheimcode”;
$facebook = new Facebook(array(
‘appId’ => $app_id,
‘secret’ => $app_secret,
‘cookie’ => true
));
$signed_request = $facebook->getSignedRequest();
function parsePageSignedRequest() {
if (isset($_REQUEST['signed_request'])) {
$encoded_sig = null;
$payload = null;
list($encoded_sig, $payload) = explode(‘.’, $_REQUEST['signed_request'], 2);
$sig = base64_decode(strtr($encoded_sig, ‘-_’, ‘+/’));
$data = json_decode(base64_decode(strtr($payload, ‘-_’, ‘+/’), true));
return $data;
}
return false;
}
if($signed_request = parsePageSignedRequest()) {
if($signed_request->page->liked) { ?>
Diesen Inhalt sehen alle Fans
<?php  } else { ?>
Diesen Inhalt sehen alle Nicht-Fans
<?php
}
}
?>

5. iFrame App testen

Hat man nun die Daten für Anwendungsnummer und Anwendungs-Geheimcode eingesetzt, dann müssen natürlich auch die einzelnen Inhalte für Fans und solche, die es noch nicht sind (aber werden sollen) angepasst werden.

Praktisch an der Lösung, Facebook Apps via iFrame zu implementieren ist vor allem, dass man nach dem hier gezeigten Setup praktisch nicht mehr in der App bei Facebook direkt herumbasteln muss. Man kann alle Inhalte bequem und komfortabel auf dem eigenen Server editieren und hier auch aktuelle Anpassungen vornehmen, weil Facebook sich alle Daten direkt von der URL auf dem eigenen Server zieht.

Lust auf noch mehr nützliches Wissen und viele hilfreiche Informationen?

Dann schließ dich jetzt mehr als 3.000 Leserinnen und Lesern an und hol dir meinen exklusiven Newsletter mit vielen funktionierenden Tipps und Tricks, die ich sonst nirgendwo anders veröffentliche. Als Geschenk bekommst du die nützlichen eBooks "Meine 69 besten Linkaufbau Tipps" und "107 tolle Twitter Tipps", die du auf jeden Fall behalten darfst!

Das dürfte dich auch interessieren
Dir hat der Artikel iFrame Apps: Inhalte nur für Fans, Fan Gate erstellen gefallen?
Dann verpass auch in Zukunft keine Neuigkeiten und folge mir jetzt bei Twitter, Google+ oder klick hier und werde mein Fan bei Facebook.
RSS Feed von bjoerntantau.com jetzt abonnieren
Du bist neu hier? Dann abonnier am besten den RSS Feed und verpass keine Updates. Nur als RSS Abonnent bekommst du jeden neuen Artikel sofort und in Echtzeit!
Deine Meinung zu diesem Artikel ist mir wichtig! Schreib einen Kommentar und lass mich und andere wissen, was du denkst.

3 Kommentare zu “iFrame Apps: Inhalte nur für Fans, Fan Gate erstellen”

  1. marcel sagt:

    Danke für das Tutorial.
    Es funktioniert wunderbar, nur kann man irgendwie einstellen, dass der Inhalt für Fans, wenn man auf Gefällt mir geklickt hat, im gleichen Reiter angezeigt wird.

    Jetzt ist es so, dass nach Gefällt mir auf die Pinnwand gesprungen wird und man muss extra auf den anderen Reiter klicken, dass man dann den Inhalt für die Fans ansehen kann.

  2. Rezar sagt:

    Ich finde das Beispiel sehr gut, aber es geht noch viel kürzer und effizienter, wenn ich das hier schreiben darf.

    Wenn man das PHPforFB Framework (phpforfb.com/de/) nutzt, dann hat man einfache eingenschaften, die man per PHP abfragen kann und der Code reduziert sich ebenfalls um einiges.

    In PHPforFB gibt es folgende Eigenschaften bei der Klasse:

    callAsPage : gibt an, ob der Afruf der APP als Page-Exention geschah
    userLikesPage: ob der Nutzer die Page bereits “geliked” hat
    pageID: welche Page die Anwendung aktuell aufgerufen hat
    isPageAdmin : ob der Nutzer auch der FanPage-Besitzer ist

    und je nach true/false variablen werte kann man entsprechend verzweigen oder andere inhalte zeigen.

    @marcel: das geht am besten, wenn die startseite der page die tab ist, in der die app läuft, denn nach jedem like-button klickt, wird die ganze page neu aktualisiert.

  3. [...] Ade Ob das gute alte “Fangate” noch funktionieren wird, man also Besucher via Ads und einem Gate zu Fans konvertieren kann, [...]

Hinterlasse eine Antwort

Google+
Facebook
Twitter
LinkedIn
Pinterest
YouTube
Bekannt aus Presse und TV
Referenzen