Cara Mudah Membuat Tombol Share Diatas

Diposting olehviky on Sabtu, 16 Juli 2011


Lanjut terus...pada posting kali ini saya akan coba memberikan trick cara membuat tombol share di halaman  posting blog anda. yang akan coba saya ulas disini adalah cara membuat tombol share diatas halaman posting kamu.

Social media dalam tombol share kali ini diantaranya Facebook, Twitter, Digg, dan Buzz..tertarik untuk membuatnya ? langsung saja kita ke TKP. Ikuti langkah-langkah berikut :

  • Login ke Blogger » Rancangan » Edit HTML » Centang Expend Widget 
  • Cari Kode lah  <div class='post-body entry-content'>
Tips mencari cepat: tekan ctrl+f dan masukan kode di atas, atau jika tidak ketemu musukan saja post-body kemudian cari kode yang mirip dengan yang saya sebutkan tadi di atas!

  • Jika sudah ketemu pastekan code di bawah ini tepat di atasnya <div class='post-body entry-content'>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='border-top:1px solid #ccc;border-bottom:1px solid #ccc; padding:8px 0px;margin:4px 0px 30px 0px;width:100%;float:left;height:20px;'>
<div style='float:left;padding-left:0px;font:normal 12px Georgia;font-style:Italic;'>
Share this history on : 
</div>
<div style='float:left;padding-left:10px;'>
<a name='fb_share' type='button_count'/> 
<script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'>
</script></div>
<div style='float:left;padding-left:10px;'>
<a class='google-buzz-button' data-button-style='small-count' href='http://www.google.com/buzz/post' title='Post to Google Buzz'/>
<script src='http://www.google.com/buzz/api/button.js' type='text/javascript'/>
</div>
<div style='float:left;padding-left:10px;'>
<a class='DiggThisButton DiggCompact'/>
<script type='text/javascript'>
(function() {
var s = document.createElement(&#39;SCRIPT&#39;), s1 = document.getElementsByTagName(&#39;SCRIPT&#39;)[0];
s.type = &#39;text/javascript&#39;;
s.async = true;
s.src = &#39;http://widgets.digg.com/buttons.js&#39;;
s1.parentNode.insertBefore(s, s1);
})();
</script>
</div>
<div style='float:left;padding-left:10px;'>
<a class='twitter-share-button' data-count='horizontal' data-via='User Name' href='http://twitter.com/share'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>
</div>
</div>
</b:if>
*perhatikan pada kode diatas, ada tulisan user name twitter, ganti dengan milik Anda
Setelah itu simpan Tempelate dan lihat hasilnya. Bagaimana ? Mudah bukan ? coba di peraktekan dulu....selamat mencoba.

{ 0 komentar.. read them below or add one }

Posting Komentar

 

Blog Archive