Membuat Widget Sosial Media Melayang Di Blog

Membuat Widget Sosial Media Melayang Di Blog | Widget Sosial Media Banyak dan beraneka ragam tapi berbeda dengan widget yang satu ini, karena widget ini akan mengikuti kursor kebawah atau ke atas dan widget dengan effect hover di setiap icon sosial medianya, widget ini praktis karena hanya memasukan kode kedalam Html/Javascript bukan di HTML Template.

Kalau sobat tertarik di ingin belajar membuatnya, ikutilah artikel ini sampai selesai, sebelum itu lihat dulu demonya dan jadinya dibawah ini dan daftar artikel yang membahas sosial media lain seperti bawah ini dan langsung saja kita coba membuatnya dibawah ini :

Demo

Artikel Menarik lainnya Tentang Sosial Media :

Membuat Widget Sosial Media Dengan Effect Hover

Widget Subsribe Dan Sosial Media Super Keren

Widget Sosial Media Icon Dengan Search Box Untuk Blogger

Widget Subsribe Dengan Sosial Media Biru Untuk Blogger

Masuk ke Blogger
Klik menu ''Tata Letak''
Klik ''Tambah Gadget''
Pilih Gadget ''HTML/JavaScript
Masukkan kode dibawah ini di dalam gadget tersebut

<style>

.fixedmenu{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1CvkCBpjUAn1zj3WCxGuT_waTVONnMvCouLAYYHZtEshZokFTYoicDLCUH4jXOgVi3V_L3d749GRACWFhFy9xUjVI4y4N-3pjUvNZoG01BONSMvxCobhyphenhyphenBG9VG-aLvLdp8QZX74t4_hk/s1600/facebook.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:160px; z-index:1000;}

.fixedmenu1{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYq1bKC4gn8vNO683UHrgDdoWGu0cuMkXVEBYH7QR6PCxzjdCV-7jouDBLgyaAcXYopjOELocfst39yCJF7FUQk0EY2VISBTsqPTRXAUFZSrnmZ9TZgOhJXMFGhEQ7dXJ0klWYxxNYCS0/s1600/facebook-hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:160px; z-index:1100;}

.fixedmenu_1{margin:0px 0 0 43px}

.fixedmenutw{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwh7pKaL4Q0XaK3Wz071hZLoU_1vGUYGKJMtuOWc8aeo4Ig15NqB53Ki9u5_AVgmGDnBLmNlJGpTH-MAAGfGMKN5F1aGXjAKSs-HsHwjiTJM_OivFBP9z08uE4jbAaVRMdmeGYosZqj00/s1600/twitter.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:205px;z-index:1000;}

.fixedmenutw1{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxo0fuloInAOmBfAPERTCoCLSadBlgFCMH6LgxSXWUPEyEOav_FSR8KRfsHNEykVMuWXJyYciq9TTDniiuizWPwr2WEF0tDZD4YtAEbIFvxIzzJI9hvLSSpawwuBs2O-tVwsJumX4hcNk/s1600/twitter_hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:205px; z-index:1100;}

.fixedmenutw_1{margin:0px 0 0 43px}

.fixedmenufb{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtP3w_CNAMup2qPhbS4NbtrW6F9yKMlKgw9PVw0Rz6CHqW7-iN823awAjxnpo-0QAUePFLHPZ1RMUgmPIqcru6i4Iu6QwyR_wu3SKsABCIS3zjm1owqt3DQWn_UKOCodpmFZ2fRfUXaLs/s1600/Gplus.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:250px; z-index:1000;}

.fixedmenufb1{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcb9dcLgvPRY0IU83dNMdwsh1hleJXtjxniwpgd3Ugb7tXHmDEJw0jo5nHt-6QnMtYwCnVRVU3EIz7g2qBYLA090HunSd01qPAZCqh8mZFHk2FFjQzujbdB6VB5eugnjj8mth2um8xgxY/s1600/Gplus_hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:250px; z-index:1100;}

.fixedmenufb_1{margin:0px 0 0 43px}

.fixedmenurss{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkWWVTSvMVgDuSnDMhhLgx7f0G2dyUhuPoraq2wWIfuxYzC36eWWehhcJfpvq5pBYuVwRDaX9kjzg3AcoI-fK3jR8HFE1ql2QuMBcvoYrtIssPD1oG85Lg2eZTbqgIDtmSwlqWZOUj2Qo/s1600/rss.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:295px; z-index:1000;}

