0

I created a mega menu on my site using wordpress native wp_menu. I wanted to display 4 columns in each mega menu. each column contains 5 links you can see it live here (it's in hebrew but check the top menu from right to left) click here

Up until this point everything works lovely.

what I want to do now is displaying more than 5 links in each column (say 10 for example) but only in the first drop down menu (from the right)

here is the original code:

<?php $menu_name = 'top_menu';
$menu = wp_get_nav_menu_object($menu_name);
$menuitems = wp_get_nav_menu_items( $menu->term_id, array( 'order' => 'DESC' ) );
?>
<ul class="nav top-nav">
<?php
$count = 0;
$submenu = false;
$i=0;
$output = '';
foreach( $menuitems as $item ){
    $link = $item->url;
    $title = $item->title;

    //if no parent
    if ( !$item->menu_item_parent ) {
    $parent_id = $item->ID;
    $output .= '<li>
        <a href="'.$link.'">'.$title.'</a>';
    }

    if ( $parent_id == $item->menu_item_parent ) {

        if ( !$submenu ) {
        $submenu = true;
        $output .= '<div class="mega-menu-section">
            <div class="wrapper">
                <ul class="drop-dow">';
        }

            $i++;
                    $output .= '<li>
                        <a href="'.$link.'">'.$title.'</a>
                     </li>';

        if ( $menuitems[ $count + 1 ]->menu_item_parent != $parent_id && $submenu ) {
                $output .= '</ul>  
            </div>
        </div>';
        $submenu = false;
$i=0;
        } else if($i==5) {
                $output .= '</ul>
                <ul class="drop-dow">';
                $i=0;
        }
    }

    if ( $menuitems[ $count + 1 ]->menu_item_parent != $parent_id ) {
    $output .= '</li>';
    $submenu = false;
    }
    $count++;
}
echo $output; ?>

</ul>

Note this part in the code:

else if($i==5)

this determines how many links I want to display in each column. if I change this to 10 it will work but it will work across all the drop down menus and I want it to work only for the first link on the right and all the others shoould remain 5. so I figured I will create a Boolean variable which will display different number in the first row if it sets to TRUE and then change it to FALSE to go back to 5.

this is what I came up with:

<?php $menu_name = 'top_menu';
$menu = wp_get_nav_menu_object($menu_name);
$menuitems = wp_get_nav_menu_items( $menu->term_id, array( 'order' => 'DESC' ) );
?>
<ul class="nav top-nav">
<?php
$count = 0;
$submenu = false;
$i=0;
$output = '';
$first_menu = true;
foreach( $menuitems as $item ){
    $link = $item->url;
    $title = $item->title;

    //if no parent
    if ( !$item->menu_item_parent ) {
    $parent_id = $item->ID;
    $output .= '<li>
        <a href="'.$link.'">'.$title.'</a>';
    }

    if ( $parent_id == $item->menu_item_parent ) {

        if ( !$submenu ) {
        $submenu = true;
        $output .= '<div class="mega-menu-section">
            <div class="wrapper">
                <ul class="drop-dow">';
        }

            $i++;
                    $output .= '<li>
                        <a href="'.$link.'">'.$title.'</a>
                     </li>';

        if ( $menuitems[ $count + 1 ]->menu_item_parent != $parent_id && $submenu ) {
                $output .= '</ul> 
            </div>
        </div>';
        $submenu = false;
        $i=0;
        } else if (($i==10) && ($first_menu == true)) {
                $output .= '</ul>
                <ul class="drop-dow">';
                $i=0;
                $first_menu = false;
        } else if ($i==5) {
                $output .= '</ul>
                <ul class="drop-dow">';
                $i=0;
        }
    }

    if ( $menuitems[ $count + 1 ]->menu_item_parent != $parent_id ) {
    $output .= '</li>';
    $submenu = false;
    }
    $count++;
}
echo $output; ?>

</ul>

See the variable "first_menu" which I set to true to show 10 in the first menu. unfortunately it is not working

I will appreciate any help!

Thanks

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.