Cara Memasang Logo Media Sosial di Blog

Kali ini saya akan shared bagaimana memasang media sosial di blog....

 Menampilkan atau memasang logo (link) akun media sosial Facebook, Twitter, Google+ dll. di sidebar blog sangat diajurkan para pakar media sosial. Tujuannya, agar menambah follower, member, atau liker.

Lagi pula, akun media sosial biasa kita gunakan juga untuk share posting blog, sehingga pengunjung bisa mengikuti update tulisan blog kita melalui akun media sosial mereka.

Jika Anda ingin memasang logo akun atau link media sosial seperti yang dipasang di blog CB ini (di sidebar kanan), ini dia caranya!

Cara Pasang Logo Media Sosial di Sidebar Blog

1. Login ke Blog Anda
2. Di Dashboard Blog, klik menu "Layout"
3. Klik "Add a Gagdet" > Pilih "Javascript/HTML"
4. Masukkan kode berikut ini setelah Anda ganti tulisan yang berwarna merah (ID Akun Sosmed Anda)

<div class="widget-content">
<style>
    #socialwidget {
   width: 300px;
   margin-left: -7px;
    }
    .TZ-social{
    padding: 10px 5px 10px 5px;
   border-bottom: 1px dotted #EBE2E2;
    }
    .TZ-social img:hover{opacity:0.8}
    .googleplus {
    background: #ffffff;
    border-top: 1px solid white;
    border-bottom: 1px solid #ebebeb;
    font-size: 12px;
    color: #000;
    padding: 9px 11px;
    ine-height: 1px;
    font-family: Verdana, Geneva, sans-serif;
    }

    .TZ {
    background: #ffffff;
    border-top: 1px solid white;
    font-size: 12px;
    color: #000;
    padding: 9px 11px;
    line-height: 1px;
    font-family: Verdana, Geneva, sans-serif;
    }
    .TZ span {
    color: #000;
    font-size: 11px;
    position: absolute;
    margin: -12px 100px;
    width: 310px;
    }
    #widgetbox .author-credit a {
    font-size: 10px;
    font-size: 10px;letter-spacing: 1px;
    color: #1E598E;
    text-decoration: none;
    }
    .TZDefault {border: 0px solid #dedede;text-shadow: #d08d00 1px 1px 0;background-color: #ff9b00;background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#ffca00),color-stop(1,#ff9b00));background: -webkit-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: -moz-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: -o-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: -ms-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: linear-gradient(center top,#ffca00 0,#ff9b00 100%);}
    .TZDefault:hover {background-color: #ff9b00;background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#ffe480),color-stop(1,#ff9b00));background: -webkit-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: -moz-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: -o-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: -ms-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: linear-gradient(center top,#ffe480 0,#ff9b00 100%);}
    </style>
    <div id="socialwidget">
    <!-- Begin Widget -->
    <div class="TZ-social">
    <!-- social ico -->
    <center>
    <a style="margin-right: 15px;" href="http://facebook.com/cbblogger" target="_blank" rel="nofollow">
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWvvTHvDPsTV5PU2_pJ05BjSmxMHGFA9-_DUl7qmIzpqm685BIWOooQbU7mrHMatBZt0LZW2_gewDcblT9GPDd3Fm5flJxJXbQQ7KvpPtJUBpNDxxNhAzIgbPpmV-jEXeGQga3YfVzU24/s1600/facebook.png" title="Facebook" /></a>
    <a style="margin-right: 12px;" href="http://twitter.com/Erlanggasa" target="_blank" rel="nofollow">
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKZHKi4PJChkmIJ6QEqsn6hglXEpy3pHHlTkA662wXBvacg7RZjZrd3rneYfpkbGaS-xYu7Ule3G3CIoZZ19e11wxUXj4-7QwjUENXeytKurJJP0AsJINREysDu5qqFlHZR1veQZC_qxI/s1600/twitter.png" title="Twitter" /></a>
    <a style="margin-right: 12px;" rel="me" href="https://plus.google.com/106869251529186655236/posts" target="_blank">
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWYy_z2wq_AGYEXc-NY2xej_eHb1J_pJVAelB0y9hWJYvcI3GG5p1h1n1gzDMcPvBsEHBugoWCGbu_dv2h6wLtgDjCsknWwr3ZENA_QRlYWgi8yuu9vuX1gdRymyMKeBA5S7qGP24tFvM/s1600/gplus.png" title="Google Plus" /></a>
    <a style="margin-right: 12px;" href="http://www.pinterest.com/cbblogger" target="_blank">
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIBaEnXsP1aJJB-sBmYxiOxXaN0uVHFRGcVRz3nuUlY3AThlvfxC74Yzxl6FeJFxkmP9QUu11_G9852E7Ieu_0qN1JRV8OOsVPZgrxmYcvhprSgaGSNkLm02eAyGKo0RrFVcKc3Nm0ltQ/s1600/pinterest.png" title="Pinterest" /></a>
    <a style="margin-right: 12px;" href="http://feeds.feedburner.com/erlanggasa" target="_blank" rel="nofollow">
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyTGquUqEqSdi4l6_6OOvaScFrrF_xWAT2toZIFrY0xpeIznzpAvEc-6GSxyFyQRjYOZblP3g6bMACjMZN0gIQEssn0-kALCfmWoks7dH7nBkWWbmRMGnlRoLe7NuqpYfQjgD7PKPaYS4/s1600/rss.png" title="RSS Feed" /></a>

    <a style="margin-right: 12px;" href="http://www.linkedin.com/in/ErlanggaSA" target="_blank" rel="nofollow">
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBLujlmpmAdh5w7RqXZd69Bb7pL7qVDI_3f4oLr9nNjIkhd_fgjukFUNz_SR92k50hSZkNhQoAEtCu1bngxsBixyBKvQAOXwR0rBMvWWARD_INjFZ7M7RIXugIyF6G8QYDQTif2zU3rfE/s1600/linkedin.png" title="Linkedin" /></a>
    </center>
    </div>
    <!-- End Widget -->
    </div>
</div>

 Sumber : http://contohblognih.blogspot.com/2014/11/cara-pasang-logo-media-sosial-di.html

Terima kasih.