Cara Memasang Widget Slide Show Photo Pada Sidebar Blog
Berikut tutorial cara memasang slide show photo blog
Memiliki blog yang keren sudah tentu menjadi impian semua blogger, akan tetapi terkadang kita bingung bagaimana caranya untuk memperindah tampilan blog kita.
Sebenarnya tampilan blog yang simple & dinamis yang lebih disukai oleh reader atau pembaca. Akan tetapi jauh lebih bagus bila kita mempunyai ciri khas pada blog kita, salah satunya bisa dengan cara memasang wigdet slide show photo yang berisi foto-foto kita pada sidebar blog.
Widget ini berisi foto-foto kita yang akan tampil secara bergantian secara otomatis. Memasang widget ini jauh lebih praktis & menghemat tempat daripada menyimpan foto di widget 'Gambar/Picture', karena semua foto-foto kita bisa tampil bergantian secara slide hingga tampak seperti menonton sebuah video & ini hanya butuh 1 space aza!
Kalo masih bingung tentang wigdet slide show photo ini bisa melihat ke HOME blog ini
*bener gak ? hehehe*
Coba dilihat ke sidebar widget berjudul "Milagros Indonesia Asia"
Gimanaaaa ??
widget slide show ini membuat tampilan blog jadi lebih bagus, keren & menarik tapi gak banyak makan tempat kan?
Mau pasang pasang widget slide show photo ini di blog anda?
Caranya mudah kok, disini saya akan jelaskan bagaimana caranya memasang widget slide show photo secara step-by-step....
Cara memasang slide show photo di sidebar Blog:
1. Login ke blogger seperti biasanya.
2. Masuk ke dashboard blog anda, lalu Pilih opsi 'Tata Letak'.
tutorial cara memasang slide show photo blog
3. Klik 'Tambahkan Gadget' lalu akan keluar pop-up, Pilih HTML/JavaScript.
tutorial cara memasang slide show photo blog
4. Beri judul di kolom judul, lalu masukan kode HTML ke dalam kotak konten seperti berikut ini:
tutorial cara memasang slide show photo blog
Anda tinggal copy-paste kode HTML (yang berwarna biru) dibawah 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: 250px;
height: 250px;
overflow: hidden;
margin:0 auto;
}
#content-slider img {
display: block;
width: 250px;
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 tulisan berwarna merah "URL FOTO 1/2/3/4" dengan url foto anda yang telah di host atau di upload ke website album foto online seperti photobucket / picasa / flickr, dll.
6. Anda bisa menambahkan sebanyak mungkin foto yang anda mau, tinggal menambahkan saja kode HTML URL FOTOnya.
7. Anda bisa mengedit tinggi & lebar dari foto tersebut. Kode HTML yang saya berikan cocok untuk sidebar blog berukuran 250 pixel atau lebih. Anda dengan mengganti kode HTML berwarna pink dengan ukuran yang anda mau sesuai dengan ukuran sidebar blog Anda.
*NOTES*
- Kalau slide photo tidak jalan, coba di cek kembali kode HTML nya, pastikan kode sudah benar sesuai dengan contoh di atas. Bila masih tidak jalan, cek juga jaringan internet anda, karena kalau sinyal internet kurang bagus slide photo sering ngambek gak mau jalan.
Masih gak jalan juga ?
mungkin belum dapet hidayah, hehehe.
- Anda saat ini bisa langsung memakai widget 'Tampilan Slide' yang bisa langsung terkoneksi dengan album foto online anda. Akan tetapi saya lebih nyaman menggunakan cara ini karena lebih mudah untuk di atur ukuran foto, posisi slidenya & bisa dari berbeda-beda album foto online.
Mau menggunakan cara yang mana, semua terserah anda ! hehehe
Mau pasang fb like box melayang layang di blog ? ---->>> klik disini.
Cara memasang widgetnya, ---->>> klik disini.
Berikut tutorial cara memasang slide show photo blog
Memiliki blog yang keren sudah tentu menjadi impian semua blogger, akan tetapi terkadang kita bingung bagaimana caranya untuk memperindah tampilan blog kita.
Sebenarnya tampilan blog yang simple & dinamis yang lebih disukai oleh reader atau pembaca. Akan tetapi jauh lebih bagus bila kita mempunyai ciri khas pada blog kita, salah satunya bisa dengan cara memasang wigdet slide show photo yang berisi foto-foto kita pada sidebar blog.
Widget ini berisi foto-foto kita yang akan tampil secara bergantian secara otomatis. Memasang widget ini jauh lebih praktis & menghemat tempat daripada menyimpan foto di widget 'Gambar/Picture', karena semua foto-foto kita bisa tampil bergantian secara slide hingga tampak seperti menonton sebuah video & ini hanya butuh 1 space aza!
Kalo masih bingung tentang wigdet slide show photo ini bisa melihat ke HOME blog ini
*bener gak ? hehehe*
Coba dilihat ke sidebar widget berjudul "Milagros Indonesia Asia"
Gimanaaaa ??
widget slide show ini membuat tampilan blog jadi lebih bagus, keren & menarik tapi gak banyak makan tempat kan?
Mau pasang pasang widget slide show photo ini di blog anda?
Caranya mudah kok, disini saya akan jelaskan bagaimana caranya memasang widget slide show photo secara step-by-step....
Cara memasang slide show photo di sidebar Blog:
1. Login ke blogger seperti biasanya.
2. Masuk ke dashboard blog anda, lalu Pilih opsi 'Tata Letak'.
tutorial cara memasang slide show photo blog
3. Klik 'Tambahkan Gadget' lalu akan keluar pop-up, Pilih HTML/JavaScript.
tutorial cara memasang slide show photo blog
4. Beri judul di kolom judul, lalu masukan kode HTML ke dalam kotak konten seperti berikut ini:
tutorial cara memasang slide show photo blog
Anda tinggal copy-paste kode HTML (yang berwarna biru) dibawah 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: 250px;
height: 250px;
overflow: hidden;
margin:0 auto;
}
#content-slider img {
display: block;
width: 250px;
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 tulisan berwarna merah "URL FOTO 1/2/3/4" dengan url foto anda yang telah di host atau di upload ke website album foto online seperti photobucket / picasa / flickr, dll.
6. Anda bisa menambahkan sebanyak mungkin foto yang anda mau, tinggal menambahkan saja kode HTML URL FOTOnya.
7. Anda bisa mengedit tinggi & lebar dari foto tersebut. Kode HTML yang saya berikan cocok untuk sidebar blog berukuran 250 pixel atau lebih. Anda dengan mengganti kode HTML berwarna pink dengan ukuran yang anda mau sesuai dengan ukuran sidebar blog Anda.
*NOTES*
- Kalau slide photo tidak jalan, coba di cek kembali kode HTML nya, pastikan kode sudah benar sesuai dengan contoh di atas. Bila masih tidak jalan, cek juga jaringan internet anda, karena kalau sinyal internet kurang bagus slide photo sering ngambek gak mau jalan.
Masih gak jalan juga ?
mungkin belum dapet hidayah, hehehe.
- Anda saat ini bisa langsung memakai widget 'Tampilan Slide' yang bisa langsung terkoneksi dengan album foto online anda. Akan tetapi saya lebih nyaman menggunakan cara ini karena lebih mudah untuk di atur ukuran foto, posisi slidenya & bisa dari berbeda-beda album foto online.
Mau menggunakan cara yang mana, semua terserah anda ! hehehe
Mau pasang fb like box melayang layang di blog ? ---->>> klik disini.
Cara memasang widgetnya, ---->>> klik disini.
