Tutorial Membuat Share Button Keren di Bawah Postingan Blogspot

Tutorial sites - Share Button merupakan widget untuk membagi artikel blog atau website kalian, widget ini sangan berguna agar postingan kalian lebih di kenal banyak orang, simplenya seperti anda menshare status fb orang lain.
Berikut adalah Tutorial Membuat Share Button Keren di Bawah Postingan Blogspot, yang bersumber dari masyadi.com

1. Pertama , bagi yang belom login ke dasbhor blog silahkan masuk dulu
2. Seperti biasanya , pilih template => Edit Html
3. Salin dan tempelkan kode dibawah ini diatas kode ]]></b:skin>

   /* social share buttons */
   .social-buttons-box {
   height: 67px;
   background: url(http://1.bp.blogspot.com/-OYT-JDviP2k/VHrWc3ofkiI/AAAAAAAAEJs/yyNAhuCUELA/s1600/rect3799.png) no-repeat 200px 0px;
   margin:20px 0 15px;
   overflow:hidden;
   }
   .social-buttons {
   margin:0 0;
   height:67px;
   float:left;
   }
   .social-buttons .share {
   float:left;
   margin-right:10px;
   display:inline-block;
   }
   .share-btn {
   margin:15px 0 25px;
   height:20px;
   overflow:hidden;
   }

4. Selanjutnya copy kode berikut ini, lalu taruh di bawah kode <data:post.body/>atau bisa juga <div class='post-footer'>

   <div class='social-buttons-box'>
    <div class='social-buttons'>
     <div class='share gplus'><div class='g-plusone' data-size='tall' expr:data-href='data:post.url'/></div>
     <div class='share like'><div class='fb-like' data-action='like' data-layout='box_count' data-share='false' data-show-faces='false' expr:data-href='data:post.url'/></div>
     <div class='share tweet'><a class='twitter-share-button' data-count='vertical' data-lang='en' data-size='normal' expr:data-url='data:post.url' href='https://twitter.com/share'>Tweet</a></div>
    </div>
    </div>
    <!-- <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?&#39;http&#39;:&#39;https&#39;;if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+&#39;://platform.twitter.com/widgets.js&#39;;fjs.parentNode.insertBefore(js,fjs);}}(document, &#39;script&#39;, &#39;twitter-wjs&#39;);</script>-->
    <div style='clear: both;'/>

5. Kemudian kita pasang kode js pemanggil sosmed tadi , caranya cari kode</body> dan paasang kode dibawah ini diats kode tersebut :

   <script>
     window.___gcfg = {lang: &#39;id&#39;};
   
     (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>
   <script>
   !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=&quot;//platform.twitter.com/widgets.js&quot;;fjs.parentNode.insertBefore(js,fjs);}}(document,&quot;script&quot;,&quot;twitter-wjs&quot;);
   </script><div id='fb-root'/>
   <script type='text/javascript'>
   //<![CDATA[
   (function(d, s, id) {
     var js, fjs = d.getElementsByTagName(s)[0];
     if (d.getElementById(id)) return;
     js = d.createElement(s); js.id = id;
     js.src = "//connect.facebook.net/id_ID/all.js#xfbml=1&version=v2.0";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
   //]]>
   </script>

6. Terkahir Klik Save dan lihat hasilnya
7. Taraa kini sobat sudah bisa mebuat sendiri share button ala mas sugeng yang keren