Wie man einen Facebook-Like-Button und -Share-Button einbindet

Der Facebook-Like-Button, auch als Gefällt-mir-Button bekannt, begegnet einem längst nicht mehr nur in dem sozialen Netzwerk. Die berühmte Schalt­flä­che ziert auch diverse Websites, Blogs und Web-Apps, sodass Besucher zeigen können, dass ihnen bei­spiels­wei­se ein Un­ter­neh­men, eine Be­rühmt­heit oder ein be­stimm­ter Inhalt gefällt. Mithilfe des Facebook-Share-Buttons können Inhalte, die man in­ter­es­sant oder un­ter­halt­sam findet, dann auch mit dem Freun­des­kreis geteilt werden – noch schneller lassen sich Marken, Nach­rich­ten oder Beiträge im Netz nur schwer ver­brei­ten. Doch was steckt ei­gent­lich genau hinter den Social-Media-Schalt­flä­chen, deren Ein­bin­dung für Web­sei­ten­be­trei­ber quasi zum Pflicht­pro­gramm geworden ist? Wir geben Infos und zeigen, wie Sie Ihre eigenen Facebook-Buttons erstellen. Darüber hinaus erklären wir in diesem Ratgeber, warum die Stan­dard­im­ple­men­tie­rung solcher Like-Buttons in Deutsch­land rechtlich pro­ble­ma­tisch ist und auf welche Al­ter­na­ti­ven Sie statt­des­sen zu­rück­grei­fen können.

Der Like- und der Share-Button gehören zu den zentralen Elementen von Facebook. Die Schalt­flä­chen, die im Laufe der Jahre zahl­rei­che optische An­pas­sun­gen erfahren haben, sind die Trieb­fe­dern der User-Ver­net­zung und der Ver­brei­tung von Inhalten. Jüngere soziale Netzwerke haben das Konzept längst auf­ge­grif­fen und ähnliche Buttons eingebaut. Seit 2010 ist es möglich, die beiden Schalt­flä­chen auch in Web­pro­jek­te außerhalb von Facebook ein­zu­bin­den. Zu diesem Zweck stellt der Web-Riese eigene Social-Plug-ins zur Verfügung, deren Im­ple­men­tie­rung keine große Sache ist: Dank des haus­ei­ge­nen Kon­fi­gu­ra­tors sind diese auf Ihr Web­pro­jekt ab­ge­stimmt und sowohl als iFrame als auch als Ja­va­Script-Anwendung verfügbar. Für viele Content-Ma­nage­ment-Systeme – wie bei­spiels­wei­se WordPress – exis­tie­ren darüber hinaus passende Er­wei­te­run­gen, die Sie bei der Ein­bin­dung un­ter­stüt­zen.

Soziale Netzwerke sind die perfekten Kanäle, um eigene Inhalte zu ver­brei­ten und dabei den direkten Kontakt zu Kunden, Lesern oder Fans zu pflegen. Facebook bietet dafür mit den erwähnten Like- und Share-Funk­tio­nen sowie der Kom­men­tar­mög­lich­keit die perfekte Basis. Solche Rück­mel­dun­gen der Nutzer, die man auch als Social Signals be­zeich­net, spielen aus mehreren Gründen eine tragende Rolle für den Erfolg im modernen Web:

• Je mehr Re­ak­tio­nen Ihre Beiträge erzeugen, desto größer ist die Chance, dass andere Autoren, Blogger oder auch Pri­vat­us­er den Inhalt auf­grei­fen und auf Ihr Web­pro­jekt verlinken. So erhalten Sie wertvolle, the­men­re­le­van­te Backlinks, die Ihr Such­ma­schi­nen­ran­king positiv be­ein­flus­sen.

• Backlinks, Er­wäh­nun­gen und Gefällt-mir-Angaben erhöhen Ihre Reich­wei­te und Ihre Autorität hin­sicht­lich re­le­van­ter Keywords. Das ist ei­ner­seits von Vorteil bei der Ge­ne­rie­rung neuer Kunden, Leser oder Fans. An­de­rer­seits wirkt es sich wahr­schein­lich auch allgemein positiv auf das Standing Ihres Web­auf­tritts aus.

