cara membuat button navigasi berpijar

Setelah saya menemukan tutorial cara memasang button navigasi dari blog blogger yang sudah senior, ternyata Alhamdulillah saya berhasil, namun yang saya dapatkan hanya cara pemasangannya saja, nah disini saya sudah edit  sendiri button2 dengan software  ULEAD PHOTOIMPACT sehingga ada perbedaan yang lebih beragam salah satunya adalah button yang berpijar kayak lampu disco gitu deh.. nah buat sobat yang ahli otak atik photoimpact tentu nantinya akan bisa edit sendiri dengan selera masing2, dan buat sobat yang tidak mau ribet2 saya sudah siapkan beberapa button berpijar yang mungkin bisa buat bahan praktek di blog sobat, lihat contoh dibawah ini:

http://i821.photobucket.com/albums/zz135/vankim2/button%20vankim/button7.png

http://i821.photobucket.com/albums/zz135/vankim2/button%20vankim/button6.gif

http://i821.photobucket.com/albums/zz135/vankim2/button%20vankim/button2.png

http://i821.photobucket.com/albums/zz135/vankim2/button%20vankim/button1.gif

http://i821.photobucket.com/albums/zz135/vankim2/button%20vankim/button5.png

http://i821.photobucket.com/albums/zz135/vankim2/button%20vankim/button4.gif

saya yakin tidak setiap blogger tertarik dengan ini tapi khususnya buat pemula seperti saya yah paling tidak bisa untuk menambah pengetahuan tentang blog... iya gak..?? nah buat sobat yang mau praktek memasang untuk blog sendiri silahkan konsentrasikan pikiran untuk mengikuti langkah2 berikut ini:

1.silahkan sobat copy satu pasang kode  berwarna hijau muda yang terletak dibawah gambar2 diatas (catatan sobat cukup copy satu pasang saja url gambar yang kecil dan yang besar) lalu sobat simpan pada noteped atau dimana saja, hal ini untuk mempermudah pemasangannya nanti.
2. silahkan sobat login ke blog sobat sendiri
3. klick rancangan
4. klick edit HTML
5. centang Expand Template Widget
6. cari kode ini ]]></b:skin> pada kolom kode2 html sobat
7.setelah ketemu silahkan sobat copy kode dibawah ini dan letakkan tepet diatas kode ]]></b:skin> tadi.

/*
==================================================

Tutorial oleh vankim
URL :  http://gelorakim.blogspot.com
kunjungi blog saya untuk tutorial lainnya

==================================================
*/

#tabs6 {
float:left;width:100%;
background:transparent;
font-size:13px;
line-height:normal;
border-bottom:1px solid transparent;
}

#tabs6 ul {
margin:0;padding:10px 10px 0 5px;
list-style:none;
}

#tabs6 li {
display:inline;
margin:0;
padding:0;
}

#tabs6 a {
float:left;
background:url("http://i821.photobucket.com/albums/zz135/vankim2/button%20vankim/button2.png") no-repeat left top;
margin:0;padding:0 0 0 4px;text-decoration:none;
}

#tabs6 a span {
float:left;display:block;background:url("http://i821.photobucket.com/albums/zz135/vankim2/button%20vankim/button1.gif") no-repeat right top;
padding:5px 15px 4px 6px;
color:#ffff00;
font-weight:bold;
}

/* Commented backslah Hack hides rule from IE5-Mac */

#tabs6 a span {
float:none;
}
/* End IE5-Mac hack */

#tabs6 a:hover span {
color:#C2FB77;
}

#tabs6 a:hover {
background-position:0% -42px;
}

#tabs6 a:hover span {
background-position:100% -42px;
}

#tabs6 #current a {
background-position:0% -42px;
}

#tabs6 #current a span {
background-position:100% -42px;
}


7. perhatikan URL  berwarna hijau yang pertama, silahkan sobat ganti dengan URL button yang sobat copy tadi untuk ukuran button yang kecil,
8. perhatikan lagi URL berwrna hijau kedua silahkan sobat ganti dengan URL button yang sobat copy untuk button berukuran besar,
9.setelah sobat letakkan kode2 tadi sekarang waktunya sobat untuk mencari kode seperti dibawah ini:

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true'

perhatikan kode diatas yang saya kasih warna merah, silahkan sobat ganti kode kode tersebut menjadi (angka 1 ganti dengan angka 2)  ( no ganti yes )  (true ganti false)


sudah ketemu belum..?? sudah diganti belum..?? kalau sudah semuanya silahkan simpan template sobat...

setelah template sobat disimpan sekarang saatnya ganti acara... hehe maksudnya begini... sekarang sobat pindah klick rancangan, klick tambah gadget yang letaknya diatas atau dibawah header, pilih HTML/java script, lalu letakkan kode dibawah ini pada kolom gadget tersebut,

ini kodenya:

<div id='tabs6'>
       <ul>

<!-- Silahkan ganti URL dengan link milik anda -->

<li id='current'><a href='http://urlblogkanda.blogspot.com/' title='beranda'>
<span>beranda</span></a></li>

<li><a href='http://urlblogkanda.blogspot.com/' title='tukar link'>
<span>tukar link</span></a></li>

<li><a href='http://urlblogkanda.blogspot.com/' title='alamat'>
<span>alamat</span></a></li>

<li><a href='http://urlblogkanda.blogspot.com/' title='video'>
<span>video</span></a></li>

<li><a href='http://urlblogkanda.blogspot.com/' title='teman saya'>
<span>teman saya</span></a></li>


</ul>
      </div><!-- #tabs6 end -->

sebelum disimpan silahkan ganti dulu URLnya dengan URL milik sobat, dan ganti judul2nya sesuai keinginana sobat,

simpan dan lihat hasilnya, jika ada yang kurang mengerti silahkan bertanya Insya Allah saya jawab.
SELESAI... heeeem.... merokok dulu ah...