Cara Membuat Tombol Share Artikel Blog Ke Facebook, Twitter dan Google+ di Blog

Cara Membuat Tombol Share Artikel Blog Ke Facebook, Twitter dan Google+ - Tentunya sudah tidak asing lagi untuk anda,  disini saya akan membagi trik untuk membuat Tombol Share Artikel Blog Ke Facebook, Twitter dan Google+ di blog.

Akun Sosial media tentunya memiliki banyak manfaat untuk anda apabila dengan benar cara menggunakannya, tentunya juga memiliki manfaat dengan memasang media sosial di akun Blogger anda karena dapat menambah trafik sebuah Blog.
untuk penerapnnya berikut ini langkah-langhanya :

1. Anda masuk keakun Blogger
2. Pilih Template » Edit HTML
3. Dengan menggunakan ctrl+F anda cari kode  ]]></b:skin>
4. Lalu anda terapkan kode CSS berikut sebelum kode  ]]></b:skin>

.share {
border-top: 2px solid #dedede;
font-family: "Exo", Arial, sans-serif;
font-size: 14px;
padding: 10px 0 0 0;
margin-top: 25px;
position: relative;
}

5. Masih menggunakan cara yang sama dengan menggunakan ctrl+F anda cari kode <data:post.body/>
6. Selanjutnya anda terapkankode berikut dibawah kode <data:post.body/>

<div class='share'>
<span style='float:left;margin-right:15px;margin-top:3px'>Share this Artikel</span>
<a name='fb_share' type='button_count'/>
<script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'>
</script>
<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 style='float:left;padding-left:10px;'>
<!-- Place this tag where you want the +1 button to render -->
<g:plusone size='medium'/>
<!-- Place this render call where appropriate -->
<script type='text/javascript'>
(function() {
var po = document.createElement(&#39;script&#39;); po.type =
&#39;text/javascript&#39;; po.async = true;
po.src = &#39;https://apis.google.com/js/plusone.js&#39;;
var s = document.getElementsByTagName(&#39;script&#39;)[0];
s.parentNode.insertBefore(po, s);
})();
</script>
</div>
</div>
</b:if>

Penjelasan
Perlu anda perhatikan kode <data:post.body/> biasanya terdapat dua sampai empat kode, anda bisa terapkan kode diatas di kode nomor dua, apabila tidak muncul sebaikknya anda coba satu per-satu.

7.  Anda simpan template

Demikaian Cara Membuat Tombol Share Artikel Blog Ke Facebook, Twitter dan Google+ di Blog , Semoga bermanfaat!

Share this post