• Lang­fris­tig spiegeln sich positive Social Signals auch in einem Traffic-Wachstum wider – ein weiterer Punkt, der Ihnen zu einem besseren Ranking in den Such­ergeb­nis­sen verhilft.

Auch wenn die Nut­zer­si­gna­le nicht zu den direkten Ran­king­fak­to­ren bei Google und Co. zählen, können Sie die Plat­zie­rung in den Such­ma­schi­nen durchaus positiv be­ein­flus­sen. Die Grund­vor­aus­set­zung ist hoch­wer­ti­ger, in­for­ma­ti­ver Content, der zum Teilen, Liken und Kom­men­tie­ren anregt: Ein­ge­bun­de­ne Gefällt-mir-Buttons und Facebook-Share-Buttons außerhalb des sozialen Netzwerks helfen dabei, diese Inhalte zu ver­brei­ten.

Den Facebook-Share-Button müssen Sie nicht unbedingt im Paket mit dem Gefällt-mir-Button erstellen: Wählen Sie einfach den Menüpunkt Button „Teilen“ und ge­ne­rie­ren den Social-Button in gleicher Weise wie die Gefällt-mir-Schalt­flä­che mithilfe des of­fe­rier­ten Kon­fi­gu­ra­tors.

Es macht einen Un­ter­schied, ob Sie die Facebook-Buttons in Form eines iFrames oder als Ja­va­Script-Anwendung in Ihr Web­pro­jekt einbinden, auch wenn sich beide Versionen in ihrer Grund­funk­ti­on sehr ähneln: Da beide Social-Plug-ins von Facebook gehostet werden, erkennt das soziale Netzwerk au­to­ma­tisch, ob der Nutzer ein­ge­loggt ist und spielt im zu­tref­fen­den Fall eine per­so­na­li­sier­te Form der Buttons aus. Im Falle des iFrames handelt es sich dabei um eine Liste aller Freunde des Besuchers (inklusive Pro­fil­bil­der), denen die Website oder der Beitrag ebenfalls gefallen hat. Ist er nicht ein­ge­loggt oder besitzt eventuell gar keinen Account, erscheint au­to­ma­tisch eine Auf­for­de­rung bzw. Einladung, sich ein­zu­log­gen bzw. zu re­gis­trie­ren. Das Ja­va­Script-Plug-in gewährt dem User darüber hinaus auch die Mög­lich­keit, einen Kommentar hin­zu­zu­fü­gen, wenn er auf den Gefällt-mir-Button klickt. Im Gegensatz zum iFrame, das ein einzelnes HTML-Element ist, setzt die Ja­va­Script-Variante zu­sätz­lich zur Button-Codezeile auch die Ein­bin­dung des Facebook-SDKs voraus. Auch die Auf­for­de­rung zur Anmeldung bei dem sozialen Netzwerk in­te­grie­ren Sie in diesem Fall mithilfe des leis­tungs­star­ken Ent­wick­ler-Kits. Damit Facebook die per­so­na­li­sier­ten Buttons aus­spie­len kann, kon­tak­tiert der Browser des Nutzers au­to­ma­tisch die Server des Groß­kon­zerns. Wenn dieser in dem sozialen Netzwerk an­ge­mel­det ist bzw. zuvor an­ge­mel­det war und eine Seite mit ein­ge­bun­de­nem Social-Plug-in aufruft, kann er sogar eindeutig iden­ti­fi­ziert werden. Das bedeutet aber auch, dass Facebook ver­schie­de­ne In­for­ma­tio­nen – wie bei­spiels­wei­se Zu­griffs­zeit­punkt, Nutzer-ID oder In­for­ma­tio­nen über den ver­wen­de­ten Browser und sogar die IP-Adresse – erhält. Das ame­ri­ka­ni­sche Un­ter­neh­men behält sich vor, diese ge­sam­mel­ten Daten zur Ver­bes­se­rung der eigenen Produkte und Dienste sowie zur Op­ti­mie­rung der aus­ge­spiel­ten Wer­be­an­zei­gen zu speichern und zu nutzen. Dieser Umstand hat im März 2016 zu einem ersten Urteil des Land­ge­richts Düs­sel­dorf geführt, welches das klas­si­sche Ein­bin­dungs­ver­fah­ren des Facebook-Like-Buttons und anderer Social-Plug-ins für rechts­wid­rig erklärt.

