Blog Kokang

Cara Mudah Membuat Slideshow pada WEB PHP

01.05 Kokang 7

<div style="text-align: justify;">
<b><span class="first-character2">T</span>utorial Cara Mudah Membuat Slideshow pada Web PHP</b>, bagi Sobat blogger yang ingin memperindah tampilan sebuah websitenya mungkin kalian membutuhkan sebuah slider atau slideshow pada halaman homepage atau index kalian agar lebih terlihat dinamis. Apa lagi bagi kalian yang sedang dalam masa bimbingan tugas akhir atau skripsi dengan membuat program berbasis website, tentunya kalian menginginkan sebuah website yang baik mulai dari segi program sampai tampilan website tersebut sehingga dapat menghasilkan nilai yang bagus dan memuaskan.</div>
<div style="text-align: justify;">
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhf7c0sliDnZ5AaE8oyP4SZLindC1yMPD7gkNweKzqwd8-9Dq4jyXDYzJVC42uBLsQKsvNxu5kGtZLetgNybGclPwuXWXcfrqwBDGi3vlpgdpnFrztOLbWcwl2yvHo9dXYKek0oxev51_4/s1600/Cara-Mudah-Membuat-Slideshow-pada-WEB-PHP.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Cara Mudah Membuat SlideShow pada WEB PHP" border="0" height="232" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhf7c0sliDnZ5AaE8oyP4SZLindC1yMPD7gkNweKzqwd8-9Dq4jyXDYzJVC42uBLsQKsvNxu5kGtZLetgNybGclPwuXWXcfrqwBDGi3vlpgdpnFrztOLbWcwl2yvHo9dXYKek0oxev51_4/s400/Cara-Mudah-Membuat-Slideshow-pada-WEB-PHP.jpg" title="Cara Mudah Membuat SlideShow pada WEB PHP" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Cara Mudah Membuat SlideShow pada WEB PHP</td></tr>
</tbody></table>
<br />
<br /></div>
<div style="text-align: justify;">
Ikuti langkah-langkah tutorial cara membuat slideshow pada web PHP di bawah ini dengan baik dan benar.</div>
<div style="text-align: justify;">
</div>
<ul>
<li><u>Buatlah sebuah Folder</u> dengan nama <b>slide</b> pada file <i><b>C:/xampp/htdocs</b></i> kalian,</li>
<li>Buat sebuah <b>index php</b> di dalam folder slide yang telah kalian buat tadi dan <b>Copy script</b> di bawah ini.</li>
<blockquote class="code">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br />
<html xmlns="http://www.w3.org/1999/xhtml"><br />
<head><br />
<span class="Apple-tab-span" style="white-space: pre;"> </span><br />
<span class="Apple-tab-span" style="white-space: pre;"> </span><script type="text/javascript" src="js/slidergezz.1.3.8.js"></script><br />
<span class="Apple-tab-span" style="white-space: pre;"> </span><link rel="stylesheet" type="text/css" href="css/slidergezz.css" /><br />
<span class="Apple-tab-span" style="white-space: pre;"> </span><br />
</head><br />
<body><br />
<span class="Apple-tab-span" style="white-space: pre;"> </span><div id="slider_container_2"><br />
<span class="Apple-tab-span" style="white-space: pre;">   </span><div id="SliderName_2" class="SliderName_2"><br />
<span class="Apple-tab-span" style="white-space: pre;">    </span><img src="images/slide.png" width="1000px" height="236px" alt="Selamat Datang" title="Selamat Datang"/><br />
<span class="Apple-tab-span" style="white-space: pre;">     </span><div class="SliderName_2Description">Featured model: <strong>Charlize Theron</strong></div><br />
<span class="Apple-tab-span" style="white-space: pre;">    </span><img src="images/slide2.png" width="1000px" height="236px" alt="Gezz Fashion Style" title="Gezz Fashion Style" /><br />
<span class="Apple-tab-span" style="white-space: pre;">     </span><div class="SliderName_2Description">Featured model: <strong>Charlize Theron</strong></div><br />
<span class="Apple-tab-span" style="white-space: pre;">    </span><img src="images/slide3.png" width="700" height="450" alt="Selamat Berbelanja" title="Selamat Berbelanja" /><br />
<span class="Apple-tab-span" style="white-space: pre;">     </span><div class="SliderName_2Description">Featured model: <strong>Charlize Theron</strong></div><br />
<span class="Apple-tab-span" style="white-space: pre;">   </span></div><br />
              <br />
<span class="Apple-tab-span" style="white-space: pre;">   </span><script type="text/javascript"><br />
<span class="Apple-tab-span" style="white-space: pre;">    </span>effectsSlide = 'rain,stairs,fade,blinds';<br />
<span class="Apple-tab-span" style="white-space: pre;">    </span>var gezzSlider = Slidergezz.slider({container: 'SliderName_2', width: 1000, height: 236, effects: effectsSlide,<br />
<span class="Apple-tab-span" style="white-space: pre;">     </span>display: {<br />
<span class="Apple-tab-span" style="white-space: pre;">      </span>autoplay: 4000,<br />
<span class="Apple-tab-span" style="white-space: pre;">      </span>loading: {background: '#ffffff', opacity: 0.1, image: 'images/loading-slide.gif'},<br />
<span class="Apple-tab-span" style="white-space: pre;">      </span>buttons: {hide: true, opacity: 1, prev: {className: 'SliderNamePrev_2', label: ''}, next: {className: 'SliderNameNext_2', label: ''}}<br />
<span class="Apple-tab-span" style="white-space: pre;">      </span>}<br />
<span class="Apple-tab-span" style="white-space: pre;">    </span>});<br />
<span class="Apple-tab-span" style="white-space: pre;">    </span></script><br />
<span class="Apple-tab-span" style="white-space: pre;"> </span></div><br />
</body><br />
</html></blockquote>
<li><b>Download css dan javascript</b> beserta contoh gambar slidenya <a href="https://drive.google.com/file/d/0B-KT0hIatHRGUVhOV3NmYnRrRUE/view" rel="nofollow" target="_blank">di sini</a>,</li>
<li><b>Extract</b> hasil download tersebut,</li>
<li><b>Copy dan Paste folder css</b>, <b>images</b> dan <b>js</b> ke dalam file <i><b>C:/xampp/htdocs/slide</b></i>,</li>
<li>Buka <b>xampp control panel</b> lalu aktifkan <i>Apache</i> pada xampp kalian,</li>
<li>Buka browser lalu ketikan <b><i>localhost/slide/ </i></b>untuk melihat hasilnya.</li>
<li>Selesai.</li>
</ul>
<br />
<div>
<b>Baca juga: <a href="http://blogkokang.blogspot.com/2016/11/website-e-commerce-untuk-tugas-akhir.html" target="_blank">Website E-Commerce Untuk Tugas Akhir BSI Bagian 1</a></b></div>
<div>
<br /></div>

belajar php Cara Mudah Membuat Slideshow pada WEB PHP

T utorial Cara Mudah Membuat Slideshow pada Web PHP , bagi Sobat blogger yang ingin memperindah tampilan sebuah websitenya mungkin kalian m...