.fixedmenurss1{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEis0CvfiohW0bYB9AyBzV32AdhwrbXMsYBkWuPT_7fEuFgrCAswQvnr1xVMfbJzGvVf6cLgX9snFG2ytOA4-Gy_6wBxu8z2bi1Y8QcZ7Uwbk0sUI1382PEYB-6vEwxmf87D7CRt_ZyehgM/s1600/RSS-hover.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:295px; z-index:1100;}

.fixedmenurss_1{margin:0px 0 0 43px}

</style>

<div class='fixedmenu' onmouseout='this.className='fixedmenu'' onmouseover='this.className='fixedmenu1''><div class='fixedmenu_1'>

<a href='https://www.facebook.com/USERNAME' target='_blank'><img alt='Like us on Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigJCrZAG9ij0lSpseMsK93EJH_Tdc90z38K16QIwLrZgVO5dgAx12xy_cPnVfdNeYC1WlP8j5pvMJSlq3zbSEBeZNekLTKTS66o2kdwQ0GUmwn4zieB1T4bXLCdjIJ2R8_5mnakmsMnJc/s1600/facebook-hover1.png' title='Like us on Facebook'/></a><br/>

</div></div><div class='fixedmenutw' onmouseout='this.className='fixedmenutw'' onmouseover='this.className='fixedmenutw1''><div class='fixedmenutw_1'>

<a href='https://twitter.com/GhiyatsBlogs' target='_blank'><img alt='Follow us on Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvHBphLqTRoS2ZrIiEmHhaSSNuwhVs94dKs3rP6DrbXbJJuKfJypzlwfXe2U04mmjSbOM03xf1wwYjerXiNbKpBqCGPdDO855TlM53vlnfsmTwvHN1O7eNB6RXlnPw4iNoyfbeAyvWagY/s1600/twitter_hover1.png' title='Follow us on Twitter'/></a><br/>

</div></div><div class='fixedmenufb' onmouseout='this.className='fixedmenufb'' onmouseover='this.className='fixedmenufb1''><div class='fixedmenufb_1'>

<a href='https://plus.google.com/ID Google+ anda' target='_blank'><img alt='Recommend us on Google Plus' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOwnbpAIG_F4F4BcU-ISm-XHY4TKboEI3YMyOw62W-BvewB8-OeZFUYmWYuZK0AfFa-apBVJfdz0p23HuqK0he0dWQAFJzrYmaC3hvZSB_bwVWXOn7KlBIBwo9wd7UvUTsPpWEhWaEsS0/s1600/Gplus_hover1.png' title='Recommend us on Google Plus'/></a><br/>

</div></div><div class='fixedmenurss' onmouseout='this.className='fixedmenurss'' onmouseover='this.className='fixedmenurss1''><div class='fixedmenurss_1'>

<a href='http://feeds.feedburner.com/GhiyatsBlogs' target='_blank'><img alt='Subscribe me on RSS' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSyR12jqvbPckg0b4FDCK31kpW8rCW29lMkfTmeuBPwjsKdu3b5AnP17SdfP35FvkXx4ymPi5ZC9hdRkqv9VWC7I-0oo2l8R99ZJUyX8aiFnjhZXa1Ar0j5uuIEclLr5KR-79uFzakKM4/s1600/RSS-hover1.png' title='Subscribe me'/></a><br/>

</div></div>

Ganti USERNAME Dengan Username facebook anda
Ganti GhiyatsBlogs Dengan Username Twitter anda
Ganti ID Google+ anda Dengan ID Profile Google+ anda
Ganti GhiyatsBlogs Dengan ID Feedburner anda
Setelah selesai diganti, sekarang Klik Simpan

Demikian artikel di semoga bermanfaat bagi sobat semua dan kalau sobat masih bingung dengan artikel ini, silakan berkomentar dan bertanya tentang artikel diatas, di kolom komentar dibawah ini

Via : Blogger Trix

7 komentar untuk "Membuat Widget Sosial Media Melayang Di Blog"

UnknownJuly 13, 2013 at 11:17 AM
wew super keren gan, tidak mengganggu pengunjung.. :)
AnonymousJuly 15, 2013 at 4:19 PM
kueren banget nih
AnonymousSeptember 8, 2014 at 8:39 PM
thanks boss (y) keren banget :D
UnknownDecember 13, 2015 at 8:46 PM
wih keren, makasih bang. Mampir mampir aja bang dimari http://everythinked.blogspot.co.id/

Silakan Tinggalkan Komentar Di Blog Ini
Kami sangat menghargai atas pertanyaan dan komentar sobat, Di harapkan Berkomentar dengan sopan dan tidak menyingung orang lain, Dan tidak mengunakan Link aktif karena akan Terhapus.
Terima Kasih