首页 > 解决方案 > 带有 $menu_tree 的下拉菜单

问题描述

我正在尝试使用 Bootstrap 5 渲染菜单,但我坚持让这项工作,我对 Drupal 非常菜鸟......

菜单上的简单链接效果很好,但下拉菜单是个问题。我试图制作一个更改渲染的功能,如果是下拉菜单但无法正常工作

这是我在 html 中的菜单代码:

<ul class="mb-2 mb-lg-0 me-lg-auto navbar-nav"> 
   <li class="nav-item"> 
       <a class="active nav-link px-lg-3 py-lg-4 text-light" aria-current="page" href="#">Home</a> 
   </li>                                 
   <li class="nav-item"> 
       <a class="nav-link px-lg-3 py-lg-4 text-light" href="#">One</a> 
    </li>                                 
   <li class="nav-item"> 
       <a class="nav-link px-lg-3 py-lg-4 text-light" href="#">Two</a> 
   </li>                                 
   <li class="nav-item dropdown"> 
       <a class="dropdown-toggle nav-link px-lg-3 py-lg-4 text-light" href="#" id="navbarDropdownMenuLink" role="button" data-bs-toggle="dropdown" aria-expanded="false">Three</a> 
          <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink"> 
               <a class="dropdown-item" href="#">Action</a> 
               <a class="dropdown-item" href="#">Another action</a> 
               <a class="dropdown-item" href="#">Something else here</a> 
           </div>                                     
    </li>                                 
    <li class="nav-item"> 
        <a class="nav-link px-lg-3 py-lg-4 text-light" href="#">Four</a> 
    </li>                                 
</ul>                             
<div class="ms-lg-3">
     <a class="btn btn-outline-primary pe-3 ps-3" href="#">Log in</a>
        <a class="btn btn-primary pe-3 ps-3" href="#" style="background-color: #ee545d;">Register</a>
</div> 

模板.php

function render_menu_tree($menu_tree) {
    print '<ul class="mb-2 mb-lg-0 me-lg-auto navbar-nav">';
    foreach ($menu_tree as $link) {
        
        print '<li class="nav-item">';
        $link_path = '#';
        $link_title = $link['link']['link_title'];
        $target = "";
        
        if($link['link']['link_path']) {
            $link_path = base_path() . drupal_get_path_alias($link['link']['link_path']);

            if($link['link']['link_path'] == '<front>'){
                $link_path = "#43";
            } 
        }

        // detectar link externo
        if( (strpos($link['link']['link_path'], "http://") !== false) ||
            (strpos($link['link']['link_path'], "https://") !== false) ) {
          $link_path = $link['link']['link_path'];
          $target = " target='_blank'";
        }

        print '<a class="nav-link px-lg-3 py-lg-4 text-light" href="' . $link_path . '"'.$target.'>' . mb_strtoupper($link_title) . '</a>';
        if(count($link['below']) > 0) {
            render_menu_tree_sub($link['below']);
        }

        print '</li>';
    }
    print '</ul>';
}

function render_menu_tree_sub($menu_tree) {
    print '<li class="nav-item dropdown">';
    foreach ($menu_tree as $link) {
        
        print '<a class="dropdown-item">';
        $link_path = '#';
        $link_title = $link['link']['link_title'];
        $target = "";
        
        if($link['link']['link_path']) {
            $link_path = base_path() . drupal_get_path_alias($link['link']['link_path']);

            if($link['link']['link_path'] == '<front>'){
                $link_path = "#";
            } 
        }

        // detectar link externo
        if( (strpos($link['link']['link_path'], "http://") !== false) ||
            (strpos($link['link']['link_path'], "https://") !== false) ) {
          $link_path = $link['link']['link_path'];
          $target = " target='_blank'";
        }

        print '<a class="nav-link px-lg-3 py-lg-4 text-light" href="' . $link_path . '"'.$target.'>' . mb_strtoupper($link_title) . '</a>';
        if(count($link['below']) > 0) {
            render_menu_tree($link['below']);
        }

        print '</a>';
    }
    print '</li>';
}

page.tpl.php

<div class="collapse navbar-collapse" id="navbarNavDropdown-4"> 
     <?php
           $main_menu_tree = menu_tree_all_data('main-menu', null, 3);
           render_menu_tree($main_menu_tree);
      ?>                            
</div>   

标签: drupal-7

解决方案


推荐阅读