Kläger des Prozesses, der zu dem erwähnten Urteil führte, war die Ver­brau­cher­schutz­zen­tra­le NRW – seines Zeichens ein­ge­tra­ge­ner Verein zur In­ter­es­sens­ver­tre­tung von Ver­brau­chern. Der Satzung nach gehört es zur Haupt­auf­ga­be des Ver­brau­cher­ver­ban­des, Verstöße gegen das Wett­be­werbs­recht oder das AGB-Recht zu ahnden, indem er ge­richt­li­che Maßnahmen einleitet. Im Fall des Facebook-Plug-in-Prozesses richtete sich die Klage gegen die Fashion ID GmbH & Co. KG, eine Toch­ter­fir­ma des Be­klei­dungs­händ­lers Peek & Clop­pen­burg. Der zentrale Punkt der Anklage: Die Art der Ein­bin­dung des Like-Buttons auf der un­ter­neh­mens­ei­ge­nen Shop-Seite fashionid.de. Hier hatte man sich für die bereits vor­ge­stell­te Social-Plug-in-Variante ent­schie­den und einen Gefällt-mir-Button via iFrame ein­ge­bun­den. Da man sich der Da­ten­über­mitt­lung und den recht­li­chen Schwie­rig­kei­ten durchaus bewusst war, sollte die Nutzung des Plug-ins in der von jeder Seite aus er­reich­ba­ren Da­ten­schutz­er­klä­rung ab­ge­si­chert werden: Hier klärte die Fashion ID GmbH den Nutzern über den Einsatz des Facebook-Codes und die damit ver­bun­de­ne Da­ten­spei­che­rung auf. Zu­sätz­lich sprach das Un­ter­neh­men die Emp­feh­lung aus, sich bei Facebook aus­zu­log­gen sowie einen so­ge­nann­ten Facebook-Blocker ein­zu­set­zen, eine Browser-Er­wei­te­rung zum De­ak­ti­vie­ren der Social-Plug-ins des sozialen Netzwerks. Für die Ver­brau­cher­schutz­zen­tra­le NRW waren diese Be­mü­hun­gen jedoch alles andere als zu­frie­den­stel­lend, wobei sie vor allem vier Punkte in der Klage anführte:

• Der Gefällt-mir-Button dient lediglich Wer­be­zwe­cken.

• Die Über­mitt­lung der IP-Adresse, die das Erkennen eines Nutzers er­mög­licht, ist ohne Ein­wil­li­gung un­zu­läs­sig.

• Die Da­ten­schutz­er­klä­rung erfolgt nicht im Vorhinein und erklärt die Ar­beits­wei­se und Da­ten­ver­wen­dung des Plug-ins nicht aus­rei­chend.

• Die In­for­ma­tio­nen über mögliche Maßnahmen sind teilweise un­zu­tref­fend, da das Ausloggen aus dem sozialen Netzwerk bei vor­he­ri­ger Ab­spei­che­rung des Cookies nicht genügt.

