CARA MEMBUAT SLIDE SHOW DIBLOG

CARA MEMBUAT SLIDE SHOW DIBLOG

Next

Next

Next

1. Log In ke www.blogger.com

2. Buat baru artikel atau edit artikel lama

3. Buka menu HTML buka Compose saat memasukkan kodenya

4. Copy dan Paste kode di bawah ini

  

 <style>

#Gambar1 {display:block; text-align:center}

#Gambar2, #Gambar3 {display:none; text-align:center}

#Klik1, #Klik2, #Klik3 {box-shadow: 0px 0px 10px 3px #181515; padding:2px; text-align:center; border:1px solid #D1FA02; background:#D1FA02; cursor:pointer; width:125px; height:30px}

</style>

<center>

<table border="0" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqogm1Mp88YTdKt4LjnkX_IyBqqYjR4fpQIVPysB0ZfC-yd3wkKdruJNvRxHKWefbk-0lymwwx78neuJCYYb4Eaatc15Zauvm1n6aDsyPqs_DQ2c8KcN-3o2jaYS3RSo8Ei5dOYIJnsTk/s1600/ledtv.jpg); height: 350px; padding: 0px 0px 40px 0px; width: 500px;">

<tr>

<td>

<div id="Gambar1"><a href="http://wandykambuno.blogspot.com/" target="_blank"><img alt="TERIMA KASIH TUHAN" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFEsFRKrJqDdsIxKAPca5R1yuojAADY069gzhwPemmydsxSD4PdZ_avz2TRavUi90x2pYr-cqxgnbV_QUZNYMd35bK_sVLPXAFN840BnEWcB03WLTgLByraUzTVNlWd-DXwiZ-WIdNmxI/s320/bidadari-surga.jpg" title=" TERIMA KASIH TUHAN " /></a></div>

<div id="Gambar2"><a href="http://wandykambuno4.blogspot.com/" target="_blank"><img alt="ATAS BERKAT YANG DIBERIKAN" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizHUCOzb_9D9mZMKpFXB4kJZLoqJNKs8hTOGZPTTmefSg0jrXImuo3HWZlH_e4b1eX-U4Q2GbD1aa9j-9zRhJx2aAn3L82VHQYR3OGPelv_XaywWiuSuS29PgIx2A8fimml3lI2A2HImM/s320/belajar-dari-merpati.jpg" title=" ATAS BERKAT YANG DIBERIKAN " /></a></div>

<div id="Gambar3"><a href="http://wandykambuno21.blogspot.com/" target="_blank"><img alt="AMIN" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQ2j55Z4kH0MXA0Bd7pQ6nqbAiXrU2KT3ladEGaE70U8SyVkYX1J_Uw4B2Bxs7DnYmlb5Omy544APLcw0Ny2_rqp6AWVo9672cnlwZSzsigDq8VRl6TQJwQ4HsBPFoF1wPFsHUSl6Hbvs/s320/12-12-17+Roh+Kudus+Burung+Merpati+02.jpg " title="AMIN" /></a></div>

</td></tr></table>

<table border="0"><tr>

<td><div id="Klik1" onclick="document.getElementById('Gambar1').style.display='block';Gambar2.style.display='none';Gambar3.style.display='none';">Next</div></td> 

<td><div id="Klik2" onclick="document.getElementById('Gambar1').style.display='none';Gambar2.style.display='block';Gambar3.style.display='none';">Next</div></td>

<td><div id="Klik3" onclick="document.getElementById('Gambar1').style.display='none';Gambar2.style.display='none';Gambar3.style.display='block';">Next</div></td>

</tr>

</table>

</center>

5. Publish artikel atau Perbaharui

6. Lihat hasilnya

Keterangan

• Gambar: Sesuaikan Gambar dengan tampilan backgroundnya
• Alamat dan Alt: Ganti dengan alamat blog anda serta alt-nya juga
• Warna BIRU: Atur padding pada gambar hingga sesuai dengan tampilan background
• Silahkan atur warna pada #D1FA02 sesuai yang anda inginkan
• Ganti Next menjadi angka atau huruf yang anda inginkan