Vor einiger Zeit (entschuldige bitte, lieber Einsender! Hab dich total vergessen!) bekam ich eine Mail, in der ich gefragt wurde, mit welchem Plugin ich die Buttons zu Twitter, Facebook und den VZ-Netzwerken einbinde. Aus diesem gegebenen Anlass hier nun die öffentliche Antwort: Mit keinem, diese Buttons sind von mir in den Quelltext meines Themes geschrieben worden. Ich nutze also keine externen Dienste, die Ladezeiten unnötig in die Länge ziehen. Hier beschreibe ich nun, wie das jeder selbst tun kann, denn kompliziert ist es nicht.

Kleiner Tipp für die, die nicht wissen wollen, wie es geht, sondern nur wollen, dass es geht: Am Ende des Artikels findet ihr die Codezeilen, die ihr in den Quelltext eures Themes einfügen müsst, lediglich der Abschnitt über Twitter ist zu beachten!

Zuerst mal zum Prinzip: Wir haben einen Button (solche Buttons gibt es im Internet kostenlos zur nicht kommerziellen Nutzung), der mit einem Link auf das jeweilige Netzwerk hinterlegt ist, der gleichzeitig Titel und Link des zu teilenden Artikels enthält. Dafür haben die drei Netzwerke unterschiedliche Vorrichtungen.

Wenden wir uns zuerst einmal Facebook und den VZ-Netzwerken zu, bei ihnen ist die Länge des Links unerheblich, da es nicht wie bei Twitter ein Limit auf 140 Zeichen gibt, bzw. der Link selbst gar nicht angezeigt wird.

Facebook nutzt dafür eine Datei namens sharer.php. An sie müssen Permalink und Titel des Artikels übergeben werden. Das tun wir über einen Link wie diesen: http://www.facebook.com/sharer.php?u=example.com&t=Beispiel-Link

Facebook empfängt also die URL “example.com” und den Titel “Beispiel-Link”. Nun wollen wir natürlich, dass automatisch unser Permalink auf dem Artikel und der Titel desselben in diesem Link stehen. Dafür nutzen wir die WordPress Template Tags für den Permalink und den Artikel-Titel, <?php the_permalink(); ?> und <?php the_title(); ?> und setzen diese in den oben genannten Link ein:
http://www.facebook.com/sharer.php?u=<?php the_permalink(); ?>&t=<?php the_title(); ?>
Wenn wir diesen Link so wie er ist in unser Theme schreiben würden, hätten wir bereits einen funktionierenden Link, der es dem Leser ermöglicht, den Link zu teilen. Ein Ausschnitt des Textes wird von Facebook automatisch eingefügt. Der fertige HTML-Schnipsel kann so aussehen:

<a href="http://www.facebook.com/sharer.php?u=<?php the_permalink(); ?>&t=<?php the_title(); ?>" target="_blank"><img src="/pfad/zum/button/facebook-share.png" alt="Facebook"/></a>

Die VZ-Netzwerke (StudiVZ, SchülerVZ und MeinVZ) handhaben das ähnlich. Hier müssen Permalink, Titel und der Name der Website an eine Vorschaltseite weitergegeben werden, auf der der Nutzer auswählen kann, in welchem Netzwerk er ist und den Linkt teilen möchte. Wir benötigen hier einen Link der aussieht wie dieser:
http://www.studivz.net/Link/Selection/Url/?u=example.com&desc=Titel&prov=Blogname

Auch hier ersetzen wir wieder Link und Titel durch die Template Tags, fügen aber noch das Template Tag für den Blognamen mit an:
http://www.studivz.net/Link/Selection/Url/?u=<?php the_permalink(); ?>&desc=<?php the_title(); ?>&prov=<?php bloginfo(‘name’); ?>
Auch das ist schon alles. Hier wieder der beispielhafte HTML-Schnipsel fürs eigene Template:

<a href="http://www.studivz.net/Link/Selection/Url/?u=<?php the_permalink(); ?>&desc=<?php the_title(); ?>&prov=<?php bloginfo('name'); ?>" target="_blank"><img src="/pfad/zum/button/vz-share.png" alt="VZ-Netzwerke"/></a>

Nun kommen wir zu Twitter. An Twitter wollen wir den Titel, den Link und einen kurzen Einleitungstext wie beispielsweise “Ich lese gerade:” schicken. Hier brauchen wir einen Link nach folgendem Schema:
http://twitter.com/home?status=Ich+lese+gerade:+Titel+http://example.com/

