Sayfamıza “Social Bookmarking Buton” koyalım

Dikkat: Bu yazının yazılma tarihinin üzerinden en az 60 gün geçmiş. İçerisindeki bilgiler güncelliğini yitirmiş olabilir. Yorumları ve güncellemeleri göz önünde bulundurarak yazıyı takip ediniz.
Soyal link sitelerini çoğumuz kullanır olduk. Delicious, google bookmarks, digg, technorati vs.
v0.7'de gördüğünüz gibi her sayfanın altında bu sitelerin ikonları var ve bu butonlar sayesinde gezindiğiniz sayfayı doğrudan o servise eklemek için istek gönderebiliyorsunuz. Bu butonları da çoğu sitede görmeye başladık. Bu dökümanda kısaca bu butonları koymanızı sağlayacak işlemlerden bahsedeceğim.

Neredeyse bütün sosyal link siteleri url kaydetme formlarını GET methodu ile gelen verilerle otomatik doldurabiliyor. Böylece hiçbir api veya benzeri zorlukla uğraşmadan dışarıdan istek kabul edebiliyorlar. Bu sayede buton haline dönüştürmek çok kolay.

Ben bu servislerin bağlantılarını
<span>Bu sayfayı "Sosyal Bağlantı" (Social Bookmarking) sitelerine kaydedin</span>
<ul>
  <li><a href="#" onClick="sayfayiImle('delicious');">del.icio.us</a></li>
  <li><a href="#" onClick="sayfayiImle('furl');">Furl</a></li>
  <li><a href="#" onClick="sayfayiImle('digg');">Digg</a></li>
  <li><a href="#" onClick="sayfayiImle('technorati');">Technorati</a></li>
  <li><a href="#" onClick="sayfayiImle('reddit');">Reddit</a></li>
  <li><a href="#" onClick="sayfayiImle('google');">Google Bookmarks</a></li>
  <li><a href="#" onClick="sayfayiImle('simpy');">Simpy</a></li>
</ul>
htlm kodu ile sayfamın altına yerleştirdim. Gördüğünüz gibi sadece kendi kimlikleri ile sayfayiImle fonksiyonunu cagiriyorlar. Javascript kodum da şu :
function sayfayiImle(servis){
  var servis, url;
  // sosyal link imleme url'leri (dinamik)
  if( servis == 'delicious' )
    url = 'http://del.icio.us/post?v=4;url=$URL;title=$TITLE';
  else if( servis == 'furl' )
   url = 'http://www.furl.net/savedialog.jsp?p=1&v=1&u=$URL&t=$TITLE';
  else if( servis == 'digg' )
    url = 'http://digg.com/submit?phase=2&url=$URL';
  else if( servis == 'technorati' )
    url = 'http://www.technorati.com/cosmos/search.html?url=$URL';
  else if( servis == 'reddit' )
    url = 'http://reddit.com/submit?url=$URL&title=$TITLE';
  else if( servis == 'google' )
    url = 'http://www.google.com/bookmarks/mark?op=add&bkmk=$URL&title=$TITLE';
  else if( servis == 'simpy' )
    url = 'http://www.simpy.com/simpy/LinkAdd.do?href=$URL&title=$TITLE';
  else return false;
  
  // sayfa basligi ve url'sinin entity'sini duzeltelim
  url = url.replace( '$TITLE', encodeURIComponent(document.title) );
  url = url.replace( '$URL',   encodeURIComponent(location.href)  );
  
  // olusturulmus url'ye gidelim
  location.href = url;
}
Burada her servisin bir url'si var ve her servis 2 parametre istiyor. Bunlar kaydetmek istediginiz sayfanın URL'si ve Başlığı URL'lerde dinamik olarak $URL ve $TITLE stringlerini sonradan değiştirmek üzere dinamik url cümleleri oluşturdum. Fonksiyonun ilk parametresine göre, yani hangi servise kaydedilecekse o servisin cümlesini alıp, $URL ve $TITLE stringlerini document.title ve document.url ile değiştirip oluşan son URL'ye yönlendirdim sayfaları.

Aslında yapılan iş çok basit, bunu dinamik olarak php'ye de yaptırıp statik linkler basabilirsiniz. Ama bu yöntem en pratik olanı :-) Burada kullanmadığım diğer servislerin de url kurallarını öğrenip bu listeye ekleyebilirsiniz. Zira sosyal link sitelerini sayısı oldukça fazla.

AddThis ve EkleBunu hizmetlerini kullanmak

Başka bir tercihiniz de var, AddThis (http://addthis.com/ ) veya Türkçe olarak EkleBunu (http://www.eklebunu.com/ ) hizmetlerini kullanmak. Bu sitelerde bulunan html kodunu ekleyerek sayfanıza bir buton koyuyorsunuz ve bu buton sayesinde tüm sosyal link sitelerine sayfanızı kaydedebilir hale geliyorsunuz. Butonlar :

AddThis

EkleBunu

şeklinde görünüyor sitenizde.


Hazırlayan : Mehmet Fatih YILDIZ

Yorumlar

Üye Resmi mert
1 Temmuz Çarşamba ´09 23:29
merhaba paylaşımınız çok güzel olmuş, bu bookmarks sitelerini  arttırabilir miyiz mesela live bookmarksa falanda eklenebilse çok güzel olur.
20 Mart Cumartesi ´10 18:14
Sosyal araçlar çoğaldıkça ve kullanımı arttıkça böyle girişimler sevilir hale geldi. çok beğendiğiniz bir şeyi sosyal ağınızda paylaşabiliceğinizi gösteren küçük bir ikon görmek çok sevimli gözükebilir. Ve mutlu edici şeylerdir. Bu makale için teşekkürler Mehmet abi.
Yeni Yorum *
İletişim Bilgileri
*
*
E-Posta adresiniz gösterilmeyecektir.
(unut)
Güvenlik Kodu *

Gönderiliyor