Das Land­ge­richt Düs­sel­dorf gab dem Ver­brau­cher­ver­band Recht und legte den Fokus bei seiner Ent­schei­dungs­be­grün­dung vor allem auf den ein­deu­ti­gen Per­so­nen­be­zug, der mit den über­mit­tel­ten Daten ein­her­geht. Ferner stimmte das Gericht zu, dass die Fashion ID GmbH der In­for­ma­ti­ons­pflicht nach dem Te­le­me­di­en­ge­setz (Paragraph 13 Absatz 2) nicht aus­rei­chend nach­ge­kom­men ist: Weder holte das Mo­de­un­ter­neh­men eine Ein­wil­li­gung von den Nutzern ein, noch geschah die In­for­mie­rung über die Erhebung der Daten, bevor das Facebook-Plug-in diese gesammelt und wei­ter­ge­lei­tet hat. Bereits vor der Ver­kün­dung des Urteils, das für die Fashion ID GmbH mit Kosten von rund 13.000 Euro verbunden war, hatte man die stan­dard­mä­ßi­ge Schalt­flä­che durch eine so­ge­nann­te 2-Klick-Lösung ersetzt. Hierbei muss der Website-Besucher nun zunächst die Social-Plug-ins ak­ti­vie­ren, bevor er im nächsten Schritt seine Zu­stim­mung per Klick auf „Gefällt mir“ aus­drü­cken kann. Die komplette Abschrift des Urteils können Sie im Übrigen in der folgenden, von der Ver­brau­cher­zen­tra­le NRW ver­öf­fent­lich­ten PDF-Datei nachlesen.

Obwohl der Umstieg auf eine 2-Klick-Lösung bereits während der laufenden Ge­richts­ver­hand­lung geschah, machte das Gericht diese nicht zum Ge­gen­stand des Ver­fah­rens. Somit fehlt für diesen Weg, Share- und Like-Buttons ein­zu­bau­en, bis dato auch noch jegliche ge­richt­li­che Po­si­tio­nie­rung. Fakt ist, dass diese Im­ple­men­tie­run­gen einen Teil der ge­for­der­ten Be­din­gun­gen erfüllen: Dem ei­gent­li­chen Plug-in wird eine In­for­ma­ti­ons­sei­te vor­ge­schal­tet, wodurch der Web­sei­ten­be­trei­ber ei­ner­seits seiner In­for­ma­ti­ons­pflicht nachkommt und an­de­rer­seits die sofortige Wei­ter­ga­be per­sön­li­cher Daten an Facebook ver­hin­dert wird.

Heise ent­wi­ckel­te zu diesem Zweck bereits 2011 eine erste Version eines der­ar­ti­gen Konzeptes, bei dem die Buttons zunächst immer de­ak­ti­viert geladen und erst nach Ak­ti­vie­rung genutzt werden konnten. Der Nutzer hat in diesem Fall selbst in der Hand, ob er In­for­ma­tio­nen an Facebook wei­ter­lei­ten möchte oder nicht – denn nur, wenn er die Funktion aktiviert, kann er von dem Gefällt mir-Button Gebrauch machen oder den Inhalt teilen. Vor­aus­set­zung ist, dass ein passender In­for­ma­ti­ons­text prä­sen­tiert wird, der gut sichtbar ist und aus­rei­chend über die Da­ten­wei­ter­ga­be in­for­miert. Doch auch die 2-Klick-Lösung ver­spricht keine absolute Rechts­si­cher­heit. Der bereits auf­ge­grif­fe­ne Paragraph 13 des Te­le­me­di­en­ge­set­zes sieht in Abschnitt 2 zu­sätz­lich auch vor, dass die Ein­ver­ständ­nis­er­klä­rung des Nutzers auch pro­to­kol­liert wird. Zudem wirkt sich die Not­wen­dig­keit eines zu­sätz­li­chen Klicks nach­weis­lich negativ auf die all­ge­mei­ne Klickrate der Social-Buttons aus.

