0

I have a primary menu which is displayed for desktop

<?php
 //Show the navigation menu
   wp_nav_menu(array(
     'theme_location'    =>  'primary-nav',
      'menu_class'        =>  'navigation d-block',
      'walker'            =>  new My_Walker_Nav_Menu()
        ));
 ?>

And this is the menu for mobile

<?php
  //Show the navigation menu
  if(wp_is_mobile()) {
  wp_nav_menu(array(
  'theme_location' => 'mobile-menu',
  'menu_class' => 'main-ul'
  ));
  }
?>

How can I add a href="javascript:void(0)" for the mobile menu? Menu is:

About ˅

-child

News

Contact

I want if in mobile when About is clicked to show the child and not link you to About page.

0

This is really a problem i think you should solve with javascript if you are looking to solve it with code. I would suggest that you could probably use the wp_is_mobile to add a class to your HTML tag

If that class exists on your html tag run some JS that binds to all the menu items in question's clicks using something like $('.CUSTOM-CLASS-FOR-MENU-ITEM').click(e){ e.preventDefault();} and then the links on those menu items will do nothing.

although I think a much better simple solution, would be to add Custom link Items where the link is just a # mark which will do nothing as well but allow you to :focus it, :hover it etc. You already have two separate menu locations declared in wordpress why not build two different menus and replace that About menu Item with a custom link item and then there is no need for javascript whatsoever.

Your Answer

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

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