Using wp_list_categories or other function inside a menu walker?

Question

I'm new to messing around with menu walkers in WP, so I might be trying to do something that's not possible, I'm not sure.

What I'm trying to do is insert a div containing a list of my product categories inside a particular menu item. I've got a walker working to target that list item and insert my wrapper, but I can't for the life of me figure out how to add my wp_list_categories function insde that output. Here is what I have:

class Custom_Nav_Walker extends Walker_Nav_Menu {

    function end_el( &$output, $item, $depth = 0, $args = array() ) {
        if ($item->object_id == 128) {          



                $output .= "<div class='menu-categories'>
                    <div class='row'>
                        <div class='medium-6 columns'>
                            <h2>Costumes &amp; Accessories</h2>
                            <ul>
                             THIS IS WHERE I WANT TO ADD wp_list_categories
                            </ul>   
                        </div>

                        <div class='medium-6 columns'>
                            <h2>Costume Supplies</h2>
                            <ul>
                            THIS IS WHERE I WANT TO ADD wp_list_categories
                            </ul>   
                        </div>

                    </div>
                </div>";

                $output .= "</li>\n";

            }   
    }
}

How can I add a function into the $output? Am I thinking about this all wrong?

Thanks for any help!

Answer 1

Here is my code to edit menu item, maybe it can help you:

class SB_Menu_Walker extends Walker_Nav_Menu {

