Banners Banners Premium WordPress Themes Banners

Search

Sunday, December 22, 2013

Cara Menambahkan Tombol Share Ke facebook Twitter dll di Blog

Share this history on :

Memasang Tombol Share Facebook, Buzz, Digg dan Twitter di Blog


Sebelum ini saya telah memposting artikel berjudul "Memasang Tombol Share Dibawah Posting Blog". Yakin sudah membacanya ?? jika belum sebaiknya klik disini untuk membuka dihalaman baru.
Pada artikel tersebut telah saya buat tutorial memasang tombol share yang me-link ke Facebook, Google+, Twitter, Digg dan satu lagi yaitu tombol Lintaskan dari situs Lintas.me.
Lalu apa bedanya sama yang ini mas? Didunia blog website ada banyak ragam penampakan share button yang bisa dipilih dan kita pasang diblog. Nah, disini saya hanya sharing satu widget tombol share lainnya kepada temen-temen blogger yang mungkin saja ada yang kurang suka dengan penampakan tombol share kemarin telah kita ulas disini.
caranya cukup mudah karena tidak perlu bertele-tele
Untuk widget tombol share atau share button yang sekarang ini penampakannya bisa kamu lihat seperti screenshot dibawah ini :


Gimana, tertarik dengan yang ini? Oke kalau begitu kita langsung ke tutorialnya saja.

1. Login ke Blogspot
2. Seperti biasa pilih menu "Template" lalu klik "Edit HTML"
3. Pada HTML template silahkan dicari kode ini :
<div class='post-body entry-content'>
4. Jika sudah ketemu selanjutnya Copy (Ctrl+C) kode dibawah ini dan Paste (Ctrl+V) tepat diatas kode <div class='post-body entry-content'> tadi.
<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>
*Penting :
  • Ganti tulisan 'User Name' dengan nama akun Twitter mu
  • Untuk tulisan 'Share this history on :' bisa kamu ubah sesuai selera
 5. Langkah terakhir "Simpan template"

Untuk mengechek apakah sudah benar cara memasang tombol share ini bisa kamu lihat dengan meng-klik salah satu judul postingan blog kamu dan lihat dibawah artikel apakah sudah ada penampakan atau belum. Jika ternyata kok penampakannya tidak keluar coba ulangi sekali lagi "Cara Memasang Tombol Share Facebook, Buzz, Twitter, Digg di Blog" seperti diatas. ya sobat

silakan Follow dan Komen ya :)

0 komentar:

Post a Comment

Powered by Blogger.