Sebuah halaman blog yang tidak ada sentuhan
foto atau gambar
akan terasa membosankan. Jika sudah bosan, maka pengunjung blog tidak
akan lama bertahan. Bukan hanya sebagai pernak-pernik, sebuah foto juga
bisa memberikan kesan tersendiri. Orang akan lebih hafal dengan gambar
daripada tulisan.
Sekarang, kita akan belajar untuk membuat
slide show,
yaitu foto-foto yang ditampilkan secara bergantian dengan otomatis.
Slide show bisa digunakan untuk menampilkan banyak foto tanpa menyita
banyak space. Karena foto akan diputar layaknya sebuah video, sehingga
lebih menarik dan hemat tempat.
Slide show bisa digunakan untuk menampilkan foto liburan yang banyak, atau memajang foto-foto produk untuk
toko online.
Cara untuk membuat slide show ini sangat mudah, tidak perlu pintar
photoshop atau flash. Kita tinggal menyiapkan foto yang sudah diupload
(dihosting). Kita bisa memanfaatkan post blogger, Picasa, Photobucket,
dan lain-lain.
Cara Mudah Membuat Slide Show Foto di Blog
1.
Login ke blogger
2. Pilih
Tata Letak kemudian
Tambah Gadget
3. Pilih
HTML/JavaScript
4. Masukan kode HTML berikut ini:
<script src='http://yourjavascript.com/53816065231/Database5.js' type='text/javascript'></script>
<script type="text/javascript" src="http://yourjavascript.com/65160840132/cycle.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#content-slider').cycle({
fx: 'fade'
});
});
</script>
<style type="text/css">
#content-slider {
position: relative;
width: 100%;
height:
250px;
overflow: hidden;
margin:0 auto;
}
#content-slider img {
display: block;
width: 100%;
height:
250px;
}
</style>
<div id="content-slider">
<img src="
URL Foto 1" />
<img src="
URL Foto 2" />
<img src="
URL Foto 3" />
<img src="
URL Foto 4" />
</div>
5. Ganti
URL Foto 1 dengan URL foto yang sudah dihost (upload)
6. Kita bisa juga menyesuaikan tinggi foto (height) dan lebarnya.
7. Kita bisa menambahkan atau menampilkan foto lebih banyak lagi dengan menambahkan kode sama seperti <img src="
URL Foto 4" /> dan seterusnya.
7.
Simpan jika sudah selesai.
Sumber : http://kurniasepta.blogspot.com/2013/03/cara-mudah-membuat-slide-show-foto-di.html
Artikel keren lainnya:
Belum ada tanggapan untuk "Cara Mudah Membuat Slide Show Foto di Blog "
Post a Comment