Cara Memasang slide di blog

 Membuat  slide gambar di blog yang berganti2 adalah satu cara untuk membuat blog jadi interaktip dan lebih menarik agar di kunjungi blognya;
adapun cara salah satu cara yang di gunakan adalah dengan menggunakan fasilitas dari Program yang sudah ada untuk di dunia maya, baik itu Picasa, Photobhucket,Flicker dan yang lainnya. yang akan kita paparkan ini dengan sedikit belajar mengutak-atik HTML template. Disarankan kalu untuk di coba harus punya backup templat yang sebelum di edit / dirubah, jika ada masalah bisa kembali ke template asal.
 

1. Background slider, anda bisa ganti https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirSDbniBAq-2J-cTBgChBqXFcOAjHoS3srCgWPqFfdFtEUguWdH5Mp1yMt3b2ZyNklN_FeC5kr1nJFgK8sI7nbWln97_8Ieq-L_xSPJjw9Sf5UIwHjSJtay5QtySHvbJtj-z6EMGTEKlkJ/s0/header-background.png sesuai dengan background anda sendiri

#slidearea{

height:150px;

overflow:hidden;margin:-20px 0px 0 2px;

position:relative;

width:965px;

background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirSDbniBAq-2J-cTBgChBqXFcOAjHoS3srCgWPqFfdFtEUguWdH5Mp1yMt3b2ZyNklN_FeC5kr1nJFgK8sI7nbWln97_8Ieq-L_xSPJjw9Sf5UIwHjSJtay5QtySHvbJtj-z6EMGTEKlkJ/s0/header-background.png) repeat-x;

border:5px ridge #052844;

}

2. Pada contoh slider di atas, saya menyertakan link dan teks (tulisan warna merah) dari blog demo saya. Jadi, silahkan mengganti link, teks dan gambar (image) buatan sendiri, sesuaikan dengan kebutuhan. Bagian tersebut adalah seperti ini :
   

   <li>
   <div class='mytext'>
   <a href='SLIDE-1-LINK-HERE'> <img class='sidim' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisAqJDZs6KcK071NCFBXOx76dtLKLRA2fFC12UZjS3rT3TqPP5G4qicvmKUf-ZQhLtz_4pVu6S2zy8uu9xPz4sGwIHJxEyF5xoSG89uGtlFsvrlDnk221EZ4Q8Lhy_IRfX3zSLb0_UQRo/s1600/demomaskolis+come+away+with+me+1.jpeg'/> </a>
   <div class='clear'/>
   <p align='center'><a href='SLIDE-1-LINK-HERE'>Norah Jones Lyrics</a></p>
   </div>
   </li>

3. Jika ingin menambahkan deskripsi singkat di bawah judul gambar, temen-temen bisa rubah menjadi seperti ini
   

   <li>
   <div class='mytext'>
   <a href='SLIDE-1-LINK-HERE'>
   <img class='sidim' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisAqJDZs6KcK071NCFBXOx76dtLKLRA2fFC12UZjS3rT3TqPP5G4qicvmKUf-ZQhLtz_4pVu6S2zy8uu9xPz4sGwIHJxEyF5xoSG89uGtlFsvrlDnk221EZ4Q8Lhy_IRfX3zSLb0_UQRo/s1600/demomaskolis+come+away+with+me+1.jpeg'/> </a> <div class='clear'/>
   <h2><a href='SLIDE-1-LINK-HERE'>Norah Jones Lyrics</a></h2>  
   <p>Norah Jones adalah penyanyi jazz terkenal yang sudah banyak memperoleh penghargaan.....</p>
   </div>
   </li>

Untuk merubah lebar (width:965px), anda bisa sesuaikan dengan lebar di template yang anda pakai. Demikian juga tinggi slider, anda bisa atur sendiri, bisa kan? Saya yakin pasti bisa. 

Wah banyak juga kodenya ya? Temen-temen jangan bingung, saya yakin bagi anda yang senang mengutak-atik kode-kode HTML pasti bisa. Jika masih bingung juga, isi saja kotak komentar yang ada di bawah, siapa tahu saya bisa membantu.

selamat mencoba.