Monday, March 19, 2012

Menambahkan Tombol Pinterest Pada Blog


Pinterest merupakan salah satu social networking yang sedang booming pada saat ini. Namun jika kita ingin mendaftar ke situs tersebut, kita harus meminta terlebih dahulu dan tidak seperti facebook yang siapa saja boleh daftar hehe. Dan saat saya membaca salah satu artikel di blog luar negeri, pinterest merupakan salah satu media sosial untuk mengembangkan blog yang kita kelola. Namun pada kali ini saya hanya akan memberi widget-nya saja yang saya dapatkan kodenya dari http://www.bloggersentral.com/. Lihat petunjuknya di bawah ini :

1. Masuk akun blogger kamu.

2. Klik Rancangan --> Edit HTML --> Centang Expand Template Widget dan jangan lupa di back up template blog kamu terlebih dahulu.

3. Cari kode <data:post.body/> dan copas kode javascript di bawah ini, setelah di copy letakan kode yang sudah kamu copy tadi di bawah kode <data:post.body/>.

<!-- Pinterest Start -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='pin-wrapper' style='margin:5px 10px 5px 0; text-align: left;'>
<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;'/>
</div>
<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> 
</b:if>
<!-- Pinterest button End -->

Note :

Tipe Tombol
count-layout value (letak penghitung) kode Hijau
margin-left (baris ke-5) value
pinterest pin-it button vertical
vertical
-46px
pinterest pin-it button horizontal
horizontal
-93px
pinterest pin-it button no count
none
-46px


  • Jika ingin meletakan di atas artikel paste kode sesudah <data:post.body/>
  • Ubah nilai text-align properti di baris 3:
    Rata kanan: ganti kode align ke right;
    Rata tengah: set kode align ke center;
4. Simpan template :D


Postingan Terkait:

0 komentar:

Post a Comment

Komentarmu menunjukan kecerdasanmu, Kalau komentar cuma buat cari link buat apa ? :)

Twitter Delicious Facebook Digg Stumbleupon Favorites More