menu in Wordpress with 3 levels

Question

menu in Wordpress with 3 levels

Navigation

#1 by (1 votes)

1

I want to build a menu in Wordpress with 3 levels.

This example has 2 levels, the parent and the child.

I want the menu to have one more level, so I can create a 3-level menu with Wordpress.

Below, to the left, a code that refers to two menu levels.

Menu example in this Link

<?php
  $menu_name = 'main_nav';
  $locations = get_nav_menu_locations();
  $menu = wp_get_nav_menu_object( $locations[ $menu_name ] );
  $menuitems = wp_get_nav_menu_items( $menu->term_id, array( 'order' => 'DESC' ) );
?>

<nav>
<ul class="main-nav">
    <?php
    $count = 0;
    $submenu = false;
    foreach( $menuitems as $item ):
        $link = $item->url;
        $title = $item->title;
        // item does not have a parent so menu_item_parent equals 0 (false)
        if ( !$item->menu_item_parent ):
        // save this id for later comparison with sub-menu items
        $parent_id = $item->ID;
    ?>

    <li class="item">
        <a href="<?php echo $link; ?>" class="title">
            <?php echo $title; ?>
        </a>
    <?php endif; ?>

        <?php if ( $parent_id == $item->menu_item_parent ): ?>

            <?php if ( !$submenu ): $submenu = true; ?>
            <ul class="sub-menu">
            <?php endif; ?>

                <li class="item">
                    <a href="<?php echo $link; ?>" class="title"><?php echo $title; ?></a>
                </li>

            <?php if ( $menuitems[ $count + 1 ]->menu_item_parent != $parent_id && $submenu ): ?>
            </ul>
            <?php $submenu = false; endif; ?>

        <?php endif; ?>

    <?php if ( $menuitems[ $count + 1 ]->menu_item_parent != $parent_id ): ?>
    </li>                           
    <?php $submenu = false; endif; ?>

<?php $count++; endforeach; ?>

</ul>
</nav>

php html wordpress

asked by anonymous 19.04.2018 / 15:04

1 answer

How to put a warning message when closing the article listing window in SPRING Error url $ feed-id

score 1 · Accepted Answer

Wordpress does not have a simple function ready to create 3-level submenus. But with this class I created it allows you to easily create a 3 level menu.

The class file can be saved as menu.php or whatever name you wish.

This class will serve as a kind of Wordpress back end to create a 3-level menu.

<?php
// classe com as variáveis que você quer puxar do back end
class Menu
{
    public $titulo;
    public $id;
    public $url;
    public $submenu;
}

$menu_name = 'header-menu';
$locations = get_nav_menu_locations();
$menu = wp_get_nav_menu_object($locations[ $menu_name ]);
$menuitems = wp_get_nav_menu_items($menu->term_id, array('order' => 'DESC'));
$submenu = false;
$id_anterior = 0;
$set_menu = false;
foreach( $menuitems as $item ):

    //adiciona o menu
    if (!$item->menu_item_parent){
        // o menu precisa ser adicionado depois de setar seus filhos logo 
        //a variavel setmenu vai certificar que você consiga setar os 
        //filhos do menu corretamente
        if ($set_menu == true) { $menus[] = $myMenu;  $set_menu = false;}
        if ($set_menu == false) { $set_menu = true;}

        $myMenu = new Menu();
        $myMenu->titulo = $item->title;
        $myMenu->id = $item->ID;
        $myMenu->url = $item->url;
    } 
    else 
    { 
        //adiciona o submenu
        if ($id_anterior != $item->menu_item_parent) { 
            $mySubmenu = new Menu();
            $mySubmenu->titulo = $item->title;
            $mySubmenu->id = $item->ID;
            $mySubmenu->url = $item->url;
            $myMenu->submenu[] = $mySubmenu; 
        }
        //adiciona o submenu

        //adiciona o subsubmenu
        if ($id_anterior == $item->menu_item_parent) { 
            $mySubSubmenu = new Menu();
            $mySubSubmenu->titulo = $item->title;
            $mySubSubmenu->id = $item->ID;
            $mySubSubmenu->url =  $item->url;
            $mySubmenu->submenu[] = $mySubSubmenu; 
        }
        if ($id_anterior != $item->menu_item_parent){
            $id_anterior = $item->ID; 
        }
        //adiciona o subsubmenu
    }  
endforeach; 
//necessário para adicionar o último ítem do menu
$menus[] = $myMenu;
?>

How to use the code in the front end after you have made the class?

First you should give an include or require_once or some similar function of wordpress template creation to include the class, in the example I put the require_once ();

<?php require_once (TEMPLATEPATH . '/menu.php'); ?>

After the creation of the menu will be easy, you can make any kind of customized menu with 3 levels with this class, just apply the menu logic, in case I put a simple example using the tags "UL" "LI" and "A"

<ul>
<?php foreach ($menus as $menu) { ?>
    <li>
        <a href="<?= $menu->url; ?>">
            <?= $menu->titulo; ?> 
        </a>
    </li>

    <!-- se houver submenu -->
    <?php if ($menu->submenu){ ?>
    <ul>
        <?php foreach ($menu->submenu as $submenu) { ?>

            <li>
                <a href="<?= $submenu->url; ?>">
                    <?= $submenu->titulo; ?> 
                </a> 
            </li>

            <!-- se for menu de terceiro nível -->
            <?php if ($submenu->submenu){ ?>
                <ul>
                    <?php foreach ($submenu->submenu as $submenu) { ?>
                        <li>
                            <a href="<?= $submenu->url; ?>">
                                <?= $submenu->titulo; ?> 
                            </a> 
                        </li>  
                    <?php } ?>
                </ul>           
            <?php } ?>
            <!-- se for menu de terceiro nível -->  

        <?php } ?>
    </ul>          
    <?php } ?>
    <!-- se houver submenu -->

<?php } ?>

Result:

Sowhenyoucanworkwith3-levelmenuwiththeadminpanelofWordpressandapplytoyourcustomizedmenueasily,asshownintheexample.