Membuat menu horizontal pada blogger menggunakan gadget ‘’java script’’

Caranya :
1.login ke blogger dengan account anda
2.pilih desain
3.Tata Letak
4.lalu tambah gadget
5.pilih gadget ‘’HTML/java script’’

Setelah itu copy lalu paste lah kode di bawah ini :


<style>
#subo a { float:left;margin:0; padding:0 0 0 0px; text-decoration:none; }

#subo a span { float:left; display:block; background:url(http://i1224.photobucket.com/albums/ee371/subobtp/biru.png)/*url warna latar */ no-repeat right top; padding:8px/*tinggi*/ 18px/*lebar*/ 4px/*tinggi bawah huruf*/ 6px/*lebar depan huruf*/; color:#FFF; } /* warna huruf Commented Backslash Hack hides rule from IE5-Mac */
#subo a span {float:none;} /* End IE5-Mac hack */
#subo a:hover span { color:#F6FA0E; } /*warna huruf bila pointer diatasnya*/

#subo a:hover { background-position:0% -42px;}/*efek warna*/
#subo a:hover span { background-position:100% -42px;}/*efek warna*/
</style>
<div id="subo">

<ul>
<li><a href="http://citracyntia.blogspot.com/"><span>HOME</span></a></li>

<li><a href="http://citracyntia.blogspot.com/search/label/tentang aku"><span>TENTANG AKU</span></a></li>

<li><a href="http://citracyntia.blogspot.com/search/label/artikel"><span>ARTTIKEL</span></a></li>

<li><a href="http://citracyntia.blogspot.com/search/label/puisi"><span>PUISI</span></a></li>

<li><a href="http://citracyntia.blogspot.com/search/label/tutorial"><span>TUTORIAL</span></a></li>

<li><a href="http://citracyntia.blogspot.com/search/label/lagu"><span>LAGU</span></a></li>

<li><a href="http://citracyntia.blogspot.com/search/label/tulisanku"><span>TULISANKU</span></a></li>


<li><a href="https://translate.google.com/"><span>KAMUS</span></a></li>



</ul></div>

Keterangan :
Tulisan yang berwarna merah ganti dengan url menu anda.
Yang berwarna biru gantilah dengan nama menu anda

Selesai lalu simpan.

Kemudian posisikan gadget ini di bawah tepat header blog anda dengan menyeret gadgetnya.
Klik simpan perubahan.

Ok sekarang lihatlah blog anda..
Gimana?....
Apakah berhasil?....
Kalau belum berhasil anda bisa Tanya pada saya melalui kotak komentar dibawah ini atau melalui shoutmix di pojok kanan.

sekian postingan saya…
salam sejahtera untuk semua blogger…..

Kumpulan Beberapa Animasi Untuk Mempercantik Blog

Kumpulan Beberapa Animasi Untuk Mempercantik Blog

  Animasi yang dimaksud disini adalah untuk mempercantik tampilan blog kita. 

Jika anda berminat, cara pemasangannya sebagai berikut ini :

1. Login ke Akun Blogger Anda
2. Buka Tata Letak
3. Klik "Tambah Gadge=> HTML/Javascript"
4. Copy dan Pastekan kode masing-masing animasi yang Anda senangi.
5. Lalu Klik Simpan atau Save

Kembang Api

 
<img src="http://i1242.photobucket.com/albums/gg532/faizkr8/Fire.gif" />  

1. Pelaut
    
   <img src="http://i1242.photobucket.com/albums/gg532/faizkr8/tutuktutuk.gif" />
   
2. SpongeBob Ngantuk
     <img src="http://i1242.photobucket.com/albums/gg532/faizkr8/bob.gif" />
   
3. SpongeBob Lari
     <img src="http://i1242.photobucket.com/albums/gg532/faizkr8/boblari.gif" />
   
4. Ubur - Ubur
     <img src="http://i1242.photobucket.com/albums/gg532/faizkr8/ubur2.gif" />
   
5. Seluncur
    
   <img src="http://i1242.photobucket.com/albums/gg532/faizkr8/Skate.gif" />
   
6. Bajak Laut
     <img src="http://i1242.photobucket.com/albums/gg532/faizkr8/Fire-1.gif" />
   
7. Dancer
    
   <img src="http://i1242.photobucket.com/albums/gg532/faizkr8/Dance.gif" />
   
8. Petir
     <img src="http://i1242.photobucket.com/albums/gg532/faizkr8/Cloudelec.gif" />
   
