FaceBook sharer.php nutzen

Posted by Steffen Rühlmann on Monday, 5 July 2010

Wie sicherlich bekannt ist, bietet Facebook die Möglichkeit Seiten zu "sharen" - dies kann man über Facebook selbst tun ( hierzu genügt es auf der Pinnwand im Feld "Was machst du" einen Link zu posten ) oder über einen selbst erstellten Link..

http://www.facebook.com/sharer.php?u=<url to share>&t=<title of content>

Eigentlich recht einfach - zu beachten ist, dass man die bzw URLencoden muss !
PHP bietet hierfür die Funktion urlencode.
Javascript bieter hierfür die Funktion encodeURIComponent

Facebook kann dann anhand der auf der Seite vorhandenen Bilder entsprechend Thumbnails für den Pinnwandeintrag auslesen - natürlich müssen diese auf der Seite vorhanden sein !
Sofern Bilder vorhanden sind funktioniert dies auch wunderbar - etwas komplizierter wird es, wenn man eigene Thumbs setzen möchte.

Folgender Quelltext muss hierzu in die zu "sharende Seite":

Die im Code aufgeführten Attribute werden nun genutzt um Facebook weitere Infos zum Link "mitzugeben"..
Beispielhaft möchte ich hier das Logo der DrupalCon Copenhagen als Thumbnail für die zu" sharende Seite" setzen:

Die Seite ist hier zu finden http://port11.de/test_share.html

Der Link schaut dann wie folgt aus:
http://www.facebook.com/sharer.php?u=http%3A%2F%2Fwww.port11.de%2Ftest_s...
Die Seite selbst enthält keinerlei Bilder sondern nur einen Text ...

In Aktion findet man das Ganze auf der folgenden Seite http://auf-die-hand.hemelinger-bier.de..

Weitere Informationen gibt es hier:
http://www.netmagazine.com/node/1244 Optimise your website for Facebook
http://www.facebook.com/share/
http://developers.facebook.com/tools/lint ( zur Überprüfung des Markups der Webseiten - hilfreich für Fehlersuche)
http://wiki.developers.facebook.com/index.php/Facebook_Share/Specifying_...

Javascript
Facebook
AnhangGröße
Bild_1.png36.65 KB

Kommentare

joe

19. January 2011 - 13:26

bei mir geht's nicht auf www.party.opteynde.com.
Der Link geht, aber ich bekomme weder mein Bild noch meinen Titel angezeigt.

Steffen Rühlmann

21. January 2011 - 14:02

MIt welchem Browser hast du das getestet ? Ich hab mir hier gerade einmal den Link deiner Seite in Facebook kopiert - unter Google Chrome funktioniert es ohne Probleme - siehe Screenshot http://dl.dropbox.com/u/3062619/Screenshots/nwo~.png

joe

26. January 2011 - 19:24

Danke Steffen,
es funktioniert inzwischen auch bei mir einwandfrei.
Zur Aktualisierung muss man den linter ausführen.
http://developers.facebook.com/tools/lint/
Ich hab danach nicht lang genug gewartet bis facebook upgedated hat.

Philipp

27. January 2011 - 13:02

Danach habe ich stundenlang gesucht!!! Vielen Dank! Funktioniert prima.

Michael

20. February 2011 - 10:34

Hallo...

was muss man denn machen, wenn man von einer seite (in meinem fall www.freshhouse.fm) garnimmer sharen kann?? es kommt immer die fehlermeldung das der beitrag nicht geposted werden konnte, aber laut dem linter ist alles okay.
diesen fehler/bug haben wir nun schon über eine woche :(
kennt jemand dieses problem?

lieber gruss
michael

Steffen Rühlmann

20. February 2011 - 12:29

Ich kann den Fehler auf eurer Seite so nicht nachvollziehen - das sharen der URL selbst funktioniert mit der von mir beschriebenen Methode ohne Probleme. Auch euer Share-Link in den Beiträgen macht keinerlei Probleme. Bei welchen Artikeln treten denn die Fehler auf ? Wie könnte man dies reproduzieren?

Michael

21. February 2011 - 10:54

erstmal danke für die antwort.
also ich habs mal eben versucht. bei sämtlichen artikeln ob news oder sendungen taucht dieser fehler auf. ist sehr sehr komisch, vorallem weils ja neulich noch lief.
bei meinem chef und einigen kollegen, die ihre shows oder die news auch regelmässig auf facebook posten, taucht der fehler auf.
was mir aber rätselhaft ist, das du die links sharen kannst ;-)

Dirk

30. April 2012 - 17:34

Hi...

Die Anleitung und das Ergebnis ist einwandfrei, SUPER!

Aber leider klappt das nicht, wenn ich den Link mit dem iPhone aufrufe sieht das nicht aus wie in deinem Beispiel, sondern so:

http://dl.dropbox.com/u/43258966/SSL/Foto.jpg

Im WEB funktioniert das einwandfrei über Mozilla, iE, Chrome, egal...nur nicht mobile.

Hast Du da eine Idee für, vlt.?

Thx

Steffen Rühlmann

4. May 2012 - 11:35

Hast du das Ganze mal mit dem Test-Link aus dem Beitrag probiert. Beim Test auf einem iPhone gab es keinerlei Probleme - hier wird das Bild korrekt dargestellt.