0

I am working on a WordPress website, where I try to show a different menu based on the device (desktop vs. mobile).

In order to do that, I added some code to the header.php file:

<?php
                if(wp_is_mobile()){
                    wp_nav_menu(
                        array(
                            'menu'              => 'secondary',
                            'theme_location'    => 'secondary',
                            'depth'             => 2,
                            'container'         => 'nav',
                            'container_id'      => 'navbar-collapse',
                            'container_class'   => 'collapse navbar-collapse ',
                            'menu_class'        => 'nav navbar-nav navbar-right topnav navbar-static-top show-on-hover',
                            'fallback_cb'       => 'wp_bootstrap_navwalker::fallback',
                            'menu_id'           => 'main-menu',
                            'walker'            => new wp_bootstrap_navwalker()
                        )
                    );
                }
                else{
                    wp_nav_menu(
                        array(
                            'theme_location'    => 'primary',
                            'depth'             => 3,
                            'container'         => 'nav',
                            'container_id'      => 'navbar-collapse',
                            'container_class'   => 'collapse navbar-collapse ',
                            'menu_class'        => 'nav navbar-nav navbar-right topnav navbar-static-top show-on-hover',
                            'fallback_cb'       => 'wp_bootstrap_navwalker::fallback',
                            'menu_id'           => 'main-menu',
                            'walker'            => new wp_bootstrap_navwalker()
                        )
                    );
                }
                ?>

This works for all the pages, except for the homepage.

I looked into the index.php and page.php. Both call a header where I use this code. There are no errors on the page. I checked for things like is_home and is_front_page to prevent that somewhere anything of the header is changed.

Anyone any ideas on how to solve this?

Thank you in advance!

Regards, Gerroe

1 Answer 1

0

did you check that somehow the menu has been hidden because of css for the homepage? that can be a reason.

2
  • Thank you for your answer. I just checked again and I do not think that this is the problem. The menu is showing in mobile & desktop mode, however, only on the frontpage (home), I see the desktop-menu (which should disappear in mobile mode).
    – Gerroe
    Sep 12, 2018 at 18:20
  • Then maybe i can't say you what is exactly happening without seeing your site. anyway i can give you another suggestions that you can call both menu in separate div but for control the desktop and mobile version menus, you can add the css in the media quires by display block and none.
    – Md. Easin
    Sep 12, 2018 at 18:30

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.