Contoh hasilnya ada di blog ini

Cssnya:
.don-btn{outline:none;display:inline-block;padding:6px 12px;font-size:13px;font-weight:400;line-height:1.428571429;text-align:center;white-space:nowrap;border:1px solid transparent;border-radius:4px;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;background-image:-webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.25)),color-stop(50%,rgba(0,0,0,.1)),color-stop(75%,hsla(0,0%,51%,0)),to(hsla(0,0%,100%,.1)));background-image:-webkit-linear-gradient(bottom,rgba(0,0,0,.25),rgba(0,0,0,.1) 50%,hsla(0,0%,51%,0) 75%,hsla(0,0%,100%,.1));background-image:linear-gradient(0deg,rgba(0,0,0,.25) 0,rgba(0,0,0,.1) 50%,hsla(0,0%,51%,0) 75%,hsla(0,0%,100%,.1));text-shadow:0 -1px 0 rgba(0,0,0,.2);-webkit-box-shadow:inset 0 1px 0 hsla(0,0%,100%,.15),0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 0 hsla(0,0%,100%,.15),0 1px 1px rgba(0,0,0,.075);color:#fff;background-size:100% 200%;background-position:top;-webkit-transition:all .25s ease-in;transition:all .25s ease-in}.don-share *,.don-share :after,.don-share :before{-webkit-box-sizing:border-box;box-sizing:border-box}

.don-share{margin:5px -10px 0 0!important;padding-left:80px}
.don-share .don-share-total{margin-left:-80px!important}
.don-share.don-active .don-share-total:after{bottom:15px!important}
.don-share .don-share-expand:before{font-weight:700!important;font-size:28px!important;line-height:19px!important}
.don-share .don-share-expand{max-height:34px}
button.don-share-expand{font:28px Arial!important;}
.don-btn{border-radius:0!important;background-image:none!important;-webkit-box-shadow:none!important;box-shadow:none!important}
.don-btn:hover{color:#fff;background-position:bottom;-webkit-box-shadow:none!important;box-shadow:none!important;opacity:.8}
.don-share .don-btn.don-share-expand:hover{color:#666!important}

HTML:

<div class="don-share" data-limit="3">
<div class="don-share-total"></div>
<div class="don-share-facebook"></div>
<div class="don-share-twitter"></div>
<div class="don-share-google"></div>
<div class="don-share-linkedin"></div>
<div class="don-share-pinterest"></div>
<div class="don-share-tumblr"></div>
<div class="don-share-stumbleupon"></div>
<div class="don-share-reddit"></div>
<div class="don-share-pocket"></div>
</div>
<div class='clear'/>
</b:if>

Letaknan diatas
kode dibawah ini :
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
function downloadJSAtOnload(){var d=document.createElement("script");d.src="https://cdn.rawgit.com/KompiAjaib/js/master/share-donreach.js",document.body.appendChild(d)}window.addEventListener?window.addEventListener("load",downloadJSAtOnload,!1):window.attachEvent?window.attachEvent("onload",downloadJSAtOnload):window.onload=downloadJSAtOnload;
//]]>
</script>
</b:if>