Nachdem wir schon länger hier im Blog statische Social Network Buttons verwenden, wollen wir nun mal zeigen, wie wir diese hier umgesetzt haben.
Wesentlicher Unterschied zu den dynamischen Buttons ist, dass die statischen Buttons auf unserem Server liegen und von dort geladen werden. FB, Twitter und G+ bekommen also erst mal vom Besuch der Seiten nix mit. Erst wenn man jetzt einen Button anklickt, wird die Verbindung zum Sozialen Netzwerk aufgebaut.
Heutzutage also ein MUSS was den Datenschutz angeht!
Bei den dynamischen Buttons werden nämlich die Grafiken und Counter schon von den entfernten Facebook-/Twitter-/GooglePlus-Seiten direkt geladen, bevor man überhaupt drauf klickt. D.h. FB, TW und G+ wissen schon beim laden der Site, dass man die Site gerade besucht hat, sofern man in einem dieser Sozialen Netzwerke gerade angemeldet ist.
Die Grafiken müsst ihr euch natürlich selber irgendwo her suchen, passt aber auf, dass ihr die Lizenzbestimmungen für die Bilder einhaltet.
Also hier mal der Code zu den Share-Icons:
Facebook:
<a href="https://www.facebook.com/sharer/sharer.php?u=<?php echo urlencode(get_permalink($post->ID)); ?>&t=<?php echo rawurlencode(strip_tags(get_the_title())) ?>" target="_blank" title="Artikel bei Facebook teilen">
<img class="alignleft" src="<?php bloginfo('template_directory'); ?>/images/icon_facebook_32.jpg" width="32" height="32" alt="Artikel bei Facebook empfehlen" title="Artikel bei Facebook empfehlen" />
</a>
Twitter:
<a href="https://twitter.com/intent/tweet?source=webclient&text=<?php echo rawurlencode(strip_tags(get_the_title())) ?>%20<?php echo urlencode(get_permalink($post->ID)); ?>" target="_blank" title="Artikel bei Twitter empfehlen">
<img class="alignleft" src="<?php bloginfo('template_directory'); ?>/images/icon_twitter_32.jpg" width="32" height="32" alt="Artikel bei Twitter empfehlen" title="Artikel bei Twitter empfehlen" />
</a>
Google+:
<a href="https://plus.google.com/share?url=<?php echo urlencode(get_permalink($post->ID)); ?>&title=<?php echo rawurlencode(strip_tags(get_the_title())) ?>" target="_blank" title="Artikel bei Google+ empfehlen">
<img class="alignleft" src="<?php bloginfo('template_directory'); ?>/images/icon_gplus_32.jpg" width="32" height="32" alt="Artikel bei Google+ empfehlen" title="Artikel bei Google+ empfehlen" />
</a>
Desweiteren haben wir einen Counter eingebaut, der zeigt wie oft ein Artikel schon geteilt wurde:
Facebook:
<?php
$URL = get_permalink();
$shares = json_decode(file_get_contents("http://api.facebook.com/method/fql.query?query=select%20share_count%20from%20link_stat%20where%20url='$URL'&format=json"));
echo $shares[0]->share_count;
?>
Twitter:
<?php
$URL = get_permalink();
function get_retweets($URL) {
$TWstring = file_get_contents('http://urls.api.twitter.com/1/urls/count.json?url=' . $URL);
$TWarray = json_decode($TWstring, true);
return intval( $TWarray['count'] );
}
echo get_retweets($URL);
?>
Google+:
<?php
$URL = get_permalink();
function get_plusone($url) {
$curl = curl_init();
curl_setopt($curl, CURLOPT_URL, "https://clients6.google.com/rpc");
curl_setopt($curl, CURLOPT_POST, 1);
curl_setopt($curl, CURLOPT_POSTFIELDS, '[{"method":"pos.plusones.get","id":"p","params":{"nolog":true,"id":"' . $url . '","source":"widget","userId":"@viewer","groupId":"@self"},"jsonrpc":"2.0","key":"p","apiVersion":"v1"}]');
curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
curl_setopt($curl, CURLOPT_HTTPHEADER, array('Content-type: application/json'));
$curl_results = curl_exec ($curl);
curl_close ($curl);
$json = json_decode($curl_results, true);
return intval( $json[0]['result']['metadata']['globalCounts']['count'] );
}
echo get_plusone($URL);
?>
Und zu guter Letzt noch ein Hinweis, wie man z.B. die Facebook Likes eines Beitrages abfragen könnte:
Facebook:
<?php
$URL = get_permalink();
$likes = json_decode(file_get_contents("http://api.facebook.com/method/fql.query?query=select%20like_count%20from%20link_stat%20where%20url='$URL'&format=json"));
echo $likes[0]->like_count;
?>
Feed