Tentunya Anda pernah mengunjungi sebuah blog yang ada tampilan slide show foto padanya. Terlihat cantik bukan?
Nah, Anda mungkin juga punya keinginan memasang widget semacam itu di blog Anda tapi bingung bagaimana caranya.
Sekarang Anda tak perlu bingung lagi. Kami akan jelaskan cara memasangnya tanpa berbelit-belit. Anda tak perlu menjadi seorang ahli IT jika hanya untuk memasang widget tersebut. Di sini akan Anda temukan cara yang sangat sederhana dan paling mudah.
Silakan simak langkah-langkah berikut:
1. Buka blog Anda.
2. Pilih Tata Letak.
3. Klik tambah gadget.
4. Pilih HTML/Java Sripct
5. Jika kolom HTML/Java Script sudah terbuka, copy kode HTML berikut dan pastekan padanya:
<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>
<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>
6. Ganti tulisan URL FOTO 1, URL FOTO 2, URL FOTO 3, URL FOTO 4, dengan url foto yang sudah Anda upload di website album foto online. Jika Anda belum memilikinya silakan klik di sini atau di sini
7. Anda bisa menambahkan foto sebanyak yang Anda mau. Yang Anda harus lakukan hanya menambahkan kode
<img src=" URL FOTO 4 " /> , sejumlah yang Anda inginkan.
<img src=" URL FOTO 4 " /> , sejumlah yang Anda inginkan.
8. Jika semuanya sudah Anda lakukan dan dirasa cukup, sekarang klik simpan, dan lihat hasilnya.
Demikian. Semoga bermanfaat dan membuat blog Anda semakin cantik.
0 komentar :
Posting Komentar