How to Display image from Menu Image in Walker Dropdown Select Menu
Created a custom menu list, titled Country that has flags representing countries (only Canada and USA) using the plugin Menu Image
I combined this menu with Walker, to create a dropdown. I however can only access the title assigned to the images, and cannot find out where the image information is actually stored within the $item
.
Here is the Walker Class the I have used, this displays the Title of the selected item in the dropdown.
class Walker_Nav_Menu_Dropdown extends Walker_Nav_Menu {
function start_lvl($output, $depth){
$indent = str_repeat("\t", $depth); // don't output children opening tag (`ul`)
}
function end_lvl($output, $depth){
$indent = str_repeat("\t", $depth); // don't output children closing tag
}
/**
* Start the element output.
*
* @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. May be used for padding.
* @param array $args Additional strings.
* @return void
*/
function start_el($output, $item, $depth, $args) {
//var_dump($item); exit;
foreach ($item as $key=$value){
if(strpos(strtolower((string)$value),"anada")!== false){
echo $key .":".$value."";
}
}
$url = '#' !== $item-url ? $item-url : '';
$output .= 'option value="' . $url . '"' . $item-title;
// $item-image;
}
function end_el($output, $item, $depth){
$output .= "/option\n"; // replace closing /li with the option tag
}
}
The call to this class is made inside my theme like so:
?php
// Nav Menu Dropdown Class
include_once( '/lib/classes/nav-menu-dropdown.php' );
wp_nav_menu( array(
// 'theme_location' = 'mobile',
'menu' = 'Country',
'walker' = new Walker_Nav_Menu_Dropdown(),
'items_wrap' = 'div class="mobile-menu"formselect onchange="if (this.value) window.location.href=this.value"%3$s/select/form/div',
) );
?
I have var_dumped information but I found nothing to assist me. I also output the menu using the standard method of wp_nav_menu( array( 'menu' = 'Country'));
This above displays the menu images that I would like to see in my dropdown, and I know where the images are stored, but I want to access it from the $item
when I am building my walker dropdown
Update 1: Modification to function start_el
function start_el($output, $item, $depth, $args) {
$menuImage = new Menu_Image_Plugin();
$menuImage-menu_image_nav_menu_item_filter($output2, $item, $depth, $args);
var_dump($output2);
$url = '#' !== $item-url ? $item-url : '';
$output .= 'option value="' . $url . '"' . $output2;
// $item-image;
}
function end_el($output, $item, $depth){
$output .= "/option\n"; // replace closing /li with the option tag
}
}
Output from $menuImage-menu_image_nav_menu_item_filter()
was NULL
.
Update 2
Reviewed the function of menu_image_nav_menu_item_filter
in menu_image.php
function start_el($output, $item, $depth, $args) {
$image_size = $item-image_size ? $item-image_size : apply_filters( 'menu_image_default_size', 'menu-36x36' );
$image = wp_get_attachment_image( $item-thumbnail_id, $image_size, false, "class=menu-image {$class}" );
var_dump($image); //read string out
echo $image; //displays the image
$url = '#' !== $item-url ? $item-url : '';
$output .= 'option value="' . $url . '"' . $image;
// image is not being included in $output
}
function end_el($output, $item, $depth){
$output .= "/option\n"; // replace closing /li with the option tag
}
}
The image is still not included in the output?