• Resolved BriteWebs

    (@britewebs)


    Hi
    I want the menu at the top of the page on a mobile device to show the main menu (of 9 sticky posts). At present it defaults to the social menu. The home page has the main menu top right and the social menu bottom right which is what I want. When I edit the social menu to add the 9 posts, I lose the social menu on the footer of the desktop site. Is there a way to edit just the mobile menus? My site is live at scarsdale411.com

Viewing 9 replies - 1 through 9 (of 9 total)
  • Hi there,

    I visited scarsdale411.com on my mobile and am able to see the main menu (with the nine sticky posts) in the upper left of your home page. Are you not able to see that main menu when visiting the site on your phone?

    I can see that you have Jetpack’s mobile theme enabled. If you scroll down to the “Custom Menus” of their support documentation here, you’ll find some information on changing which menu is displayed with their theme:

    https://jetpack.com/support/mobile-theme/

    It’s worth noting that Cubic is designed to adapt based on the size of the screen it’s being viewed on. You can deactivate Jetpack’s mobile menu via Jetpack > Settings and use the Cubic theme’s mobile design, if you’d prefer. Both your main and social menus would then display on mobile.

    Let me know how you decide to go forward and if you have any other questions.

    Thread Starter BriteWebs

    (@britewebs)

    Hi

    Yes, I changed the social menu so it shows the main menu on the top upper left on my iphone screen. The problem is when I do this, the social menu on the home page on a desktop disappears.

    IF I use the default settings, with a desktop main menu top right and a social menu footer, then the mobile display has a top left social items menu. I want the main menu to be at the top.

    Hi there,

    I think I see what you mean! The first step to change the menu that the Jetpack mobile theme displays by default is to obtain your primary menu’s ID.

    To obtain your menu’s ID, follow these steps:

    • Install and activate the Functionality plugin.
    • Navigate to Appearance > Menus in your admin area.
    • Choose your Primary Menu from the Select a menu to edit: dropdown menu and then click on the Select button.
    • Look at and copy the number at the end of the URL to get the menu ID.

    For example, in this URL:

    https://yoursitename.com/wp-admin/nav-menus.php?action=edit&menu=75

    The number 75 is the menu ID.

    Next, navigate to Plugins > Edit Function and add this code:

    function jetpackme_mobile_theme_menu() {
        return 75;
    }
    add_filter( 'jetpack_mobile_theme_menu', 'jetpackme_mobile_theme_menu' );

    Replace 75 with the menu ID of the menu you’d like to display on the mobile theme.

    Save your changes and then navigate back to Appearance > Menus. This time, select Social Menu from the Select a menu to edit: dropdown menu and edit the menu items so that they’re linking to your social profiles again.

    Let me know how you get on with those steps or if you have any other questions.

    Thread Starter BriteWebs

    (@britewebs)

    Hi

    I followed your instructions but I’m still getting the social media menu top left on the mobile display. My main menu is # 2.
    The home page is now displaying ok on the desktop. I just need to get the main menu to the top left of the mobile display.

    Hi there,

    Please can you paste the menu IDs for both your social and primary menu in your reply? I’ll see how I can help.

    Thanks!

    Thread Starter BriteWebs

    (@britewebs)

    Hi
    This is the primary menu – main menu – with the 9 sticky home page posts:
    https://scarsdale411.com/wp-admin/nav-menus.php?action=edit&menu=2

    And this is the social menu :
    https://scarsdale411.com/wp-admin/nav-menus.php?action=edit&menu=3

    not sure if there was ever a menu=1 – maybe that’s the problem?

    Thank you!

    The missing menu=1 should not be a problem.

    Can you confirm that you’ve entered the following code via Plugins > Edit Functions?

    function jetpackme_mobile_theme_menu() {
        return 2;
    }
    add_filter( 'jetpack_mobile_theme_menu', 'jetpackme_mobile_theme_menu' );

    If that still doesn’t work, please try recreating your main menu in order to create a new menu ID for it and see if that new menu works as intended.

    Additionally, can you please let me know what other plugins you have running on your site? I wonder if one may be blocking the code from working as expected.

    Thread Starter BriteWebs

    (@britewebs)

    I think I found the problem. I didn’t realize I had to activate the new plugin based on my site as well as the functionality plug in. Once I activated the new scarsdale411 plugin, the menu is displaying perfectly on my phone.

    Thank you so much for your help.

    I’m glad to hear you were able to pinpoint the problem with the code! ?? If any other questions come up then feel free to start another thread.

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Cubic Menus and mobile display’ is closed to new replies.