 /**
 * What the class handles.
 *
 * @see Walker::$tree_type
 * @since 3.0.0
 * @var string
 */
public $tree_type = array('post_type', 'taxonomy', 'custom');

/**
 * Database fields to use.
 *
 * @see Walker::$db_fields
 * @since 3.0.0
 * @todo Decouple this.
 * @var array
 */
public $db_fields = array('parent' => 'menu_item_parent', 'id' => 'db_id');

/**
 * Starts the list before the elements are added.
 *
 * @see Walker::start_lvl()
 *
 * @since 3.0.0
 *
 * @param string $output Passed by reference. Used to append additional content.
 * @param int    $depth  Depth of menu item. Used for padding.
 * @param array  $args   An array of arguments. @see wp_nav_menu()
 */
public function start_lvl(&$output, $depth = 0, $args = array()) {
    $indent = str_repeat("\t", $depth);
    $output .= "\n$indent<ul class=\"sub-menu\">\n";
}

/**
 * Ends the list of after the elements are added.
 *
 * @see Walker::end_lvl()
 *
 * @since 3.0.0
 *
 * @param string $output Passed by reference. Used to append additional content.
 * @param int    $depth  Depth of menu item. Used for padding.
 * @param array  $args   An array of arguments. @see wp_nav_menu()
 */
public function end_lvl(&$output, $depth = 0, $args = array()) {
    $indent = str_repeat("\t", $depth);
    $output .= "$indent</ul>\n";
}

/**
 * Start the element output.
 *
 * @see Walker::start_el()
 *
 * @since 3.0.0
 *
 * @param string $output Passed by reference. Used to append additional content.
 * @param object $item   Menu item data object.
 * @param int    $depth  Depth of menu item. Used for padding.
 * @param array  $args   An array of arguments. @see wp_nav_menu()
 * @param int    $id     Current item ID.
 */
public function start_el(&$output, $item, $depth = 0, $args = array(), $id = 0) {
    // Lấy thông tin title của menu item
    $menu_title = $item->title;
    $menu_title_slug = SB_Core::sanitize_slug($menu_title);

    $indent =($depth) ? str_repeat("\t", $depth) : '';

    $classes = empty($item->classes) ? array() : (array) $item->classes;
    $classes[] = 'menu-item-' . $item->ID;

    // Thêm class vào menu item
    $classes[] = 'menu-' . $menu_title_slug;

    /**
     * Filter the CSS class(es) applied to a menu item's list item element.
     *
     * @since 3.0.0
     * @since 4.1.0 The `$depth` parameter was added.
     *
     * @param array  $classes The CSS classes that are applied to the menu item's `<li>` element.
     * @param object $item    The current menu item.
     * @param array  $args    An array of {@see wp_nav_menu()} arguments.
     * @param int    $depth   Depth of menu item. Used for padding.
     */
    $class_names = join(' ', apply_filters('nav_menu_css_class', array_filter($classes), $item, $args, $depth));
    $class_names = $class_names ? ' class="' . esc_attr($class_names) . '"' : '';

    /**
     * Filter the ID applied to a menu item's list item element.
     *
     * @since 3.0.1
     * @since 4.1.0 The `$depth` parameter was added.
     *
     * @param string $menu_id The ID that is applied to the menu item's `<li>` element.
     * @param object $item    The current menu item.
     * @param array  $args    An array of {@see wp_nav_menu()} arguments.
     * @param int    $depth   Depth of menu item. Used for padding.
     */
    $id = apply_filters('nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args, $depth);
    $id = $id ? ' id="' . esc_attr($id) . '"' : '';

    $output .= $indent . '<li' . $id . $class_names .'>';

    $atts = array();
    $atts['title']  = !empty($item->attr_title) ? $item->attr_title : '';
    $atts['target'] = !empty($item->target)     ? $item->target     : '';
    $atts['rel']    = !empty($item->xfn)        ? $item->xfn        : '';
    $atts['href']   = !empty($item->url)        ? $item->url        : '';

    /**
     * Filter the HTML attributes applied to a menu item's anchor element.
     *
     * @since 3.6.0
     * @since 4.1.0 The `$depth` parameter was added.
     *
     * @param array $atts {
     *     The HTML attributes applied to the menu item's `<a>` element, empty strings are ignored.
     *
     *     @type string $title  Title attribute.
     *     @type string $target Target attribute.
     *     @type string $rel    The rel attribute.
     *     @type string $href   The href attribute.
     * }
     * @param object $item  The current menu item.
     * @param array  $args  An array of {@see wp_nav_menu()} arguments.
     * @param int    $depth Depth of menu item. Used for padding.
     */
    $atts = apply_filters('nav_menu_link_attributes', $atts, $item, $args, $depth);

    $attributes = '';
    foreach($atts as $attr => $value) {
        if(!empty($value)) {
            $value =('href' === $attr) ? esc_url($value) : esc_attr($value);
            $attributes .= ' ' . $attr . '="' . $value . '"';
        }
    }

    $item_output = $args->before;
    $item_output .= '<a'. $attributes .'>';

    $item_output .= $args->link_before;

    $item_output = apply_filters('sb_theme_menu_item_output_link_text_before', $item_output, $item);

    $link_text = apply_filters('the_title', $item->title, $item->ID);
    $item_output .= apply_filters('sb_theme_menu_item_output_link_text', $link_text, $item);

    if(SB_Tool::use_menu_item_description() && !empty($item->description)) {
        $item_output .= '<span class="description">' . $item->description . '</span>';
    }

    $item_output = apply_filters('sb_theme_menu_item_output_link_text_after', $item_output, $item);

    $item_output .= $args->link_after;

    $item_output .= '</a>';
    $item_output .= $args->after;

    /**
     * Filter a menu item's starting output.
     *
     * The menu item's starting output only includes `$args->before`, the opening `<a>`,
     * the menu item's title, the closing `</a>`, and `$args->after`. Currently, there is
     * no filter for modifying the opening and closing `<li>` for a menu item.
     *
     * @since 3.0.0
     *
     * @param string $item_output The menu item's starting HTML output.
     * @param object $item        Menu item data object.
     * @param int    $depth       Depth of menu item. Used for padding.
     * @param array  $args        An array of {@see wp_nav_menu()} arguments.
     */
    $output .= apply_filters('walker_nav_menu_start_el', $item_output, $item, $depth, $args);
}

/**
 * Ends the element output, if needed.
 *
 * @see Walker::end_el()
 *
 * @since 3.0.0
 *
 * @param string $output Passed by reference. Used to append additional content.
 * @param object $item   Page data object. Not used.
 * @param int    $depth  Depth of page. Not Used.
 * @param array  $args   An array of arguments. @see wp_nav_menu()
 */
public function end_el(&$output, $item, $depth = 0, $args = array()) {
    $output .= "</li>\n";
}

}