Ende 2014 hat Heise mit Shariff den of­fi­zi­el­len Nach­fol­ger der 2-Klick-Lösung zum Teilen von Social-Media-Inhalten vor­ge­stellt. Das Open-Source-Projekt wird auf der öf­fent­li­chen Plattform GitHub ent­wi­ckelt, wo Sie auch den Quellcode her­un­ter­la­den können. Ein Shariff-Sharing-Button ist im Grunde genommen nicht mehr als ein einfacher sta­ti­scher Link, der mithilfe der Style­sheet-Sprache CSS (shariff.min.css-Datei) in­di­vi­du­ell gestaltet worden ist, um ihn wie die typischen Teilen-Buttons der beliebten Social-Media-Platt­for­men Facebook, Google+ und Twitter aussehen zu lassen. Dabei hat das Ent­wick­ler­team von Heise nicht auf ge­wöhn­li­che Grafiken, sondern auf flexible Vektor-Icons zu­rück­ge­grif­fen, die auch auf hoch­auf­lö­sen­den Displays scharf bleiben und sich entweder auf dem eigenen Server plat­zie­ren oder über das Content-Delivery-Network MaxCDN einbinden lassen. Damit Sie die URL des sta­ti­schen Links nicht jedes Mal mühsam per Hand ein­ge­tra­gen müssen, schreibt Shariff diese au­to­ma­tisch per Ja­va­Script (shariff.min.js-Datei) in den Quelltext. Die Im­ple­men­tie­rung des Buttons gelingt mithilfe eines <div>-Con­tai­ners und der Klasse shariff, die Sie einfach an der ge­wünsch­ten Stelle im <body>-Bereich Ihres Web­pro­jek­tes po­si­tio­nie­ren. In der ein­fachs­ten Form sieht der Quelltext einer Seite damit fol­gen­der­ma­ßen aus:

Mit einer op­tio­na­len Server-Kom­po­nen­te ist es sogar möglich, die Zahl derer, die den Share-Button benutzt haben, zu ermitteln und anzeigen zu lassen. Drei Backends sowie aus­ge­la­ger­te Module für Facebook, Google+ und Twitter hat Heise hierfür ent­wi­ckelt: eine PHP-, eine Perl- und eine Node.js-Version. Das Backend schickt dabei über die jeweilige API eine Anfrage an die Server der Netzwerke, erhält eine Reihe von Metadaten als Antwort und ex­tra­hiert daraus die In­for­ma­ti­on, wie oft die be­tref­fen­de URL geteilt wurde.

Den eigenen Web­auf­tritt via Button mit sozialen Netz­wer­ken zu ver­knüp­fen, kann die Ver­brei­tung von eigenen Inhalten erheblich er­leich­tern. Das gilt nicht nur für Facebook, sondern auch für alle anderen Platt­for­men, auf denen Sie aktiv sind. Wenn Sie den Dialog mit den Nutzern be­herr­schen und re­gel­mä­ßig hoch­wer­ti­ge Inhalte ver­öf­fent­li­chen, stehen Ihre Chancen hoch, die Social Signals lang­fris­tig in Traffic für Ihre Website um­zu­wan­deln. Die Social-Plug-ins, die Facebook, aber auch andere Social-Media-Kanäle wie Google+ oder Twitter zur Ein­bin­dung der Schalt­flä­chen anbieten, sollten Sie jedoch unbedingt meiden: Diese Er­wei­te­run­gen sind zwar schnell und un­kom­pli­ziert ein­ge­bun­den, bezüglich des Da­ten­schut­zes aber be­denk­lich – und spä­tes­tens seit dem Düs­sel­dor­fer Urteil ist das Szenario einer Abmahnung durchaus rea­lis­tisch.

Al­ter­na­tiv­lö­sun­gen mit sta­ti­schen Links wie das vor­ge­stell­te Projekt Shariff über­mit­teln keinerlei Daten an die Server der sozialen Netzwerke, bevor Ihre Besucher der Wei­ter­ga­be zu­ge­stimmt haben. Nutzen Sie diese Links mit Button-Optik, kommen Sie als Webmaster also Ihrer In­for­ma­ti­ons­pflicht nach und genießen dennoch die Vorteile, die eine Ver­knüp­fung von Website und Social-Media-Profil bietet.