Hallo! Selamat Datang di Marketplace produk digital, Freelancer terbaik di indonesia (67478 Members, 783 Products, 5290 Topic, 12955 Comments)

Navbar menu di swarakalibata_2018 ke html navbar bootstrap 4

Dibuat
Login Terakhir 1 Bulan lalu,
Telah Dilihat 936 Kali
Adrie saputra Mengatakan : Sultan Account
  1. struktur html dibawah ini :
  2.  
  3. Assalamualaikum Warahmatullahi Wabarakatuh...<nav class="navbar navbar-expand-lg navbar-light bg-light">
  4. <a class="navbar-brand" href="#">Navbar</a>
  5. <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
  6. <span class="navbar-toggler-icon"></span>
  7. </button>
  8.  
  9. <div class="collapse navbar-collapse" id="navbarSupportedContent">
  10. <ul class="navbar-nav mr-auto">
  11. <li class="nav-item active">
  12. <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
  13. </li>
  14. <li class="nav-item">
  15. <a class="nav-link" href="#">Link</a>
  16. </li>
  17. <li class="nav-item dropdown">
  18. <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
  19. Dropdown
  20. </a>
  21. <div class="dropdown-menu" aria-labelledby="navbarDropdown">
  22. <a class="dropdown-item" href="#">Action</a>
  23. <a class="dropdown-item" href="#">Another action</a>
  24. <div class="dropdown-divider"></div>
  25. <a class="dropdown-item" href="#">Something else here</a>
  26. </div>
  27. </li>
  28. <li class="nav-item">
  29. <a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true">Disabled</a>
  30. </li>
  31. </ul>
  32. <form class="form-inline my-2 my-lg-0">
  33. <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
  34. <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
  35. </form>
  36. </div>
  37. </nav>

Ada 1 Jawaban

Bukhori Muslim
commented on 05 Nov 2019 09:31:37
Salah satu jawaban terbaik,..
  1. Assalamualaikum,.. biar lebih gampang coba modifikasi struktur yang saya buat dari Bootsrap 3 ini,
  2. tinggal ubah nama atributnya saja agar sesuai dengan bootsrap 4 :
  3. <div class="navbar-collapse collapse navbar-custom1" id="navbar-collapse">
  4. <?php
  5. function main_menu() {
  6. $ci = & get_instance();
  7. $query = $ci->db->query("SELECT id_menu, nama_menu, link, id_parent FROM menu where aktif='Ya' AND position='Bottom' order by urutan");
  8. $menu = array('items' => array(),'parents' => array());
  9. foreach ($query->result() as $menus) {
  10. $menu['items'][$menus->id_menu] = $menus;
  11. $menu['parents'][$menus->id_parent][] = $menus->id_menu;
  12. }
  13. if ($menu) {
  14. $result = build_main_menu(0, $menu);
  15. return $result;
  16. }else{
  17. return FALSE;
  18. }
  19. }
  20.  
  21. function build_main_menu($parent, $menu) {
  22. $html = "";
  23. if (isset($menu['parents'][$parent])) {
  24. if ($parent=='0'){
  25. $html .= "<ul class='nav navbar-nav navbar-right'>";
  26. }else{
  27. $html .= "<ul class='dropdown-menu'>";
  28. }
  29. foreach ($menu['parents'][$parent] as $itemId) {
  30. if (!isset($menu['parents'][$itemId])) {
  31. if(preg_match("/^http/", $menu['items'][$itemId]->link)) {
  32. $html .= "<li class='dropdown'><a target='_BLANK' href='".$menu['items'][$itemId]->link."'>".$menu['items'][$itemId]->nama_menu."</a></li>";
  33. }else{
  34. $html .= "<li class='dropdown'><a href='".base_url().''.$menu['items'][$itemId]->link."'>".$menu['items'][$itemId]->nama_menu."</a></li>";
  35. }
  36. }
  37. if (isset($menu['parents'][$itemId])) {
  38. if(preg_match("/^http/", $menu['items'][$itemId]->link)) {
  39. $html .= "<li class='dropdown-submenu'><a class='dropdown-toggle nav-item' data-toggle='dropdown' role='button' aria-haspopup='true' aria-expanded='false' target='_BLANK' href='".$menu['items'][$itemId]->link."'>".$menu['items'][$itemId]->nama_menu."</a>";
  40. }else{
  41. $html .= "<li class='dropdown-submenu'><a tabindex='-1' class='dropdown-toggle nav-item' data-toggle='dropdown' role='button' aria-haspopup='true' aria-expanded='false' href='".base_url().''.$menu['items'][$itemId]->link."'>".$menu['items'][$itemId]->nama_menu."</a>";
  42. }
  43. $html .= build_main_menu($itemId, $menu);
  44. $html .= "</li>";
  45. }
  46. }
  47. $html .= "</ul>";
  48. }
  49. return $html;
  50. }
  51. echo main_menu();
  52. ?>
  53. </div><!--//navabr-collapse-->
Maaf, Untuk Memberikan Komentar Anda Harus Login !!!