Stefan's Weblog

26Mrz/137

Facebook App für die eigene Seite erstellen

Vor ein paar Wochen habe ich für meinen Blog eine eigene Fan-Seite auf Facebook erstellt. Dort habe ich nun mittlerweile ein paar eigene Apps erstellt und eingebunden.
Ich möchte hier kurz aufzeigen, wie ich vorgegangen bin. Wenn jemand eine elegantere Lösung dafür hat, wäre eine kurze Nachricht in den Kommentaren nett.

Apps für Facebook

Apps für Facebook


Ausgangssituation

Bevor ihr eigene Apps entwickeln könnt, sei es für eure private Facebook-Seite oder die Fanpage für euren Blog, müsst ihr euch als Entwickler bei Facebook anmelden. Die Anmeldung geht nur über eure private Seite. Eine Anmeldung via Fan-Seite ist nicht möglich.
Registrieren könnt ihr euch am Ende jeder Facebook-Seite, dort findet sich der Link "Entwickler".

Facebook Entwickler

Facebook Entwickler

Nun gelangt ihr auf die Startseite für die Entwickler.

Facebook Entwickler

Facebook Entwickler

Auf der Seite ist für uns der Reiter "Apps" in der Menüleiste relevant. Klickt darauf und im nachfolgenden Fester könnt ihr eine "Neue ANwendung erstellen"

Facebook - Neue Anwendung erstellen

Facebook - Neue Anwendung erstellen

Gebt im Pop-up einen Namen für die App ein. Den Namen könnt ihr später bei Bedarf jederzeit wieder ändern:

Entwicklung Facebook App

Entwicklung Facebook App

Entwicklung Facebook App

Entwicklung Facebook App

Nach der Eingabe des Captchas gelangt ihr zur Entwicklungsseite. Dort sind zwei Kategorien für uns relevant:

  • Anwendung auf Facebook
  • Seitenreiter
Entwicklung Facebook App

Entwicklung Facebook App

Entwicklung Facebook App

Entwicklung Facebook App

Bevor wir nun mit der Entwicklung weitermachen, ist ein kleiner Exkurs erforderlich.
Facebook bietet seinen Nutzern ein "sicheres Durchstöbern" an, d.h. die Facebook-Seiten werden bei aktivierter Funktion via SSL im Webbrowser der Benutzers dargestellt. Das sichere Surfen erkennt ihr in der URL-Leiste, wenn die Adresse mit https beginnt.
Für den App-Entwickler stellt das u.U. ein kleines Problem dar. Zwar kann man Facebook austricksen und eine normale Seite in die App einschleusen, jedoch wird diese dann für Nutzer die "Sicheres Durchstöbern" aktiviert haben nicht dargestellt.

Da ich auf meinem Blog keine SSL-Verschlüsselung verwende, kann ich also nicht ohne weiteres Seiten in mein Fanpage einbinden. Ich habe deshalb einen Umweg über Google Sites erstellt. Google verwendet nämich standardmäßig für diesen Dienst eine SSL-Verschlüsselung und kann somit in die App eingebunden werden.

Google Sites Webpages lassen sich ganz einfach erstellen und auch für einen unterschiedlichen Personenkreis freigeben. So ist es möglich die Website für die Öffentlichkeit freizugeben und nur für einen kleinen Bekanntenkreis. Die Berechtigungseinstellungen werden auch in Facebook übernommen, was es euch auch ermöglicht für unterschiedliche Personenkreise unterschiedlichen Content auf Facebook bereitzustellen. Voraussetzung ist ein GMail Account und eine gleichzeitige Anmeldung neben Facebook.

Aber nun weiter. Meine Google Sites sieht so aus:

Google Sites

Google Sites


In meiner Seite ist das Twitter Logo eingebunden, dass bei einem Klich darauf auf mein Twitter Profil verlinkt. Das Ziel ist also außerhalb von Facebook, deshalb ist der Link zwingend mit target="_blank" zu versehen. Ohne diesen Befehl bleibt die Seite weiß.

Da ihr nur auch die https-Seite erstellt habt, könnt ihr die URLs in die Facebook App eintragen:

Entwicklung Facebook App

Entwicklung Facebook App

Im Grunde seit ihr nun mit der Entwicklung eurer persönlichen Facebook App fertig. In den anderen Kategorien könnt ihr weitere Informationen angeben, was aber nicht zwingend erforderlich ist.

Entwicklung Facebook App

Entwicklung Facebook App

Zum Einbinden der App auf eurer Facebook Seite benötigt ihr die App ID, die ihr im Reiter "Grundlegendes" findet.

Entwicklung Facebook App

Entwicklung Facebook App

Kopiert euch die ID und klickt auf den Page Generator, der die kinderleichte Einbindung der App auf eurer Seite ermöglicht.
https://apps.facebook.com/pagetabgenerator/

Entwicklung Facebook App

Entwicklung Facebook App

Ein Klick auf die neu generierte URL und ihr müsst nur noch die Seite auswählen auf die die App erscheinen soll:

Entwicklung Facebook App

Entwicklung Facebook App

Das Ergebnis könnt ihr ihr im ersten Screenshot des Artikels sehen.

Möchten andere Personen eure App auch auf ihrer Facebook Seite einbinden, dann braucht ihr ihnen nur die App ID mitteilen und den Link auf den Page Generator. Das Vorgehen ist dann analog, wie oben beschrieben.
Ihr könnt das ja mal mit meiner Twitter App ausprobieren. Die App ID ist: 368821133232558

hat dir dieser Artikel gefallen?

Dann abonniere doch diesen Blog per RSS Feed!

Kommentare (7) Trackbacks (0)
  1. Hallo.Wie mache ich das genau mit dem target=“_blank“ ?

  2. Leider lässt Facebook kein Speichern einer URL zu, die google enthält. Es Kommt die Meldung: Fehler Es trat ein Problem während des Speicherns auf. Bitte versuche es später erneut.Schade, es wäre so schön gewesen!

  3. Hi Sebastian,

    Das sollte nach wie vor aber noch funktionieren. Ich habe das bei mir so realisiert und auch auf anderen Seiten so eingefügt, ohne Probleme.

  4. Also ich schwöre, dass es nicht funktioniert. Speichern geht sofort, wenn ich nur ein o aus der URL nehme. Naja, jetzt hab ich bei RapidSSL ein günstiges Zertifikat geschossen. Hilfreich ist deine Anleitung in jedem Fall trotzdem!

  5. habe das gleiche Problem wie sebastian mit dropbox url, sobald ich nur einen buchstaben ändere gehts…. hat jemand vllt tipps für mich?

  6. Hallo Jeannine,

    Funktioniert evtl. eine Weiterleitung via bit.ly oder einem anderen Dienst?

  7. Toller Artikel, danke fürs Teilen


Leave a comment

Diese Website verwendet Akismet, um Spam zu reduzieren. Erfahre mehr darüber, wie deine Kommentardaten verarbeitet werden .

Noch keine Trackbacks.

%d Bloggern gefällt das: