Cara Membuat Sosial Profile Widget Di Blogger - Pada artikel saya ini saya akan menshare cara membuat sosial profile widget di blogger untuk sahabat seosc. Dengan hanya menyeret widget ini ke sidebar atau area widgetized, Anda dapat dengan mudah menempatkan ikon link ke berbagai profil sosial sobat seperti facebook,twitter,youtube,dll.
Untuk teman-teman yang ingin memasangnya hanya dengan cara yang mudah sekali.
Hanya ikuti langkah-langkahnya dibawah ini:
1. Login ke Blogger.
2. Klik Tata Letak.
3. Klik Tambahkan Gadget.
4. Cari HTML/JavaScript.
5. Masukkan kode dibawah ini di dalam HTML/JavaScript.
<div class='seosc-social'>
<li><a class="fb" href=http://www.facebook.com/melsadinata rel="nofollow"></a></li>
<li><a class="tw" href=http://twitter.com/elsamuhammad></a></li>
<li><a class="gp" href="https://plus.google.com/123456789123"></a></li>
<li><a class="pi" href=http://pinterest.com/melsadinata rel="nofollow"></a></li><li><a class="in" href=https://www.linkedin.com/in/melsadinata rel="nofollow"></a></li>
<li><a class="yt" href=http://www.youtube.com/melsadinata></a></li>
<li><a class="fd" href=http://feeds.feedburner.com/seosc rel="nofollow"></a></li>
</div>
<style>
.seosc-social{width:285px}.seosc-social li{position:relative;cursor:pointer;padding:0;list-style:none}.seosc-social .fb,.tw,.gp,.pi,.in,.yt,.fd{z-index:7;float:left;margin:1px;position:relative;display:block}.seosc-social.fb{background:url(//goo.gl/6xmUk) no-repeat center center #1f69b3;width:140px;height:141px}.seosc-social .tw{background:url(//goo.gl/oyiFK) no-repeat center center#43b3e5;width:68px;height:70px}.seosc-social.gp{width:69px;height:70px;background:url(//goo.gl/oT0kF) no-repeat center center #da4a38}.seosc-social .pi{background:url(//goo.gl/7olxx) no-repeat center center#d73532;width:68px;height:69px}.seosc-social .in{background:url(//goo.gl/PhFhj) no-repeat center center #0097bd;width:69px;height:69px}.seosc-social .yt{background:url(//goo.gl/zcwjB) no-repeat center center #e64a41;width:140px;height:69px}.seosc-social .fd{background:url(//goo.gl/lhBP1) no-repeat center center #e9a01c;width:140px;height:69px}.seosc-social li:hover.fb{background:url(//goo.gl/MH8AP) no-repeat center center #1f69b3}.seosc-social li:hover.tw{background:url(//goo.gl/hHRHv) no-repeat center center #43b3e5}.seosc-social li:hover.gp{background:url(//goo.gl/wva4B) no-repeat center center #da4a38}.seosc-social li:hover.pi{background:url(//goo.gl/IORvy) no-repeat center center #d73532}.seosc-social li:hover.in{background:url(//goo.gl/2zHrm) no-repeat center center #0097bd}.seosc-social li:hover.yt{background:url(//goo.gl/I1c4a) no-repeat center center #e64a41}.seosc-social li:hover.fd{background:url(//goo.gl/CjzDP) no-repeat center center #e9a01c}
</style>
6. Klik Simpan
0 komentar
Post a Comment