Social Sharing Buttons richtig einbinden

Social Sharing Buttons von Facebook, Twitter und Co. findet man mittlerweile auf so gut wie jeder Webseite. Bei der Einbindung wird aber fast immer ein entscheidender Fehler gemacht.

Um die Einbindung so einfach wie möglich zu halten, verlangen die Anbieter meist nur einen Schnipsel HTML und/oder Javascript in die Webseite einzufügen. Den Titel der Seite und die aktuelle Url erkennt der Button selber. Genau hier liegt das Problem. Die kanonische Seitenurl unterscheidet sich mitunter erheblich von der in der Urlzeile des Browsers angezeigten. Je nachdem, woher der Besucher kam, kann diese Url diverse Trackingparameter enthalten, die z.B. von Facebook oder Twitter angehängt werden.

Aber genau diese Url wird von der Socialmedia Widgets über das Objekt window.location.href genutzt. Die Anzahl der Shares, die zu ein und derselben Url angezeigt werden variieren deshalb und lassen keine verlässlichen Messungen mehr zu.

Das Problem kann man mit wenig Mehraufwand lösen. Alle wichtigen Plugins erlauben die Angabe einer kanonischen Url über einen zusätzlichen Parameter. Und das sollte man nutzen.

Facebook Like Button

Bei Facebook nennt sich der Parameter data-href=”" und wird wie folgt in das Widget eingebaut:

1

<div class="fb-like" ... data-href="http://www.naden.de" ...></div>

Twitter Button

Twitter nutzt data-url=”" als Parameter und wird so eingebaut:

1

<a href= ... data-url="http://www.naden.de">Tweet</a>

Google +1 Button

Google+ nutzt auch data-href=”", einbau wie folgt:

1

<div class="g-plusone" ... data-href="http://www.naden.de"></div>

Xing Share-Button

Bei Xing ist es ebenfalls data-url=”":

1

<script type="XING/Share" ... data-url="http://www.naden.de"></script>

LinkedIn Share Plugin

LinkedIn nutze genauso data-url=”":

1

<script type="IN/Share" ... data-url="http://www.naden.de"></script>