9. Murid
     <img src="http://i1242.photobucket.com/albums/gg532/faizkr8/jln.gif" />
   11. SpongeBob Gembira
   
   
   
   <img src="http://s.myniceprofile.com/myspacepic/1028/th/102882.gif" />
   
   

   
   
   
   
   12. Naruto
   
   
   

   
   <img src="http://s.myniceprofile.com/myspacepic/692/th/69207.gif" title="My widget" alt="animasi bergerak gif" />
   
   
   13. Gaara
   

   
   

   
   
   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/539/th/53973.gif" title="My widget" alt="animasi bergerak gif" /></a></div>
   
   
   14. Labu
   

   
   

   
   
   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://sig.graphicsfactory.com/Halloween/a.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://gedesitdownblog.blogspot.com/2013/05/kumpulan-beberapa-animasi-untuk.html" target="_blank">My Widget</a></div>
   
   
   15. Tengkorak
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/1/th/152.gif" title="My widget" alt="animasi bergerak gif" /></a></div>
   
   
   16. Ekspresi Wajah
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/742/th/74214.gif" title="My widget" alt="animasi bergerak gif" /></a></div>
   
   
   
   
   17. Animasi
   
   
   

   
   

   
   
   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://i.mnpls.com/715/71510.gif" title="My widget" alt="animasi bergerak gif" /></a></div>
   
   
   18. Main Taplak
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/0/th/72.gif" title="My widget" alt="animasi bergerak gif" /></a></div>
   
   
   19. Pasangan
   
   
   

   
   

   
   
   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/229/th/22949.gif" title="My widget" alt="animasi bergerak gif" /></a></div>
   
   
   20. Zoombie
   
   
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/466/th/46602.gif" title="My widget" alt="animasi bergerak gif" /></a></div>
   
   
   21. Pigglet
   
   
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/438/th/43833.gif" title="My widget" alt="animasi bergerak gif" /></a></div>
   
   
   22. Mini Mouse
   
   
   

   
   

   
   
   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/485/th/48554.gif" title="My widget" alt="animasi bergerak gif" /></a></div>
   
   
   
   
   23. Hello
   
   
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/212/th/21215.gif" title="My widget" alt="animasi bergerak gif" /></a></div>
   
   
   24. Hi Friend!
   
   
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/243/th/24365.gif" title="My widget" alt="animasi bergerak gif" /></a></div>
   
   
   25. Star
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/102/th/10221.gif" title="My widget" alt="animasi bergerak gif" /></a></div>
   
   
   
   
   
   
   26. Gajah Loncat
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 20px;width:120px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203BC.gif" title="Click to get more." /></a></div>
   
   
   27. Boring...
   
   
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 20px;width:80px;height:120px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img src="http://content.sweetim.com/sim/cpie/emoticons/0002016B.gif" border="0" /></a></div>
   
   
   28. Bayi Tertawa-1
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; right: 20px;width:82px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img src="http://content.sweetim.com/sim/cpie/emoticons/0002031F.gif" border="0" /></a></div>
   
   
   29. Dance
   
   
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 20px;width:82px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img src="http://content.sweetim.com/sim/cpie/emoticons/0002013F.gif" border="0" /></a></div>
   
   
   30. Main Bola
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; right: 30px;width:160px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img src="http://content.sweetim.com/sim/cpie/emoticons/0002032D.gif" border="0" /></a></div>
   31. Bayi Tertawa-2
   
   
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 20px;width:120px;height:100px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/0002031E.gif" title="Click to get more." /></a></div>
   
   
   32. Panda Biru
   
   
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 20px;width:100px;height:100px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/0002033D.gif" title="Click to get more." /></a><div>
   
   
   33. Panah
   
   
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:210px;height:120px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020236.gif" title="Click to get more." /></a></div>
   
   
   34. Bunga
   
   
   

   
   

   
   
   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:100px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020322.gif" title="Click to get more." /></a></div>
   
   
   35. Anjing Laut
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203B5.gif" title="Click to get more." /></a></div>
   
   
   36. Lumba - Lumba
   
   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203BA.gif" title="Click to get more." /></a></div>
   
   
   
   
   
   
   
   
   
   
   37. Kucing Tidur
   
   
   

   
   

   
   
   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:140px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203C0.gif" title="Click to get more." /></a></div>
   
   
   38. Kelinci
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:125px;height:160px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203A0.gif" title="Click to get more." /></a></div>
   
   
   39. Dragon
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:150px;height:130px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020478.gif" title="Click to get more." /></a></div>
   
   
   
   40. Ikan
   

   
   

   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:100px;height:130px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020479.gif" title="Click to get more." /></a></div>
   
   
   41. Pinguin
   
   
   

   
   

   
   
   
   
   <div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:130px;"><a href="http://gedesitdownblog.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020484.gif" title="Click to get more." /></a><small><center></center></div> 
        
   Catatan !! Anda bisa mengatur dimana ingin meletakkan animasi tersebut sesuai keinginan. Caranya dengan mengedit tulisan bottom (bawah), top (atas), left ( kiri), right (kanan). Contoh : jika anda ingin memasang di pojok kanan atas, berarti anda harus mengubahnya menjadi top dan right.