membuat slide

..heii, aku bukannya mo buat slide kayak gambar di atas luch! wehehehee..
sebenernya, udah agak malez mosting tentang tutor² kayak gini.
..tapi, kemarend ada yg minta cara buat slide nih. kalo gak salah namane rizal.
(hehe.. bener gak ya?) .. jadi ea udah dech. gak pa².

dahh.. langsung aja. (soalnya udah sore nihh.. takut gak nyampe')

1. masukin kode di bawah tepat di atas ]]></b:skin> :

/*Menu Slider*/
#slider {
background:transparent; height:150px; overflow:hidden; position:relative; margin-left:0px}

#mover {width:auto; position:absolute; overflow:hidden}

.slide {padding: 10px 0px; width:580px;float:left; position:relative; height:150px}

.slide h2 {font-family:verdana,georgia,helvetica,Sans-Serif; font-size:10pt;color: #ac0000; padding-left:10px; margin-left:10px; width:350px; overflow:hidden}

.slide h2 a:link, .slide h2 a:visited {color:#000; background-color:transparent}

.slide h2 a:hover {color:#0B0B61; background-color:transparent}

.slide p {color:#000; font-size:10px; font-family:verdana,georgia,helvetica,Sans-Serif; text-align:justify; line-height:15px; width:350px; padding-left:0px; margin:0px}

.slide img {margin-left:20px; position:absolute; top:50px; left:350px; background:#2E2E2E; padding:5px 5px}

#slider-stopper {position: absolute;font-family: verdana, georgia, helvetica, Sans-Serif;top:10px; right:10px; color:#B40404; padding:3px 8px; font-size:11px; font-style:bold; text-transform:uppercase; z-index:1000}

2. masukin kode di bawah sebelum </head>

<script src='http://bloggerstyles.com/data/templates/000/Zinmag-Primus/js/jquery-1.2.6.min.js' type='text/javascript'/>
<script src='http://bloggerstyles.com/data/templates/000/Zinmag-Primus/js/slider.js' type='text/javascript'/>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/><script type='text/javascript'>
$(document).ready(function(){
$(&quot;.trigger&quot;).click(function(){
$(&quot;.panel&quot;).toggle(&quot;fast&quot;);
$(this).toggleClass(&quot;active&quot;);
return false;
});
});
</script>

..yg ke-3, ..masuk ke Page Elements.
klik add a gadget, tyuz HTML / Javascript.
masukin kode ini:

<!-- Casing -->
<div id="casing">
<!-- Slider -->
<div id="slider">
<div id="mover">

<div class="slide">
<h2><a href="http://leciku.blogspot.com/2009/12/read-more-otomatis.html">Read More Otomatis</a></h2> <p>..udah lama nih aku gak mosting. hehehe...ehm. mungkin, nie bukan hal baru buad temen2. tapi ya.. sapa tau nie berguna buad yg lagi nyari. langsung ke TKP aja ya?1. masuk ke edit HTML (centang Expand Widget Templates)2. masukin kode di bawah sebelum &lt;/head&gt; :&lt;script type='text/javascript'&gt; var thumbnail_mode = &amp;quot;no-float&amp;quot;...</p> <img alt="" width="130px" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioSaeRDqymdISo3-eamEhvK5F8FngTcttfefzD7X1dkV9eQXkEnp3NMpCKF9X7C8Fbo9HZ3sZd5kTiII1x-pY_SPOMQ6gDA6E5M5AYhDxTwOX3kxLdW38d48RNFsVpVs1fylcZiw6-5wA/?imgmax=800" height="80px"/>
</div>

<div class="slide">
<h2><a href="http://leciku.blogspot.com/2009/11/memasang-emoticon-di-kolom-komentar.html">&nbsp;emoticon comment</a></h2> <p>...dah, gak usah basa-basi lagi. :P
langsung aja:...</p> <img alt="" width="130px" src="http://i306.photobucket.com/albums/nn252/cebong_ipit/templateanna/boy-emoticon-014.gif?imgmax=800" height="80px"/>
</div>

<div class="slide">
<h2><a href="http://leciku.blogspot.com/2009/11/memodifikasi-tags-cloud.html">&nbsp;modifikasi tags cloud</a></h2> <p>...mosting apa ya? jadi bingung aQ....kali ini, aku pengen mosting cara buat tags cloud biar terlihat warna-warni. (...kaya' pelangi. hehehe...)_pertama, masuk ke blogger, truz masuk ke edit HTML.jangan lupa tuk nyenntang "expand template widget"* kedua, cari kode: ketiga, masukkan kode di bawah tepat di atas kode tadi: .label-size-1...</p> <img alt="" width="130px" src="http://upload.wikimedia.org/wikipedia/en/thumb/a/a5/TagCloudCloud.png/800px-TagCloudCloud.png?imgmax=800" height="80px"/>
</div>

<div class="slide">
<h2><a href="http://leciku.blogspot.com/2009/10/cinlok-cinta-lokasi.html">&nbsp;Cinlok</a></h2> <p>deket sama seseorang memang menyenangkan. apalagi kalo lawan jenis. wUa! gUbRaK! ...itulah yang sekarang ini ku rasain. awal kenal "dia" siih... "ahh... biasa aja. gak ada yg spesial". tapi pas udah deket/ akrab, eh... ternyata nih anak asyik banget! sumpah! gak nyangka gue. apa lagi dia satu kelas sama aku.
hii...</p> <img alt="" width="130px" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhshlzXT_9MKDxcbJYVXSyWsnz86R8PBx2yoW0315WD2RG1HetyZTZv10A0SjktSEexYhA_y30jZHhvOf3nr-3FcxVfxggbGy1qVHrJfSemyKo3tgCcfNleZJATKmYrD1XGDJ0u2kqKErA/s320/images.jpeg?imgmax=800" height="80px"/>
</div>

</div>
<!-- /Mover -->
</div>
<!-- /Slider -->
</div>
<div class="clear"/></div>

keterangan:
yg merah buat url.
yg aqua buat judul.
yg kuning buat keterangan.
tyuz yg biru buat url gambar.

..dahh, jadi.