Cara Menambahkan Widget Social Subscription

Ada banyak cara sederhana untuk menampilkan Widget Berlangganan untuk sebuah blog. Salah satunya  dengan memasang Widget Social Subscription pada bagian footer.

Tidak bisa dipungkiri bahwa jejaring sosial mempunyai peranan penting dalam meningkatkan lalu lintas visitor yang lumayan signifikan, namun dalam memilih widget kita harus menyesuaikanya dengan apa yang kita butuhkan.

Nah bagi yang sedang mencari Widget Social Subscription untuk blog Responsive sepertinya widget ini bisa dijadaikan referensi karena telah mendukung tampilan mobile. Widget ini mirip dengan widget Metro style dengan beberapa perubahan sehingga terlihat lebih elegan.

Cara memasangnya pada Blogger

1. Login ke Blogger
2. Masuk ke bagian Layout / Tata Letak
3. Klik Tambahkan Gadget.
4. Pilih HTML/Javascript.
5. Copy Kode dibawah ini dan Pastekan di HTML/Javascript.

<style scoped='scoped'>
.Mbt-Social-metro { 
    width: 960px; 
    float: left; 
    margin: 0; 
    padding: 1em 0; 
}
.Mbt-Social-metro ul { 
    margin: 0; 
    padding: 0; 
}
.Mbt-Social-metro ul li { 
    list-style: none; 
    list-style-type: none; 
    padding: 0; 
    text-transform: none; 
    margin: 0; 
    float: left; 
    display: inline-block; 
    width: 20%; 
}
.Mbt-Social-metro ul li a { 
    font-size: 80%; 
    color: #fff!important; 
    display: block; 
}
.Mbt-Social-metro ul li a:hover { 
    color: #000!important; 
    background-color: #999; 
    text-decoration: none; 
}
idc-scoail ul li a, ul li a:hover { 
    -moz-transition: all 0.3s ease-in-out; 
    transition: all 0.3s ease-in-out; 
    -webkit-transition: all 0.3s ease-in-out; 
}
.Mbt-Social-metro ul li .rss { 
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaCR148stbtfWFrhkOgYJQsPUqUNKV_VKsjdwBFGfcnpfiNNdv7inxFnCyn3P4g1PLfF1Kxfq7Fswf6l337DJmqa2ULMSZF0KoRfXwG05__gfsbOsf-TgluJNXO4XIjXbJXEESVO78DGIR/s1600/RSS-1.png") no-repeat scroll 10px center #F87E12; 
    background-size: 20px; 
    padding: 10px 50px; 
}
.Mbt-Social-metro ul li .twitter { 
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBOlHMJefWbd3MRmBf2s41caTYGMb60mVzc2m8UOTT9sBLJ4x1hRYfCQ6eU8RGInFFxVbWxoXlQH7v8qNWt9B8czAH6dmlnUPiyH2CnHU1q0wZCXFCQOsr2bqbu6E2w4Nym-9OkQhyy8mB/s1600/Twitter.png") no-repeat scroll 10px center #4CACEE; 
    background-size: 20px; 
    padding: 10px 50px; 
}
.Mbt-Social-metro ul li .facebook { 
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXk4oXSTBVVGFfKaLfMLUD1Rv8pZ2_qRwGj9x9VH0bqw0omrnwPULOmVePneobhj__hj6Nch8BoSDxEsq8EH54quoZDoSEFde3lJZentQLRoURfpCfdfWFR_s1e0lBUkTUh4SrM1iNi2i_/s1600/Facebook-1.png") no-repeat scroll 10px center #3B5998; 
    background-size: 20px; 
    padding: 10px 50px; 
}
.Mbt-Social-metro ul li .google { 
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEio07QYd3vyIFDIMhd8HG48RCpdLjymGYeMvyxq9sQR75JqaIQrgR31ieTmyU8PS3g6kqnyugyPj2kIjjmf6doLQm_LeCYj_MP0hh4UJIBt6uZpjR_HtIZTfwNCaLBkL_HIMCDRc9cofI3O/s1600/google.png") no-repeat scroll 10px center #D44937; 
    background-size: 20px; 
    padding: 10px 50px; 
}
.Mbt-Social-metro ul li .linkedin { 
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxS1zEP7cfKtawlDPYpboi3atejPAxxz3xhOMj3frWyvwJIwFICxwmvklysbEuZS-2NoAl5Q8MINRWrZDRiD8SpLZ10zkCDkpffY4GpD3pKOESCrabMcQtU4jumEmHWF2EJ-qOYb4EaFoY/s1600/LinkedIn-1.png") no-repeat scroll 10px center #3692C3; 
    background-size: 20px; 
    padding: 10px 50px; 
}
/* width of 768px */ 
@media only screen and (min-width: 768px) and (max-width: 959px) { 
    .Mbt-Social-metro ul li { 
        width: 50%; 
    }; 
}
/* width of 480px */ 
@media only screen and (min-width: 480px) and (max-width: 767px) { 
    .Mbt-Social-metro ul li { 
        width: 50%; 
    }; 
}
/* width of 320px */ 
@media only screen and (max-width: 480px) { 
    .Mbt-Social-metro ul li { 
        width: 100%; 
    }; 
}
</style>
<div class='Mbt-Social-metro'> 
<ul> 
<li><a class='rss' href='http://feeds.feedburner.com/Sharexid' title="Subscribe our Feed">Subscribe our Feed</a></li> 
<li><a class='twitter' href='https://twitter.com/sharexid' title="Follow me on Twitter">Follow me on Twitter</a></li> 
<li><a class='facebook' href='https://www.facebook.com/pages/Sharexid/219976191476398' title="Find me on Facebook">Find me on Facebook</a></li> 
<li><a class='google' href='https://plus.google.com/u/0/112006181062808322643' title="Join me on Google">Join me on Google+</a></li> 
<li><a class='linkedin' href='http://in.linkedin.com' title="Connect with LinkedIn">Connect with LinkedIn</a></li> 
</ul> 
</div>

Keterangan :
Sesuaikan yang berwarna biru

Selesai dan lihat hasilnya. Sekian beberapa informasi tentang Cara Menambahkan Widget Social Subscription. Semoga bermanfaat dan semoga membantu :) terimaksih telah berkunjung ke sharexid.blogspot.com. Happy Blogwalking :))