Menunggu...

Membuat Floating Sosial Widget Keren

Sahabat blogger pasti sudah tahu dong apa itu floating sosial widget?
Ya, floating sosial widget adalah sebuah widget (bisa juga di sebut sebuah menu) sosial media yang letaknya melayang atau mengapung, sehingga posisinya akan selalu tetap meskipun halaman blog kita gulung atau kita gulir ke atas dan kebawah dengan mouse.

Manfaatnya adalah untuk selalu menampilkan sosial media yang kita miliki, berikut penampilanya :

http://adjieumbara.blogspot.com/2013/07/membuat-floating-sosial-widget-keren.html


Langkah-langkahnya sangat sederhana :

  1. Masuk ke akun blogger sobat
  2. Pergi ke pengaturan Tata Letak
  3. Klik Tambah Gadget lalu pilih HTML/JavaScript
  4. Masukkan kode di bawah ini ke dalam konten yang di buka tadi (perhatikan gambar di bawah)
http://adjieumbara.blogspot.com/2013/07/membuat-floating-sosial-widget-keren.html



     5.  Berikut kodenya :

<style> .btsnts-flt-wdt{ position:fixed; right:10px; top:30%; } .btsnts-flt-wdt img{ float:right; clear:right; margin:1px; -webkit-transition: all .0s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .btsnts-flt-wdt img:hover{ -moz-transform: scale(1.2) rotate(6deg); -webkit-transform: scale(1.2) rotate(6deg); -o-transform: scale(1.2) rotate(6deg); -ms-transform: scale(1.2) rotate(6deg); transform: scale(1.2) rotate(6deg); } </style> <!-- btsnts.blogspot.com --> <div class="btsnts-flt-wdt"> <!-- Facebook --> <a href="http://www.facebook.com/Akun FB Sobat" title="Join me on Facebook" target="_blank"><img alt="Join me on Facebook" src="http://3.bp.blogspot.com/-zl6GiZgl17w/TzNgd4y2VKI/AAAAAAAAAwQ/yl5f0NXI_Ng/s1600/facebook.png" /></a> <!-- Twitter --> <a href="http://twitter.com/Akun Twitter Sobat" title="" target="_blank"><img alt="Follow me on Twitter" src="http://1.bp.blogspot.com/-oZXlXaVZ0NQ/TzNgee09cVI/AAAAAAAAAwY/UVUjQ9LlLuk/s1600/twitter2.png" /></a> <!-- RSS --> <a href="http://feeds.feedburner.com/Nama Feed Sobat" title="Subscribe to RSS" target="_blank"><img alt="Subscribe to RSS" src="http://4.bp.blogspot.com/-v8adyG27cBs/TzNgdRZJzaI/AAAAAAAAAwM/k3HJWWhY0jY/s1600/Rss.png" /></a> <!-- Email --> <a href="URL Halaman Email Sobat " title="Email me" target="_blank"><img alt="Email me" src="http://3.bp.blogspot.com/-6ZNwVUqx9eo/TzNhk_KXPvI/AAAAAAAAAwk/uxsSpqb3sdI/s1600/Mail.png" /></a> </div> <!-- End -->

     6.  Yang terakhir silahkan sobat Simpan

Catatan :
Sebelum menyimpan kode pastikan sobat mengganti tulisan yang berwarna merah dengan akun sosial media yang sobat miliki.

Demikian sedikit penjelasan tentang membuat floating sosial widget keren yang bisa saya share, semoga bermanfaat...

Sumber kode : http://www.jeritanblog.com/2012/06/sosial-widget-terapung-dengan-effect.html
Advertise Here
By adjieumbara.blogspot.com
300x250

Klik disini untuk berkomentar 2 komentar:

avatar

Terima kasih.. infonya sangat membantu..

avatar

Sama-sama sahabat Daniel semoga bermanfaat, blognya keren sudah ramai.. (h)

Berkomentarlah dengan bijak karena setiap perkataan yang kita ucapkan merupakan cermin pribadi seperti apa diri kita..

Terima kasih atas komentar Anda