Mayıs 12, 2012

Blogger için Pinterest Paylaş Butonu Nasıl Eklenir ?

Blogger için Pinterest Paylaş Butonu Nasıl Eklenir ?

Printrest , bir listesi Pinboard tarzı sosyal bir resim paylaşım sitesidir. Facebook, Twitter, Google Paylaş butonlarından sonra şimdi yeni nesil pinterest oldu. Bende erinmeden sizlere onu araştırdım ve buldum.

3 çeşit paylaş butonu bulunan bu kod ister konuların başlığına isterseniz de konunun sonuna ekleyebilirsiniz

1. Yatay Paylaş Butonu:

<script type='text/javascript'>
(function() {
    window.PinIt = window.PinIt || { loaded:false };
    if (window.PinIt.loaded) return;
    window.PinIt.loaded = true;
    function async_load(){
        var s = document.createElement(&quot;script&quot;);
        s.type = &quot;text/javascript&quot;;
        s.async = true;
        if (window.location.protocol == &quot;https:&quot;)
            s.src = &quot;https://assets.pinterest.com/js/pinit.js&quot;;
        else
            s.src = &quot;http://assets.pinterest.com/js/pinit.js&quot;;
        var x = document.getElementsByTagName(&quot;script&quot;)[0];
        x.parentNode.insertBefore(s, x);
    }
    if (window.attachEvent)
        window.attachEvent(&quot;onload&quot;, async_load);
    else
        window.addEventListener(&quot;load&quot;, async_load, false);
})();
</script>
<!-- Pinterest button Start -->
<div style='text-align:left;padding:5px 5px 5px 0;'>
<a class='pin-it-button' count-layout='horizontal' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url'>Pin It</a>
</div>
<!-- Pinterest button End -->

2. Dikey Paylaş Butonu

<script type='text/javascript'>
(function() {
    window.PinIt = window.PinIt || { loaded:false };
    if (window.PinIt.loaded) return;
    window.PinIt.loaded = true;
    function async_load(){
        var s = document.createElement(&quot;script&quot;);
        s.type = &quot;text/javascript&quot;;
        s.async = true;
        if (window.location.protocol == &quot;https:&quot;)
            s.src = &quot;https://assets.pinterest.com/js/pinit.js&quot;;
        else
            s.src = &quot;http://assets.pinterest.com/js/pinit.js&quot;;
        var x = document.getElementsByTagName(&quot;script&quot;)[0];
        x.parentNode.insertBefore(s, x);
    }
    if (window.attachEvent)
        window.attachEvent(&quot;onload&quot;, async_load);
    else
        window.addEventListener(&quot;load&quot;, async_load, false);
})();
</script>
<!-- Pinterest button Start -->
<div style='text-align:left;padding:5px 5px 5px 0;'>
<a class='pin-it-button' count-layout='vertical' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url'>Pin It</a>
</div>
<!-- Pinterest button End -->

3.Paylaşım Sayacını Göstermeyen Buton:

<script type='text/javascript'>
(function() {
    window.PinIt = window.PinIt || { loaded:false };
    if (window.PinIt.loaded) return;
    window.PinIt.loaded = true;
    function async_load(){
        var s = document.createElement(&quot;script&quot;);
        s.type = &quot;text/javascript&quot;;
        s.async = true;
        if (window.location.protocol == &quot;https:&quot;)
            s.src = &quot;https://assets.pinterest.com/js/pinit.js&quot;;
        else
            s.src = &quot;http://assets.pinterest.com/js/pinit.js&quot;;
        var x = document.getElementsByTagName(&quot;script&quot;)[0];
        x.parentNode.insertBefore(s, x);
    }
    if (window.attachEvent)
        window.attachEvent(&quot;onload&quot;, async_load);
    else
        window.addEventListener(&quot;load&quot;, async_load, false);
})();
</script>
<!-- Pinterest button Start -->
<div style='text-align:left;padding:5px 5px 5px 0;'>
<a class='pin-it-button' count-layout='none' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url'>Pin It</a>
</div>
<!-- Pinterest button End -->
Şimdi gelelim uygulamasına:
Eğer konuların Altına eklemek istiyorsanız aşağıdaki kodu bulun:

<div class='post-footer'>
Bulduğunuz kodun hemen altına yukarıdaki kodlardan istediğiniz yapıştırın ve şablonu kaydedin.
Yada
Konu başlığının altına eklemek istiyorsanız aşağıdaki kodu bulup hemen altına yukarıdaki kodun herhangi birini yapıştırın:

<div class='post-header-line-1'/>

İşlem tamam yapamadığınız bir şey olursa "YORUM" kısmından belirtiniz, kolay gelsin; iyi bloglamalar...

7 yorum :

Önceki konularımda mevcut bakabilirsiniz hocam.

Çok çok teşekkürler, heryerde bunu arıyordum. Yalnız diğer paylaşım butonlarının üstünde yer aldı. Aşağı, diğerlerinin yanına çekme şansımız var mı acaba?

Konu başlığının altına eklemek için div class='post-header-line- 1 ' / > kodunu önerdim. Bunlardan birkaç tane mevcut ise temanızda tek tek deneyerek bakabilirsiniz.

çalışmıyor konu altına butonu. Pinlemedi resim ve link eklemiyor

http://progrey-turkce-tema.blogspot.com/2012/05/renkli-baslk-css-ile-hazrlanms-bloglama.html Kodun önizlemesine buradan bakabilirsiniz. Çalışıyor.

böyle bir kod bulunamadı diyor, başka kod yokmu blogerlar için?

Temanızda kod olmayabilir. Kullanmak isterseniz eğer temanızı bana gönderin, kodu ben ekleyip tekrardan gönderebilirim size.

Kodun Önizlemesi: http://progrey-turkce-tema.blogspot.com/2012/05/renkli-baslk-css-ile-hazrlanms-bloglama.html

Yorum Gönder



Bloglama Zamanı'nda yayınlanacak yeni yazılar e-mail adresinize gelsin.


Google Arkadaşım Ol
Bloglama Zamanı
Bloglama Zamanı

Google+ paylaşımlarımı takip etmek için çevrelerinize ekleyin.