Blog’unuz için Pinterest beğen/paylaş butonları

Web02 diye tabir edilen içeriğini kullanıcılarının oluşturduğu, ikinci nesil internet dalgasında, bir çok servis sosyal medyayı şekillendirmek için yayın hayatına başlıyor,  Facebook ve Twitter gibi başarılı ve farklı işler sunan servisler gücüne güç katar ilerlemeye devam ediyor, diğerleriyse internett çöplüğünde kendi kaderlerine terk ediliyor. Pinterestte başarılı bu servislerin en son adaylarından birisi.
       
Aday diyorum çünkü şuan yeni bir servis olmasına karşı çok hızlı büyüme grafiklerine sahip bu servisin ileleyen günlerde yıldızının dahada parlaması muhtemel görünüyor.
Daha çok resim odaklı olan bu serviste beğendiğiniz bir resmi veya medyayı paylaşabiliyor, paylaşımlarınıza yorum alabiliyorsunuz ve diğer sosyal medya servisleri gibi kendi blog'unuza ekleyebileceğiniz  bir çok ta eklentisi bulunuyor.


Bunların başında da yine twitter ve faceook’tan aşina olduğumuz beğen paylaş diye bileceğimiz düğme veya butonlar geliyor.

Bu düğmelerden kendi blogunuza eklemek isterseniz kodların bloggera uyarlanması gerekiyor bunuda sizin yerinize biz yaptık ve sizler için bir eklenti hazırladık ve kendi blog’unuzda kullanbileceiğiniz adımlarıda aşağıda sıraladık.

Eklentimizin çalışma mantığı her zaman olduğu gibi gayet basit Pinterst’in size sunduğu 3 düğme seçneğinden her hangi birisini tercih edebilir, düğmenin sağa veya sola yaslanmasına isteyebilir yine bloger’a has özel kodları kullanarak düğmenin hangi sayfada gösterilip gizleneceiğine karar verebilirsiniz.


Eklentimizin diğer bir artısıda yaptığınız işlemleri hem kod üzerinde hemde düğme üzerinde görebiliyor olmanız.

1.Adım seçeneklerinizi belirleyip kodu hazırlayın.
Butonu Özelleşttir Demo


Buttonun Şekli
Yön
Sayfa

<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>
<a href='javascript:void(run_pinmarklet())' style='margin-left:-93px; width:43px; height:20px; display:inline-block;'/>

<script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/>
<script type='text/javascript'>
function run_pinmarklet() {
    var e=document.createElement(&#39;script&#39;);
    e.setAttribute(&#39;type&#39;,&#39;text/javascript&#39;);
    e.setAttribute(&#39;charset&#39;,&#39;UTF-8&#39;);
    e.setAttribute(&#39;src&#39;,&#39;http://assets.pinterest.com/js/pinmarklet.js?r=&#39; + Math.random()*99999999);
    document.body.appendChild(e);
}
</script> 




2.Adım Kodları şablonuza ekleyin yukarıdaki özlleştirme işlemlerini tamaladıysanız kodları kopyalayıp Sırası ile  Kumanda Paneli ➜ Tasarım ➜ HTML’yi Düzenle yolunu takip ederek blog’umuzun kodlarının açık halde bulunduğu modüle ulaşıyoruz.
 
Yapacağımız işlemlere başlamadan önce Tam şablon yükle yazan bağlantıyı kullanarak Blog şablonunuzu yedeklemenizde fayda var. Daha sonra yapacağınız her hangi bir hata sonrası şablonunuzu geri yükleyerek yapmış olduğunuz tüm değişiklikleri geri alabilirsiniz.

Ayrıca açılan pencerede  işaretli Widget şablonlarını genişlet yazan kutucuğun işaretli olduğundan emin olun.

3.Adım Aşağıda bulunan kodu kopyalayıp, klavyenizdeki Ctrl + F tuşuna aynı anda basarak açılan arama formunda aratın.

<data:post.body/>


4.Adım <data:post.body/> ifadesini bulduktan sonra hemen  altına gelecek şekilde 
1. adımda hazırladığınız kodu ekleyip kaydedin.

Arama formunda <data:post.body/> diye arattığınızda birden fazla sonuçla karşılaşabilirsiniz yukarıdaki kodu bulduğunuz ilk ifadenin altına eklemelisiniz

Bu şekilde görünecek 


Not: Beğen düğmesinin yazılarınızın altında değil de üstünde görünmesini isterseniz  kodu <data:post.body/> ifadesinin hemen üstüne ekleyin.


Paylaş !

14 yorum:

  1. Çok tşk ederim çok güzel oldu bu tayfun hocam.

    YanıtlaSil
    Yanıtlar
    1. rica ederim müjdat beğenmene sevindim..

      Sil
  2. güzel ama sadece resim paylaştığımız bir bloga eklenebilir değil mi

    YanıtlaSil
    Yanıtlar
    1. yazıların içinde görsel veya video kullanıyorsan ekleyebilirsin... sana kalmış ama daha çok resimlere odaklana bir servis.

      Sil
  3. Başarılı, blogumda kullandım faydalı bir yazı olmuş.Teşekküler

    YanıtlaSil
  4. bloggerda twitter paylas butonu her yazının altında cıkıyor fakat hem aynı sayı gosterıyor ana sayfadakı gıbı oluyor sızın dedıgınız gıbı yaptım ama boyle oldu sımdıden tesekkr ederım

    YanıtlaSil
    Yanıtlar
    1. her yazının altında aynı sayıyı gösteriyorsa kodu hazırlarken yanlış işaretlemiş olmalısın, bu sayfada http://twitter.com/about/resources/buttons#tweet butonu hazırladıktan sonra tekrar ekle...


      Sayfanın adresini kullan yazan seçeneği değiştime..

      Sil
    2. merhabalar,
      blogger kumanda paneli düzenlemeleri değişti sanırım, widgeti genişlet seçeneği önceden çıkıyordu ama artık çıkmıyor wigdetleri atla vs diyor:( bunun için ne yapabilirim...:( lütfen yardım edin:))

      Sil
  5. malzesef artık pinterette paylaş butonu çalışmıyor, acaba pinteresttenmi kaynaklanıyor ?

    YanıtlaSil
    Yanıtlar
    1. sayfada bulunan buton çalşıyor yani ben bir sorun göremedim siz kodu yanlış veya eksik eklemiş veya her hangi bir değişiklik yaparken silmş olabilirsiniz, kodu yeniden eklemeyi deneyin.

      Sil
  6. ben kodu ekledim buton çıkıyor ancak blogda butona basınca bir işlev gercekleştirmiyor neden acaba ?

    YanıtlaSil

Lütfen yazıyla ilgisiz yorum yapmayın sormak istediğiniz bir soru varsa sağda bulunan kotegorilerden sorunuza en uygun olan kategoriye tıklayıp, açılan sonuçlardan birisine yorum yapabilirsiniz, ayrıca sadece link bırakmak için yapılan spam yorumlar yayınlanmaz