Google Buzz Sayaçlı Paylaş Butonu ,Buzz it , Sitelere ,Blogger ve WordPress’e Koyma İmkanı
Uygulamasını binlerce kişi tarafından takip edilen bir sitede gördüğüm Google Buzz Sayaçlı Paylaş Butonu nun kendi sitenizde, bloggerinizda ve wordpressinizde uygulamasını denemeniz için böyle bir araştırma konusunu sizinle paylaşmak istedim.İnşallah okuyucularımız begenirsiniz.
Çalışma mantığı şu şekildedir. Bit.ly adındaki url kısaltıcı servisi kullanan buton her tıklamada görsel sayacı arttırıyor. Api’leri kullanan buton bit.ly’den aldığınız api ile çalışır.
1. Adım
Bit.ly adresinden yeni bir hesap açıp kendimize bit.ly api key alıyoruz. sonra kullanıcı adı ve apiyi gerekli gereklere yazarak sayfamızın <head> tagından sonra hemen ekliyoruz.
<script type=”text/javascript” src=”http://bit.ly/javascript-api.js?version=latest&login=kullaniciadiniz&apiKey=apikeyiniz”></script>
2. Adım
Aşağıdaki stil dosyalarını sayfanızın <head> ile </head> arası ekliyoruz.
<style type=’text/css’>
.btn {
background:url(“http://www.veteknoloji.com/images/buzz-button.jpg”) no-repeat center center;
width:50px;
height:58px;
position:relative;
text-align:center;
}
.btn a {
position:absolute;
bottom:0;
left:0;
display:block;
height:17px;
width:50px;
}
.btn span {
position:absolute;
right:0;
left:0;
top:5px;
font-size:14px;
font-weight:bold;
letter-spacing:0.1em;
padding:3px;
color:#ffffff;
}
</style>
3. Adım
Sayfanızda buzz butonunu göstereceğiniz yere aşağıdaki kodu ekliyorsunuz
<div class=’btn’>
<a href=’google_buzz_paylas_linkiniz’></a>
</div>
Kesinlikle değerini kaldırmıyorsunuz. en önemli yere geldik. Özel kodlamalarda google buzz paylaş linkide farklı oluyor. İster var olan pencere içerisinde yeni popup pencere açtırır veya _blank ile yeni pencere açtırarak buzz paylaşım penceresini kullanıcılara gösterebilirsiniz.
Veteknoloji.com’da kullandığımız paylaşım butonunun mantığı şu şekildir.
<div class=’btn’>
<a
class=”buzzbutton” href=’http://www.google.com/reader/link?url=http://www.veteknoloji.com/<?= $haberlink ?>&title=<?php echo $title; ?>&srcURL=http://www.veteknoloji.com/” target=”_blank” rel=”nofollow external”‘ hspace=”5″ align=”left” target=”_blank”></a>
</div>
Yani Özel Kodlamaları Kullanan Kişiler şunları editleyecek
<div class=’btn’>
<a
class=”buzzbutton” href=’http://www.google.com/reader/link?url=http://www.veteknoloji.com/<?= $haberlink ?>&title=<?php echo $title; ?>&srcURL=http://www.siteadi.com/” target=”_blank” rel=”nofollow external”‘ hspace=”5″ align=”left” target=”_blank”></a>
</div>
http://www.veteknoloji.com/<?= $haberlink ?>
Buraya sitenizin php olarak bulunduğu sayfanın linkinin değerini vereceksiniz.
<?php echo $title; ?>
Buraya genelde aynıdır ama farklı bir fonksiyon veya değer verilmiş ise sayfanızın title değerini veriyorsunuz.
http://www.siteadi.com/
Burayada site adinizi yaziyorsunuz.
Blogger Kullananlar İçin
Yeni Blogger için
<a expr:href=’"http://www.google.com/reader/link?url=" + data:post.url + "&title=" + data:post.title + "&srcURL=" + data:blog.homepageUrl ‘><img src=”http://4.bp.blogspot.com/_FX3RmPElUpc/S3VkcrkMk4I/AAAAAAAAAzc/XkmkEsom8OQ/s144/googlebuzz.png” /></a>
Klasik Blogger için
<a href=’http://www.google.com/reader/link?url=<$BlogItemPermalinkURL$>&title=<$BlogItemTitle$>&srcURL=YOURBLOG.blogspot.com’><img src=”http://4.bp.blogspot.com/_FX3RmPElUpc/S3VkcrkMk4I/AAAAAAAAAzc/XkmkEsom8OQ/s144/googlebuzz.png” /></a>
WordPress için
<a
target=”_blank” href=”http://www.google.com/reader/link?url=<?php the_permalink() ?>&title=<?php the_title(); ?>&srcURL=<?php bloginfo(‘url’); ?>” ><img
src=”http://img2.pict.com/15/da/3e/2809374/0/googlebuzz.png” width=”50″ height=”58″ /></a>
Read more: http://jaxov.com/2010/02/add-buzz-this-button-count-wordpress/#ixzz0hYslKnzn
veya WPBUZZER pluginini kullanın.
Son olarak sayfanızın </body> tagından hemen önce aşağıdaki script dosyasını ekliyorsunuz.
<script type=’text/javascript’>
/***
veteknoloji buzz buton cybokron
***/
//get all anchor tags with buzzbutton as the class
urlContainer = {};
hashContainer = {};
function getAllButtons() {
anchrs = document.getElementsByTagName(“a”);
btns = new Array();
for(i=0; i<anchrs.length; i++) {
if(anchrs[i].className == “buzzbutton”) {
btns.push(anchrs[i]);
}
}
return btns;
}
var btns = getAllButtons();
for(i=0;i<btns.length;i++) {
long_url = btns[i].href;
urlContainer[long_url] = i;
BitlyClient.shorten(long_url, ‘replace_link’);
}
function replace_link(data) {
for (var r in data.results) {
doc = data.results[r];
break;
}
short_url = doc[‘shortUrl’];
hash = doc[‘hash’];
hashContainer[hash] = urlContainer[r];
btns[urlContainer[r]].href = “http://bit.ly/”+hash;
BitlyClient.stats(hash, ‘getStat’);
}
function getStat(data) {
var clicks = data.results.clicks;
var hash = data.results.hash;
span = document.createElement(“span”);
span.innerHTML = clicks;
btns[hashContainer[hash]].parentNode.insertBefore(span, btns[hashContainer[hash]]);
}
</script>
