Menambahkan Slideshow Sederhana di Blog

Menambahkan Slideshow gambar Featured Posts Sederhana dengan Deskripsi untuk Blogger.

Featured Posts adalah unsur yang sangat penting dari sebuah situs maupun blog untuk memberikan ide atau saran kepada pengunjung tentang tulisan yang paling penting di dalam halaman. Pengguna dapat dengan mudah melacak posting yang paling penting di antara semua tulisan yang mereka inginkan. Ada banyak gadget di tujukan untuk menampilkan posting unggulan untuk menarik para pengunjung, slideshow dari Featured Posts adalah salah satunya.

Umumnya tampilan slide gambar kebanyakan dibuat dari javascript yang terlihat sederhana tapi sebenarnya malah mungkin javascript itu akan memperpanjang waktu loading halaman dan tentu akan membuat para pengunjung tidak betah berada lama di halaman. Jadi jika Sobat ingin menambahkan slide posting unggulan

Saya sarankan untuk menambahkan HTML slideshow Featured Posts sederhana, yang akan Saya bagikan kali ini.

• Adapun tampilan hasil akhirnya akan terlihat seperti berikut:

Samsung Galaxy S4 Zoom

Deskripsi posting di sini ...

Galaxy Ace 3

Deskripsi posting di sini ...

I9190 Galaxy S4 Mini

Deskripsi posting di sini ...

Galaxy Exhibit T599

Deskripsi posting di sini ...

Galaxy Core I8260

Deskripsi posting di sini ...

Sekarang akan Saya bagikan trik tentang bagaimana membuat slideshow gambar sederhana dari posting unggulan dengan deskripsinya.

• Berikut langkah-langkahnya:

1. Pergi ke Dashboard blogger.
2. Klik pada Tata Letak dan Klik 'Tambahkan Gadget'.
3. Pilih 'HTML / JavaScript' gadget.
4. Sekarang Copy kode di bawah ini.
5. dan Paste di Gadget yang baru dibuat tadi.

<div id='tc-slide'>
<marquee scrollamount="9" scrolldelay="75" width="200" height="200" bgcolor="#fff" direction="up" onmouseover="stop();" onmouseout="start();" >
<a href="LINK1" target="_blank"><img height="150" src="Link Gambar1" width="200" alt=""></a> <h4 align='center'><a href='Judul Link1' target='_blank'>Tulisan Judul 1</a></h4> <p align='center'>Deskripsi posting Anda di sini ...</p>
<a href="LINK2" target="_blank"><img height="150" src="Link Gambar2" width="200" alt=""></a>  <h4 align='center'><a href='Judul Link2' target='_blank'>Tulisan Judul 2</a></h4> <p align='center'>Deskripsi posting Anda di sini ...</p>
<a href="LINK3" target="_blank"><img height="150" src="Link Gambar3" width="200" alt=""></a>  <h4 align='center'><a href='Judul Link3' target='_blank'>Tulisan Judul 3</a></h4> <p align='center'>Deskripsi posting Anda di sini ...</p>
<a href="LINK4" target="_blank"><img height="150" src="Link Gambar4" width="200" alt=""></a>  <h4 align='center'><a href='Tujul Link4' target='_blank'>Tulisan Judul 4</a></h4> <p align='center'>Deskripsi posting Anda di sini ...</p>
<a href="LINK5" target="_blank"><img height="150" src="Link Gambar5" width="200" alt=""></a> <h4 align='center'><a href='Judul Link5' target='_blank'>Tulisan Judul 5</a></h4> <p align='center'>Deskripsi posting Anda di sini ...</p>
</marquee>
</div>

Catatan : Penggantian warna MERAH untuk Link yang mengarahkan dari GAMBAR, warna BIRU untuk link GAMBAR yang akan tampil, warna PINK untuk JUDUL Link dan warna HIJAU untuk JUDUL Tulisan.

6. Sekarang Simpan Gadget dan Lihat Hasilnya!.