Cara Menampilkan Header Atau Memberi Slinder (Slideshow) Bootstrap.

Oleh peistar

Friday, 31 March 2017

Bagikan :

Tweet

Bootstrap merupakan framework yang disediakan secara geratis untuk mempermudah dalam perancangan aplikasi berbasih website Bootstrap terdiri dari HTML, CSS, dan JavaScript yang lansung bisa digunakan.

Untuk mempelajarinya kita dapat secara langsung menuju website resmi bootstrap di https://startbootstrap.com/ disini kita dapat mendownload template yang ingin kita gunakan.

Pada kesempatan kali ini saya akan memberikan tutorial mengenai cara mengganti header atau memberi slinder (slideshow)  pada website dengan menggunakan Bootstrap.

Baca Juga Link Berikut Untuk Menambah Ilmu :

1. Cara Mudah Membuat Menu Drop Down Web Menggunakan CSS
2. Cara Membuat Menu Bar Menggunakan Dreamweaver Cs5 Dengan Lebih Mudah
3. Tutorial Menampilkan Data Dari Database Menggunakan Dreamweaver Cs5
4. Tutorial Edit Menggunakan Dreamweaver Cs5 Dengan Lebih Mudah

Adapun langkah – langkah pengerjanya sebagai berikut :

- Langkah Pertama : Kita dapat mendownload secara langsung template bootstrap di https://startbootstrap.com/

- Langkah Kedua : Buatlah header atau gambar yang akan digunakan menggunakan photoshop seperti gambar dibawah ini. untuk ukuran sesuaikan dengan selera masing-masing. kalu contohnya kurang menarik ya gan...

- Langkah Ketiga : Pada area script slinder 1 (slideshow) saudara dapat memasukan script dibawah ini. Dengan cara klik kanan index.html yang ada pada folder dan arahkan pada aplikasi editor seperti Notepad ++ atau aplikasi editor lainya.

Script slideshow :

<img src="gambar/BS.jpg" alt="" />

Keterangan : gambar/BS.jpg artinya, gambar nama folder yang dituju, sedangkan BS.jpg nama gambar yang akan digunakan. pastikan folder gambar tersebut masuk kedalam folder website bootstrap kita, seperti gambar berikut :

- Langkah Keempat : Lakukan langkah ketiga  dan letakan pada slinder 2 dan 3 atau seterusnya.

Sangat mudah dan praktis bukan... pastikan saudara mengikuti langkah-langkah diatas dengan benar, semoga berhasil dan dapat membantu saudara dalam mempelajari Bootstrap terutama bagi kami yang menyampikan. 

Salam kompak selalu untuk kita semua mari selalu berbagi ilmu bersama kami disini di www.Peiindostar.com,  dan terimakasih banyak atas kunjungan saudara, mohon maaf atas segala kekurangan yang kami sampikan. Wasalam...

Tag : Bootstrap, PHP