Friday

Cara Membuat Widget Sosial Media Melayang Keren

Selamat datang di Blog taharonqi.blogspot.com, pada kesempatan kali ini saya akan sedikit berbagi kepada sobat-sobat blogger semua tentang sebuah cara membuat widget sosial media melayang disamping kanan blog yang tentunya pasti keren, dan untuk hasilnya nanti seperti apa sobat bisa lihat gambar di bawah ini :


Gimana keren kan sobat?
Pasti keren donk hebat Oke disini saya tidak akan memberikan cara yang harus mengobrak - abrik template sobat, tapi disini saya akan memberikan cara yang sangat - sangat mudah, sobat bisa mengikuti langkah - langkahnya berikut ini :
  • Login ke Akun Blogger sobat
  • Pilih Tata Letak
  • Klik Tambahkan Gadget
  • Pilih HTML/Javascript
  • Masukkan kode di bawah ini :
<style>
.farespo-fixedmenuinfo{ background:url('http://2.bp.blogspot.com/-LZhllJw9a-Q/UqGs_lFNgEI/AAAAAAAAAmA/GcohA4-aEr4/s1600/info.png');background-repeat:no-repeat;width:43px;height:125px;position:fixed;right:0px;top:33px; z-index:1000;}
.farespo-fixedmenuinfo1{ background:url('http://3.bp.blogspot.com/-7fDR1Nqj-m8/UqGtCmOi3xI/AAAAAAAAAmQ/WRioN7gvy2o/s1600/info1.png');background-repeat:no-repeat;width:150px;height:125px;position:fixed;right:0px;top:33px; z-index:1100;}
.farespo-fixedmenuinfo_1{margin:0px 0 0 43px}
.farespo-fixedmenu{ background:url('http://1.bp.blogspot.com/-FaeRKNmFDX8/Ud16d2_PZFI/AAAAAAAAAsM/5xugOK5YAuE/s1600/facebook.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:160px; z-index:1000;}
.farespo-fixedmenu1{ background:url('http://3.bp.blogspot.com/-W7Z5XKfLWd8/Ud16eM8AadI/AAAAAAAAAsQ/cv7fgYD5fiE/s1600/facebook-hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:160px; z-index:1100;}
.farespo-fixedmenu_1{margin:0px 0 0 43px}
.farespo-fixedmenutw{background:url('http://1.bp.blogspot.com/-WeUDB_HkbWA/Ud16fP78JoI/AAAAAAAAAsk/1k2WNVRCBvo/s1600/twitter.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:205px;z-index:1000;}
.farespo-fixedmenutw1{background:url('http://1.bp.blogspot.com/-AEj1b-df974/Ud16fs5CVkI/AAAAAAAAAss/HYNXT4cJpPI/s1600/twitter_hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:205px; z-index:1100;}
.farespo-fixedmenutw_1{margin:0px 0 0 43px}
.farespo-fixedmenufb{background:url('http://1.bp.blogspot.com/-hj1nQIe4NPQ/Ud16cbNkV1I/AAAAAAAAAr0/EswfGA-rVjM/s1600/Gplus.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:250px; z-index:1000;}
.farespo-fixedmenufb1{background:url('http://4.bp.blogspot.com/-umCgVIZ-wTs/Ud16c1EAICI/AAAAAAAAAr8/5ZSWR05S2B8/s1600/Gplus_hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:250px; z-index:1100;}
.farespo-fixedmenufb_1{margin:0px 0 0 43px}
.farespo-fixedmenurss{background:url('http://2.bp.blogspot.com/-YYHDO5sujkE/UqG3vhbC-sI/AAAAAAAAAmg/qmLDQNbn0Gc/s1600/rss.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:295px; z-index:1000;}
.farespo-fixedmenurss1{background:url('http://4.bp.blogspot.com/-SDcrlF3MTAU/Ud16dDy_wnI/AAAAAAAAAsE/QjdRXR9BekM/s1600/RSS-hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:295px; z-index:1100;}
.farespo-fixedmenurss_1{margin:0px 0 0 43px}
</style>
<div class='farespo-fixedmenuinfo' onmouseout='this.className=&apos;farespo-fixedmenuinfo&apos;' onmouseover='this.className=&apos;farespo-fixedmenuinfo1&apos;'><div class='farespo-fixedmenuinfo_1'>
<a href='https://taharonqi.blogspot.com' target='_blank'><img alt='Happy to Share' src='http://4.bp.blogspot.com/-vbyEG2SsgNk/UqGtBdC72sI/AAAAAAAAAmI/HgoCDFke9bo/s1600/info2.png' title='Happy to Share'/></a><br/>
</div></div>
<div class='farespo-fixedmenu' onmouseout='this.className=&apos;farespo-fixedmenu&apos;' onmouseover='this.className=&apos;farespo-fixedmenu1&apos;'><div class='farespo-fixedmenu_1'>
<a href='https://www.facebook.com/taharonqiblog' target='_blank'><img alt='Like us on Facebook' src='http://3.bp.blogspot.com/-jWaYNYywDf0/Ud1_G7YS7RI/AAAAAAAAAtA/8b40N46byIQ/s1600/facebook-hover1.png' title='Like us on Facebook'/></a><br/>
</div></div><div class='farespo-fixedmenutw' onmouseout='this.className=&apos;farespo-fixedmenutw&apos;' onmouseover='this.className=&apos;farespo-fixedmenutw1&apos;'><div class='farespo-fixedmenutw_1'>
<a href='https://twitter.com/tahar_onqi' target='_blank'><img alt='Follow us on Twitter' src='http://3.bp.blogspot.com/-ppQkr4BjSVQ/Ud1_HkD_OBI/AAAAAAAAAtU/xN5krYZPBhY/s1600/twitter_hover1.png' title='Follow us on Twitter'/></a><br/>
</div></div><div class='farespo-fixedmenufb' onmouseout='this.className=&apos;farespo-fixedmenufb&apos;' onmouseover='this.className=&apos;farespo-fixedmenufb1&apos;'><div class='farespo-fixedmenufb_1'>
<a href='https://plus.google.com/112904990934526067754' target='_blank'><img alt='Recommend us on Google Plus' src='http://3.bp.blogspot.com/-fPA1gJ6k9Bk/Ud1_G_aexzI/AAAAAAAAAtI/rcqioslWMN0/s1600/Gplus_hover1.png' title='Recommend us on Google Plus'/></a><br/>
</div></div><div class='farespo-fixedmenurss' onmouseout='this.className=&apos;farespo-fixedmenurss&apos;' onmouseover='this.className=&apos;farespo-fixedmenurss1&apos;'><div class='farespo-fixedmenurss_1'>
<a href='http://feeds.feedburner.com/taharonqi' target='_blank'><img alt='Subscribe me on RSS' src='http://3.bp.blogspot.com/-1XXERhy9eeQ/Ud1_GgCBHTI/AAAAAAAAAs8/TIB78w-42eg/s1600/RSS-hover1.png' title='Subscribe me'/></a><br/>
</div></div>
Keterangan :
Tulisan warna merah    : ganti dengan URL blog sobat
Tulisan warna biru       : ganti dengan URL Fanpage/Facebook sobat
Tulisan warna Orange : ganti dengan URL Twitter sobat
Tulisan warna ungu     : ganti dengan URL Google Plus sobat
Tulisan warna kuning  : ganti dengan URL Feedburner sobat

  • Klik Simpan dan lihat hasilnya
Mungkin itu saja yang dapat saya share pada kesempatan kali ini, jika ada yang kurang jelas sobat bisa berkomentar, terima kasih.

No comments:

Post a Comment