Blogger icin Twitter Takip Kutusu

Merhaba arkadaşlar bir çok bloggerin bloglarında kullandığı Twitter Takip Kutusun nasıl yapılacağını ve bloglarınıza nasıl ekleyeceğinizi anlatacağım..

İlk olarak bu işlemi yapmak için gerekli olan öğeleri sayalım.

1- CSS dosyası
2- JavaScript Dosyası
3- Kodlar

Ben bu dosyaları direk link olarak sayfanın altına ekleyeceğim dileyen buradan inderebilir ve kendi hostuna yükleyip oradan çağırabilir.

Şimdi başlayalım:

İlk olarak Blogger Yönetim paneli/Yerleşim/ Sekmelerinden Eklemek istediğiniz alana Gatget/Widget Ekle Diyerek Html/JavaScript'i seçiyoruz.

Aşağıdaki kodların tamamını kopyalayarak eklediğimiz Gatget'in içine yapıştırıp kayıt ediyoruz. Burada unutmamanız gereken kısım,

Koddaki 'user' : 'SehidimCom' user alanına Kendi Twitter Adınızı yazmanız..

Kodda iki adet renk seçeneği var şeffaf beyaz yada dark siyah.

1- Şeffaf : 

<div id="twitter-box1" class="twitter-box">

    </div>
<script>
    $('#twitter-box1').followbox({
        'user' : 'SehidimCom'
    });
</script>

2- Siyah - Dark


<div id="twitter-box1" class="twitter-box">

    </div>


<script>
    $('#twitter-box2').followbox({
        'user' : 'SehidimCom',
        'theme' : 'dark'
    });
</script>

Bunlardan hangisi kullanacağınız size kalmış kullanmak istediğiniz kodu gatget'eklerken seçebilirsiniz..

Gatgete Eklenecek Kod (HTMl/JavaScript):

<link href='http://cube3x.com/demo/2013/04/twitter-follow-box/followbox/followbox.css' rel='stylesheet' type='text/css'/>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js' type='text/javascript'></script>
<script src='http://cube3x.com/demo/2013/04/twitter-follow-box/followbox/jquery.followbox.js' type='text/javascript'></script>  

<div id="twitter-box1" class="twitter-box">

        </div>
<script>
    $('#twitter-box1').followbox({
        'user' : 'SehidimCom'
    });

</script>

Bu kodun tamamın kopyalıp yapıştırın. Kaydettiğinizde işlem tamamlanacaktır.

Hayırlı olsun..

İndirmek İsterseniz Css ve Js Linkleri (Tıklayıp Farklı kaydet diyerek Pc'ye indirebilirsiniz):

http://cube3x.com/demo/2013/04/twitter-follow-box/followbox/followbox.css
http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js
http://cube3x.com/demo/2013/04/twitter-follow-box/followbox/jquery.followbox.js