Cara Membuat Smart Jquery Feature Slider

Widget ini sama dengan feature content lainnya, namun hanya bnetuk dan gaya tampilannya saja yang berbeda. Ok langsung saja kita bahas cara membuat smart jquery feature slider. Ikuti langkah berikut.

Log in ke blog anda
Klik Rancangan
Klik Edit HTML
Masukkan kode berikut di atas kode </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'></script>
<script src='http://bloekoetoek-blogonol.googlecode.com/files/blogonol-smartfeaturecontent.js' type='text/javascript'></script>
<style type="text/css">
ul.slideshow{list-style:none; width:600px; height:240px; overflow:hidden; position:relative; margin:0; padding:0; font-family:Arial,Helvetica,Trebuchet MS,Verdana; }
ul.slideshow li{position:absolute; left:0; right:0}
ul.slideshow li.show{z-index:500}
ul img{width:600px; height:240px; border:none}
#slideshow-caption{width:600px; height:70px; position:absolute; bottom:0; left:0; color:#fff; background:#000; z-index:500}
#slideshow-caption .slideshow-caption-container{padding:5px 10px; z-index:1000}
#slideshow-caption h3{margin:0; padding:0; font-size:16px}
#slideshow-caption p{margin:5px 0 0 0; padding:0}</style>

Selanjutnya klik Simpan Template
Klik lagi Rancangan
Klik Tambah Gadget
Pilih HTML/JavaScript
Masukkan kode berikut ke dalamnya dan ikuti petunjuknya

<ul class="slideshow">
<li><a href="MASUKKAN LINK ANDA"><img src="MASUKKAN ALAMAT GAMBAR ANDA" title="JUDUL GAMBAR" alt="DESKRIPSI GAMBAR ANDA" /></a></li>

<li><a href="MASUKKAN LINK ANDA"><img src="MASUKKAN ALAMAT GAMBAR ANDA" title="JUDUL GAMBAR" alt="DESKRIPSI GAMBAR ANDA" /></a></li>

<li><a href="MASUKKAN LINK ANDA"><img src="MASUKKAN ALAMAT GAMBAR ANDA" title="JUDUL GAMBAR" alt="DESKRIPSI GAMBAR ANDA" /></a></li>

<li><a href="MASUKKAN LINK ANDA"><img src="MASUKKAN ALAMAT GAMBAR ANDA" title="JUDUL GAMBAR" alt="DESKRIPSI GAMBAR ANDA" /></a></li>
</ul>

Klik Simpan dan lihat hasilnya
Selamat mencoba dan sukses selalu

"keep spirits and do the best"