Bagaimana Cara Membuat Carousel Dengan Bootstrap
Assalamu'alaikum Wr.Wb
Salam Dan Bahagia
Pendahuluan
Pada kali ini saya akan membagikan sedikit tutorial yaitu bagaimana sih cara membuat carousel pada Bootstrap, nah langsung saja dibaca dan dipahami.
Latar Belakang
Minimnya teman-teman belum mengetahui bagaimana cara membuat Carousel, nah maka dari itu saya berinisiatif untuk membuat ini menggunakan framework Bootstrap.
Maksud Dan Tujuan
Agar Bisa memahami class-class pada bootstrap, terutama pada pembuatan Carousel.
Alat Dan Bahan
Laptop.
Browser.
Teks Editor.
Jangka Waktu yang dibutuhkan
40 Menit
Pembahasan atau langkah Kerja
Carousel merupakan proses penampilan gambar-gambar yang di beri efek slide. sangat banyak website atau situs yang menggunakan atau membuat slider carousel pada halaman website mereka untuk mempromosikan sebuah produk unggulan atau dengan tujuan lainnya. biasanya carousel di letakkan pada halaman depan sebuah website dengan slider yang berbagai macam dan tentunya menarik perhatian para pengunjung website.
Salam Dan Bahagia
Pendahuluan
Pada kali ini saya akan membagikan sedikit tutorial yaitu bagaimana sih cara membuat carousel pada Bootstrap, nah langsung saja dibaca dan dipahami.
Latar Belakang
Minimnya teman-teman belum mengetahui bagaimana cara membuat Carousel, nah maka dari itu saya berinisiatif untuk membuat ini menggunakan framework Bootstrap.
Maksud Dan Tujuan
Agar Bisa memahami class-class pada bootstrap, terutama pada pembuatan Carousel.
Alat Dan Bahan
Laptop.
Browser.
Teks Editor.
Jangka Waktu yang dibutuhkan
40 Menit
Pembahasan atau langkah Kerja
Carousel merupakan proses penampilan gambar-gambar yang di beri efek slide. sangat banyak website atau situs yang menggunakan atau membuat slider carousel pada halaman website mereka untuk mempromosikan sebuah produk unggulan atau dengan tujuan lainnya. biasanya carousel di letakkan pada halaman depan sebuah website dengan slider yang berbagai macam dan tentunya menarik perhatian para pengunjung website.
Sangat sulit untuk membuat slider atau carousel dengan cara manual. tetapi hanya dengan menggunakan framework bootstrap akan sangat mudah membuat carousel karena pada bootstrap sudah menyediakan class untuk membuat carousel ini.
Untuk membuat Corousel kita harus menyiapkan gambar terlebih dahulu,nah disini saya sudah menyiapkan beberapa gambar yang akan saya gunakan.
Dibootstrap sendiri banyak sekali macam-macam Corousel yang dapat dibuat contoh :
- Slides only
- With controls
- With indicators
- With captions
- Crossfade
Nah Itulah beberapa macam Corousel yang terdapat dibootstrap.
Berikut Merupakan Contoh Corousel yang saya buat menggunakan class "control"
Source code :
Nah Untuk membuat Corousel tipe lainnya kalian hanya merubah class css sesuai dengan tipe Corousel yang akan kalian buat
Nah gimana? mudah bukan.
Dengan adanya Corousel ini ketika kita ingin membuat image slider, tidak perlu lagi Membuat secara manual, dengan menggunakan bootstrap ini kita cukup memanggil class yang digunakan, maka secara otomatis akan dibuatkan.
Sekian yang dapat saya sampaikan, mohon maaf bila ada kesalahan dalam penulisan maupun tatabahasa, sekian dan terima kasih.
Wassalamu'alaikum Wr.Wb
