Cara Membuat Widget Social Media Melayang di Blog

Home » tutorial blog » Cara Membuat Widget Social Media Melayang di Blog

Cara Membuat Widget Social Media Melayang di Blog

Cara Membuat Widget Social Media Melayang di Blog - Assalamu'alaikum, sobat blogger? Pada postingan kali ini saya akan kembali membahas tutorial blog tentang Cara Membuat Widget Social Media Melayang di Blog. Berikut adalah contoh preview widgetnya.

<style>
.tutorialblogz-fixedmenu{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_vhXp1zQF85CgG-WoKM4AC4hu6-sUM5WEqht6YZrMMZkTLFAOIrUpUQVwsBvf2lnQGtRyN1eGmhqAWFuL9064n1TjgsSJchJzoF3DiDdV1WphBXJuWDfhRhuigjW03yI22VkCwyzKLww/s1600/facebook.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:160px; z-index:1000;}
.tutorialblogz-fixedmenu1{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3bSnPw2ieVVHTXWXRqLUqmUZ571_3LZKNCLkJj2q8_TxjTojEVHfMsJ3JrcvA4PZ5svD7bHxk3pp1uaC_r8buZf06MNI3jeG4PeVuyRePOxRG0bg_s9QNLT0Wc7mC9ulHi0zHjW-3BS8/s1600/facebook-hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:160px; z-index:1100;}
.tutorialblogz-fixedmenu_1{margin:0px 0 0 43px}
.tutorialblogz-fixedmenutw{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZIHmclnkmwsmDD3XF20aBJI1McTYM0ZapFr6NDyIVKbUMRf_-uURGvM43PGBPN_HbEwq4vmaq2066UmFKhTdKobi2kc_O5K7SWkfLlEZ9W7kEsFTbtpBA5Uho1g-kM_Is1FAUd5Iw2D4/s1600/twitter.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:205px;z-index:1000;}
.tutorialblogz-fixedmenutw1{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5iHW2pjermo3Ak7FsNZP48q0VR8HXivaj9qwCh6WAC365wNwPcy6Cwn23C4jJwjB_XReOrdd7jF3V3xxltKHDeqExFFVg5hha72e5cs8onwRnZ4UNGWcQEX3iyTabJDD-wQ4R1gAH_sI/s1600/twitter_hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:205px; z-index:1100;}
.tutorialblogz-fixedmenutw_1{margin:0px 0 0 43px}
.tutorialblogz-fixedmenufb{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGXfxv0kfpx-f0pCqcg-6pCV1VcW2cPU7m8ZAMhlOQ5tyPJIPZwKr-baVaWiXC2tT7vfDx34SnFg7STwySGahSmq-HA7Eg2MrfVc9C-y-BKwRQ4GhL7KedGYZWuQNktYAxNUKcY16s10g/s1600/Gplus.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:250px; z-index:1000;}
.tutorialblogz-fixedmenufb1{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_eF4CUg8_cZQ7xbvkJANb9IRGoyKVFimpUtiWUtRXqO5Xux3XGCGZ7wWJV6U0gYHEk8CJahs7XNK8uTf8TYPZmJCYZ_5vGeMwccuToZBuZonlzgyEXpii0iMdEQkJOyPN6HJ_Oj4BZ_I/s1600/Gplus_hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:250px; z-index:1100;}
.tutorialblogz-fixedmenufb_1{margin:0px 0 0 43px}
.tutorialblogz-fixedmenurss{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOXeo1RC-JLCokGPS4QTNJVxc2zX4woLE6s627iod8WY3kwnGhEgzlqGBKZAtHI8ovktrWN-wGHwTj_NMc06cwPGt0Z4lZ8AQuh0NgkkI6hZpnVTgh8K6cBoZd_ysvOWV9XBNByKK5914/s1600/rss.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:295px; z-index:1000;}
.tutorialblogz-fixedmenurss1{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3XFv3os83NZMVYIVZVTIpuxGpPXHReGbicFdnKW4vTFfi_2x1fgkrbXSL2VwiqCV1gEMxyTN8RQ_61REDkkAFewWYiOoJzqcv_ulSQHz5MGiQz1V3GYA7EvdoLr7AsnS31HAvQ-90UGE/s1600/RSS-hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:295px; z-index:1100;}
.tutorialblogz-fixedmenurss_1{margin:0px 0 0 43px}
</style>
<div class='tutorialblogz-fixedmenu' onmouseout='this.className='tutorialblogz-fixedmenu'' onmouseover='this.className='tutorialblogz-fixedmenu1''><div class='tutorialblogz-fixedmenu_1'>
<a href='https://www.facebook.com/sadewacs' target='_blank'><img alt='Like us on Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHMh0ckp7BfM_mIO9QzjyjtiX5DHCtqgtdCclPEvOpfh2oU7n7UbNX_4XcApdxXNIjBUrjmCuCQSDudCw9sv_Jt5WMvXCSVunLVhXPwq8_rgsHsb3HHrf6IaEH5-4Ff-NS9Eh8_VHen7o/s1600/facebook-hover1.png' title='Like us on Facebook'/></a><br/>
</div></div><div class='tutorialblogz-fixedmenutw' onmouseout='this.className='tutorialblogz-fixedmenutw'' onmouseover='this.className='tutorialblogz-fixedmenutw1''><div class='tutorialblogz-fixedmenutw_1'>
<a href='https://twitter.com/siwade' target='_blank'><img alt='Follow us on Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjw5fX6yytDxC8IZGzG20asSX1rsE3ZiuwQG4b9ztb1m18Zku3UFPyrXte-KFy3GLVamvWB4Y5ues-BeOpeVIcZxblkHFAp6Uv2Nm74djiDydoTazZYaWZ3D-1aMhQSlu8WrXSRc3BjMIo/s1600/twitter_hover1.png' title='Follow us on Twitter'/></a><br/>
</div></div><div class='tutorialblogz-fixedmenufb' onmouseout='this.className='tutorialblogz-fixedmenufb'' onmouseover='this.className='tutorialblogz-fixedmenufb1''><div class='tutorialblogz-fixedmenufb_1'>
<a href='https://plus.google.com/102807084759670981471' target='_blank'><img alt='Recommend us on Google Plus' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjY8j3zkNPaiecA_fqTpEwbV4iFTWvg3Vh1h-tv6uZEAq1RKBsz7nif9debJcOdN-tmBcSKcknwaOAYWb-orIEaa9LYNX1VSZHK8_imFmyfJ3zWPQjQFcHzwVALSVE4gRxniILyHebeCY8/s1600/Gplus_hover1.png' title='Recommend us on Google Plus'/></a><br/>
</div></div><div class='tutorialblogz-fixedmenurss' onmouseout='this.className='tutorialblogz-fixedmenurss'' onmouseover='this.className='tutorialblogz-fixedmenurss1''><div class='tutorialblogz-fixedmenurss_1'>
<a href='http://feeds.feedburner.com/TutorialBlogz' target='_blank'><img alt='Subscribe me on RSS' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNeOml3U8BLl3aAS-fuYhpLkwQolYzjTC2uFdKvYBgOhdg4Dyl_3eWPaKD-Hbm7_qkxsNsBrGTY27OjNLqWNxQbQGYP7on5TGNAXwvSl2cAh5VVdQvLFfNCYHW1OlJtQtxDbF2_zDUoWY/s1600/RSS-hover1.png' title='Subscribe me'/></a><br/>
</div></div>

Keterangan :
Sadewacs : Ganti dengan username Facebook Fanpage Anda.
Siwade : Ganti dengan username Twitter Anda.
102807084759670981471 : Ganti dengan ID Google+ Anda.
TutorialBlogz : Ganti dengan ID Feedburner Anda.

5. Terakhir, klik Save, dan lihat hasilnya pada blog sobat.

Demikianlah Cara Membuat Widget Social Media Melayang di Blog,
Semoga bermanfaat !