facebook iFrame-Tabs erstellen

In diesem kleinen Tutorial möchte ich zeigen, wie man iFrame-Tabs erstellt und diese auf der Facebook-Fanpage einbindet, denn obwohl das eigentlich ganz einfach ist und für ganz viele Dinge sinnvoll genutzt werden kann, wird es oft als große Wissenschaft dargestellt (um teure Kurse zu verkaufen?)



Voraussetzung: Um das nachfolgende Tutorial umzusetzen benötigt man eine fanpage und Webspace mit SSL-Zertifikat!

Zunächst erstellt man die Seite(n), die man als iFrame-Tab einbinden möchte und läd diese auf den eigenen Webspace hoch. Ich habe als Beispiel eine Impressum-Seite gewählt, die unter https://jedinski.net/facebook/impressum.html gespeichert ist.

Als nächstes muss man eine App erstellen. Dafür rufe wir https://facebook.com/developers auf. Dort muss man mehrfach die Domain eintragen – meist in zwei Varianten (normal http:// und verschlüsselt https://):

App für FB iFrame-Tab erstellen

Bei Canvas-URL hätte auch der Ordner mit angegeben werden können, also jedinski.net/facebook/ in meinem Beispiel.

Es können auch noch ein Miniaturbild und ein Seitenreiter-Bild hochgeladen werden und die Breite der Seite angegeben werden (früher war 520px die maximale Breite, jetzt können auch 810px breite Seiten verwendet werden)

Nach dem Speichern muss die App noch in die fanpage als Tab aufgenommen werden. Ich habe da nichts in den Menüs gefunden, sondern nur die folgende URL:
https://www.facebook.com/dialog/pagetab?app_id=XXX&display=popup&next=http://facebook.com,
wobei XXX durch die AppID ausgetauscht werden muss. Da mir sowas aber immer zu blöd ist, habe ich eine kleines Tool erstellt, dass nach Eingabe der AppId den facebook-Dialog direkt aufruft:

iFrame-Tab in fanpage einfügen

Im Dialog der sich öffnet, wählt man nun aus seinen fanpages diejenige aus, in die die IframeTab-App eingefügt werden soll. Fertig.

Ich hoffe, das dieses kleine Tutorial ein wenig geholfen hat.

Suchbegriffe, die zu dieser Seite führten:

  • maximale breite facebook iframe (3)
  • facebook iframe maximale breite (3)
  • iframe tab erstellen (2)
  • iframe tab impressum (2)
  • facebook fanpage reiter erstellen (2)
  • facebook fanpage impressum erstellen (2)
  • facebook fanpage iframe erstellen (2)
  • tab auf fanseite einfügen (1)
  • iframe bei facebook tab (1)
  • iframe facebook einfügen (1)

weitersagen - Danke!