Hier wird es dann etwas komplizierter, denn Twitter erlaubt höchstens 140 Zeichen pro Tweet, es ist daher nicht zu empfehlen, lange Permalinks an Twitter zu senden. WordPress hat allerdings noch eine sehr Kurze URL-Form, sie besteht lediglich aus der Domain und der Post-ID: http://example.com/?p=123. Mit dieser können wir arbeiten. Um diese Form für einen einzelnen Link zu bekommen, müssen wir etwas in der functions.php unseres Themes arbeiten.
Vor längerer Zeit fiel mir der folgende Codeschnipsel in die Hände, ich weiß nicht mehr, woher ich ihn habe, lediglich steht im Quellcode, auf wessen Überlegungen er basiert. Dieses Stückchen Code fügen wir nun unserer functions.php hinzu:

if(!function_exists('get_tweet_this_link')){
function get_tweet_this_link($message_template = 'Ich lese gerade: %TITLE %URL', $link_title='<img src="/wp-content/themes/DEIN-THEME/pfad/zum/button/twitter-share.png" alt="Twitter" />', $title_length = 80){
global $post;
// Via http://toscho.de/2009/shortlinks-in-wordpress/
$tinyurl = trim(get_option('home'), '/') . '/?p=' . $post->ID;
// Titel des Artikels kürzen
$title = $post->post_title;
if(strlen($title) > $title_length){
$short_title = substr($title, 0, $title_length);
$short_title .= '...';
}
else{
$short_title = $title;
}
// Link erstellen
$message = str_replace(array('%TITLE', '%URL'), array($short_title, $tinyurl), $message_template);
$message = urlencode($message);
return '<a href="http://twitter.com/home?status='.$message.'" target="_blank">'.$link_title.'</a>';
}
}

Es muss lediglich noch (recht weit oben) der Pfad zum Twitter-Button angepasst und eventuell die kurze Nachricht geändert werden. Den gesamten Link zu Twitter fügen wir nun im Quelltext des Theme mit dem folgenden selbstgemachten Template-Tag auf: <?php echo get_tweet_this_link() ?>

Und das war es auch schon. Wir haben nun die drei Links erstellt und den Lesern eine Möglichkeit geschaffen, mit wenig Aufwand anderen unsere Artikel zu zeigen.

Wenn wir also die drei Schritte gegangen sind, könnten wir uns einen kleinen Block mit den Netzwerk-Buttons zusammengebastelt haben, der in etwa so aussieht:
Zeig's Ihnen!<br />
Auf Twitter: <?php echo get_tweet_this_link() ?> | Auf Facebook: <a href="http://www.facebook.com/sharer.php?u=<?php the_permalink(); ?>&t=<?php the_title(); ?>" target="_blank"><img src="/pfad/zum/button/facebook-share.png" alt="Facebook"/></a>
| In den VZ-Netzwerken: <a href="http://www.studivz.net/Link/Selection/Url/?u=<?php the_permalink(); ?>&desc=<?php the_title(); ?>&prov=<?php bloginfo('name'); ?>" target="_blank"><img src="/pfad/zum/button/vz-share.png" alt="VZ-Netzwerke"/></a>

Viel Erfolg beim “Nachbauen”! Fragen und Anregungen sind in den Kommentaren natürlich gern gesehen!

Ergänzung:
In den Kommentaren wies Gunni darauf hin, dass urlencode() genutzt werden sollte, womit er natürlich Recht hat, das Script für den Twitter-Kurzlink ist bereits dementsprechend geschrieben worden.
Prinzipiell geht es ohne, wer aber urlencode() nutzen möchte, kann den oben genannten Codeblock gegen diesen ersetzen:

Zeig's Ihnen!<br />
Auf Twitter: <?php echo get_tweet_this_link() ?> | Auf Facebook:
<?php $query_string = '?u=' . urlencode(get_permalink()) . '&t=' . urlencode(get_the_title());
echo '<a href="http://www.facebook.com/sharer.php' . htmlentities($query_string) . '" target="_blank">
<img src="/pfad/zum/button/facebook-share.png" alt="Facebook"/></a>';?>
| In den VZ-Netzwerken:
<?php $query_string = '?u=' . urlencode(get_permalink()) . '&desc=' . urlencode(get_the_title()) . '&prov=' . urlencode(get_bloginfo('name'));
echo '<a href="http://www.studivz.net/Link/Selection/Url/' . htmlentities($query_string) . '" target="_blank">
<img src="/pfad/zum/button/vz-share.png" alt="VZ-Netzwerke"/></a>';?>

Viel Erfolg!