Cara membuat gambar slide dengan setting html ini mirip dengan gambar Flash yang dibuat dengan software flash...namun disini tak perlu menggunakan software tersebut...hanya sedikit utak-atik html saja sih...
untuk pemasangan nya adalah sebagai berikut:
- Login ke blogger.com
- Pilih template
- Kemudian pilih Edit html
- Jangan Lupa centang expand widget untuk tampilan html penuh..
- Selanjutnya cari kode </head> ,(gunakan F3 atau dengan Ctrl + F untuk memudahkan pencarian)
- Kemudian masukan code script yang ada dibawah dengan cara copy/paste diatas kode </head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/> <script src='http://mrmung.googlecode.com/files/coin-slider.min.js' type='text/javascript'/> <script type='text/javascript'> $(document).ready(function() { $('#coin-slider').coinslider({ width: 950,height:144, navigation: false, delay: 5000 }); }); </script>
**> Keterangan : width:950,height:144 adalah ukuran lebar dan tinggi slideshow yang nantinya akan ditampilkan di blog. Tapi Untuk Ukuran ini Terserah masing-masing orang mau seberapa lebar header blog yang dimiliki.. ukuran kecilpun bisa misalkan kita mau memasangnya di sidebar....
Copy/paste script dibawah ini di area HTML/javascript
<div id='coin-slider'>
<center>
<a href="URL LINK" target="_blank">
<img src="LINK URL GAMBAR DISINI" />
<span>
</a>
<a href="URL LINK" target="_blank">
<img src="LINK URL GAMBAR DISINI" />
<span>
</a>
<a href="URL LINK" target="_blank">
<img src="LINK URL GAMBAR DISINI" />
<span>
</a>
</center>
</div>
<div id='coin-slider'>
<center>
<a href="http://www.cobadibaca.com" target="_blank">
<img src="LINK URL GAMBAR DISINI" />
<span>
Hanya Mencoba untuk Coba Dibaca....
</span>
</a>
<a href="URL LINK" target="_blank">
<img src="LINK URL GAMBAR ANDA" />
<span>
</a>
<a href="URL LINK" target="_blank">
<img src="LINK URL GAMBAR ANDA" />
<span>
</a>
</center>
</div>
Semoga bermanfaat... dan coba dibaca dulu dari awal..
untuk pemasangan nya adalah sebagai berikut:
- Login ke blogger.com
- Pilih template
- Kemudian pilih Edit html
- Jangan Lupa centang expand widget untuk tampilan html penuh..
- Selanjutnya cari kode </head> ,(gunakan F3 atau dengan Ctrl + F untuk memudahkan pencarian)
- Kemudian masukan code script yang ada dibawah dengan cara copy/paste diatas kode </head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/> <script src='http://mrmung.googlecode.com/files/coin-slider.min.js' type='text/javascript'/> <script type='text/javascript'> $(document).ready(function() { $('#coin-slider').coinslider({ width: 950,height:144, navigation: false, delay: 5000 }); }); </script>
**> Keterangan : width:950,height:144 adalah ukuran lebar dan tinggi slideshow yang nantinya akan ditampilkan di blog. Tapi Untuk Ukuran ini Terserah masing-masing orang mau seberapa lebar header blog yang dimiliki.. ukuran kecilpun bisa misalkan kita mau memasangnya di sidebar....
- Preview dulu agar yakin penempatannya sudah benar, kalau ada kesalahan penempatan scrip biasanya ada peringatan tertulis.. sobat tinggal klik clear edit aja supaya gak bingung menghapusnya.
- Kalau Semua script sudah benar.. klik simpan template (save template)
- Langkah selanjutnya adalah Sruput kopi dulu biar gak ngantuk...(gak penting sih)
- Setelah tersimpan.. kita masuk ke area Layout (tampilan)
- Lalu Pilih Add a Gadget(tambahkan Gadget), kalau mau menempatkan di area header pilihlah add gadget di bawah header.
- Selanjutnya Pilih HTML/Javascript
<div id='coin-slider'>
<center>
<a href="URL LINK" target="_blank">
<img src="LINK URL GAMBAR DISINI" />
<span>
ISIKAN KETERANGAN GAMBAR DI SINI BROW
</span></a>
<a href="URL LINK" target="_blank">
<img src="LINK URL GAMBAR DISINI" />
<span>
ISI KETERANGAN gambar DI SINI
</span></a>
<a href="URL LINK" target="_blank">
<img src="LINK URL GAMBAR DISINI" />
<span>
ISI KETERANGAN gambar DI SINI
</span></a>
</center>
</div>
<div id='coin-slider'>
<center>
<a href="http://www.cobadibaca.com" target="_blank">
<img src="LINK URL GAMBAR DISINI" />
<span>
Hanya Mencoba untuk Coba Dibaca....
</span>
</a>
<a href="URL LINK" target="_blank">
<img src="LINK URL GAMBAR ANDA" />
<span>
ISI KETERANGAN GAMBAR DI SINI
</span></a>
<a href="URL LINK" target="_blank">
<img src="LINK URL GAMBAR ANDA" />
<span>
ISI KETERANGAN GAMBAR DI SINI
</span></a>
</center>
</div>
Semoga bermanfaat... dan coba dibaca dulu dari awal..