CSS Share Button Di Postingan

Cara Pemasangan

• Step 1  Buka blogger.com lalu pilih blog  anda
• Step 2  Pilih template lalu edit html
• Step 3  Cari kode ]]></b:skin> dengan mengklik   CTRL +F 
• Step 4  Copy kode berikut lalu pastekan pada diatas kode ]]></b:skin> tadi

@import url(http://weloveiconfonts.com/api/?family=zocial);
[class*="zocial-"]:before {
  font: 2.5em/2em 'zocial', sans-serif;
  color: white;
  line-height: 2.2;
}

.post-social .facebook {
  background: #3B5998;
}
.post-social .twitter {
  background: #4099FF;
}
.post-social .googleplus {
  background: #db5a3c;
}
.post-social .social {
  float: left;
}
.post-social .zocial-facebook {
  margin: 0 15px;
}
.post-social .zocial-twitter {
  margin: 0 25px;
}
.post-social .zocial-googleplus {
  margin: 0 25px;
}
.post-social li {
  min-width: 180px;
  width: 210px;
  height: 80px;
  cursor: pointer;
  list-style: none;
  text-align: left;
  float: left;
}
.post-social li:hover [class*="zocial-"]:before {
  opacity: 0.5;
  text-align: right;
}
.post-social li:hover iframe {
  opacity: 1;
}
.post-social li iframe {
  margin-top: 30px !important;
  opacity: 0;
  transition: all .3s ease-in-out;
}
.post-social li .fb_ltr {
  margin: 30px 20px !important;
}

• Step 5  Selanjutnya kita pergi ke bagian template
• Step 6  Edit HTML
• Step 7  Cari kode <data:post.body/> dengan mengklik   CTRL +F 
• Step 8  Copy kode berikut lalu pastekan pada diatas kode <data:post.body/> tadi

<ul class="post-social">
  <li class="facebook">      <span class="social zocial-facebook"></span>    <div class="fb-like" data-send="false" data-layout="button_count" data-width="250" data-show-faces="true"></div>  </li>  <li class="twitter">      <span class="social zocial-twitter"></span>    <a href="https://twitter.com/share" class="twitter-share-button" data-via="Rushtips">Tweet</a>  </li>  <li class="googleplus">        <span class="social zocial-googleplus"></span>    <g:plusone size="medium"></g:plusone>  </li></ul>

<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></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="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
<div id="fb-root"></div><script>(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/en_US/all.js#xfbml=1";  fjs.parentNode.insertBefore(js, fjs);}(document, 'script', 'facebook-jssdk'));</script>

• Step 9  Simpan lalu cek bog anda untuk melihat hasilnya

go back