Membuat Navbar Dinamis menggunakan Array di dalam PHP

Assalamu alaikum Wr. Wb

Salam Pinter Bareng Komputer, ...zero bit...

Selamat siang semuanya !!! Semoga hari kalian menyenangkan ya. Tetap jaga diri dan selalu patuhi protokol kesehatan di manapun kalian berada.

Dalam artikel ini saya ingin membahas mengenai pembuatan menu pada halaman web memanfaatkan Navbar Bootstrap 4 atau Bootstrap 5 dan data bertipe array di dalam php.

Bootstrap 4 telah menyediakan komponen Navbar untuk membuat menu di dalam halaman web dengan cepat dan mudah. Berikut ini tampilan navbar Bootstrap 4 atau 5 :

Kita akan memanfaatkan php untuk membuat menu dan submenu dinamis di dalam navbar. Menu dan submenu ini akan disimpan di dalam variabel bertipe array kemudian dibaca di dalam navbar sebagai item - item menu dan submenu.

Dengan menyimpan menu serta submenu ke dalam variabel array maka jika terjadi perubahan menu maka cukup melakukan perubahan data di dalam array menu dan submenunya saja tanpa harus merubah script layout navbarnya.

Berikut langkah - langkah pembuatan menu dinamis menggunakan navbar dan array php :

1. Buat folder projek php (dengan nama bebas) kemudian simpan di dalam folder htdocs xampp kalian.
2. Buat file php baru dengan nama index.php.
3. Buat struktur halaman bootstrap 4 atau 5 dengan mengikuti petunjuk dari website resmi Bootstrap.
4. Tambahkan komponen navbar bootstrap 4 atau 5 dengan struktur menu seperti gambar di bawah ini :
   
5. Tampilan hasil menu nya seperti berikut ini :
   
6. Buat variabel array dengan nama dtmenu dan dtsubmenu untuk menyimpan data menu dan data submenu.
7. Untuk mendinamiskan menu di dalam navbar tambahkan script berikut ini :
   
   
   
8. Hasilnya menu dropdown akan muncul seperti berikut ini secara otomatis.
9. Kedepannya Array yang kita buat utk mendefinisikan menu akan bisa kita pindahkan ke dalam tabel (database mysql) sehingga dapa dimanajemen untuk mendinamiskan menu pada navbar.
10. Semoga artikel ini bermanfaat.

Kembali ke Menu PHP -