Die Verbreitung der eignen Blog-Inhalte über Soziale Netzwerke gehört inzwischen zum Pflichtprogramm für jeden Blogger und ist auch für Firmenpräsentationen oder Online Shops ein wichtiges Werbemittel geworden.

Social Bookmark Dienste kristallisieren sich inzwischen als Hype heraus. Google Bookmarks, Digg oder Mr. Wong haben weniger Verbreitung oder sind Nutzern gänzlich unbekannt. Draus resultiert, das diese Dienste nicht den gewünschten Besucherstrom bringen.

Google+, twitter und facebook. Die 3 Großen im Netz, die jedem bekannt sind, auf diese möchte ich meinen Focus in diesem Blog Eintrag legen.

Für die Integration dieser Buttons stellen die 3 Communities jeweils Button Generatoren und gut verständliche Anleitungen zur Integration bereit.

Jeder dieser Buttons läd ein Script vom Server des jeweiligen Anbieters um die Buttons mit Funktionalität auszustatten. Das laden der Scripte kann, je nach Last der Ressourcen der Drittanbieter (Google, twitter, facebook), den Aufbau der Seite bremsen.

Google stellt zur Integration seines Buttons von Haus aus die Möglichkeit für eine asynchrone Integration bereit. Auf Basis dieses kleinen Javascriptes ist es ein leichtes den twitter tweet und den facebook Like Button ebenfalls asynchron in unsere Webseite zu integrieren.

Folgendes Script läd Google+, twitter tweet & facebook Like Button asynchron von den Drittanbieter Servern:

window.___gcfg = {lang: 'de'}; // google+
var socials = ['https://apis.google.com/js/plusone.js', 'http://platform.twitter.com/widgets.js', 'http://connect.facebook.net/de_DE/all.js#xfbml=1'];	
for (var i = 0; i < socials.length; i++) {
  	var po = document.createElement('script');
  	po.type = 'text/javascript';
  	po.async = true;
	po.src = socials[i];
	var s = document.getElementsByTagName('script')[0];
	s.parentNode.insertBefore(po, s);
}

Die Einbindung des Scriptes sollte im Kopfbereich (head-Tag) unseres Dokumentes erfolgen.

Ein Beispiel für die jeweiligen HTML Tags stellt dieser Code Block hier da, welcher in den Inhalts Bereich (body-Tag) des Dokumentes eingebunden werden kann:

<div class="g-plusone" data-size="medium" href="***LINK***"></div>
<a href="http://twitter.com/share" class="twitter-share-button" data-url="***LINK***" data-count="horizontal" lang="de">Tweet</a>
<div class="fb-like" href="***LINK***" width="450" show_faces="false" action="like" font="verdana"></div>

Der Platzhalter ***LINK*** ist hierbei durch den Verweis zu ersetzen, der an Google, twitter oder facebook weitergereicht werden soll. Anpassungen der Buttons in Aussehen, Sprache oder Funktionalität können von den jeweiligen Anbietern ersehen werden. Siehe Generatoren und Anleitungen der jeweiligen Anbieter. (siehe oben im Artikel)

Google+, twitter tweet & facebook Like für WordPress

In diesem WordPress Blog-System ist Google+, twitter tweet & facebook Like auf die bereits aufgezeigte Weise implementiert. Um den Short-Link des jeweiligen Artikels in einem WordPress Template zu ermitteln verwende ich die Funktion wp_get_shortlink(). Der Rückgabe Wert dieser Funktion oder die Funktion selber muss lediglich durch den ***LINK*** Platzhalter ersetzt werden.

Keine Kommentare »