I'm using the following walker to create a dropdown menu that I will use on a mobile version of a project I'm working on... it works fine, however, when I select the page, it doesn't load the page, what am I missing?

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

    function start_el(&$output, $item, $depth, $args){
      // add spacing to the title based on the depth
      $item->title = str_repeat("&nbsp;", $depth * 4).$item->title;

      parent::start_el(&$output, $item, $depth, $args);

      // no point redefining this method too, we just replace the li tag...
      $output = str_replace('<li', '<option', $output);

    function end_el(&$output, $item, $depth){
      $output .= "</option>\n"; // replace closing </li> with the option tag

Thanks in advance.

1 Answer 1


You have to tell the browser to change the address in some way.

A simple javascript solution is to put the item URL into the value attribute, and trigger the address change when the option is selected.


$output = str_replace('<li', '<option', $output);


$output = str_replace(
 '<option value="'.$item->url.'" onchange="window.location.href=this.value"',

  • 1
    And don't forget a submit button for users without JavaScript.
    – fuxia
    Commented Apr 9, 2012 at 21:53
  • I just realized that I did not make it work exactly as you said, just in case anyone else needs 1, the onchange event has to be placed it in the select, not the option! everything else is perfect Commented Apr 13, 2012 at 18:40

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.