Kategori Random

Membuat Template Bootstrap dengan Cepat dan Gampang

Posted : 12 Februari 2016 | 09:00:29 , Dibaca 4003 kali

Hay agan-agan, jumpa lagi bersama saya. Setelah lama saya tidak posting artikel akibat dari kesibukan yang tidak terelakkan , kali saya akan memposting tentang bootstrap, yaitu membuat template bootstrap yang resposive dengan cepat, bisa kita bilang seperti mie instan deh sakking cepatnya.

 

Baik untuk langkah awal kita harus menyediakan toolsnya. Toolsnya adalah pingendo, apa itu pingendo? pingendo adalah salah satu dari sekian tools aplikasi pembuat template bootstrap. Salah satu faktor kenapa saya pilih pingendo adalah karena pingendo gratis...tiss... dan tidak meminta bayaran lisensi apapun. Mari langsung menuju laman pingendo buka di browser agan www.pingendo.com. Setelah terbuka bisa langsung didownload sesuaikan pilihan sistem operasi agan.

 

Jika download telah selesai silakan langsung di instal, tinggal di next next kan aja, dan ketika kita jalankan tampilan awal akan muncul seperti pada gambar dibawah ini.

 
Gambar Tampilan awal ketika pingendo dijalankan.

Nah untuk memulai dalam pembuatan template bootstrapnya silakan diikuti langkah-langkah dibawah ini.

  1. Klik file -> new atau Tekan langsung Ctrl+N pada keyboard
  2. Kemudian akan muncul 2 pilihan template yang akan kita kerjakan. Silahkan dipilih salah satu
  3. Setelah dipilih template akan muncul (pada kasus saya pilih default empty page)
  4. Pada menu kiri ada tab Section dan tab component dan disebelah kanan ada tab page dan tab selection, kita tinggal tarik apa yang kita inginkan untuk ditampilkan pada template.

Untuk lebih jelas cara penggunaannya bisa melihat video tutorial berikut ini :

Bagaimana cepat dan gampang bukan.
Demikian tutorial kali semoga bermanfaat.

Postingan Terkait
» Trik Zoom Image View pada postingan dengan CSS ( 23 Sep 2015 | 07:05:18 , 1817 hits )
» Membuat Modal Bootstrap PHP ( 19 Mar 2015 | 03:00:11 , 12258 hits )
» Bootstrap : Membuat Tab Horizontal ( 20 Feb 2015 | 04:58:20 , 4755 hits )
» Mengenal lebih jauh twitter bootstrap ( 29 Jan 2015 | 12:15:19 , 4229 hits )
» Percantik Tombol dengan CSS3 Borders ( 28 Jan 2014 | 17:51:51 , 1206 hits )