disable "tinyNav" on mobile

Support Area Forums Moonrise disable "tinyNav" on mobile

Viewing 4 posts - 1 through 4 (of 4 total)
URL to the page in question: http://www.breadandmeat.co.uk
  • Author
    Posts
  • #24923
    Peter Macdonald
    Participant

    Hi Bill,

    I’m fairly new to wordpress, and loving moonrise but having trouble tweaking a few things.
    I’d like to keep my top navigation menu pretty much as it is on mobile devices instead of having the drop-down ‘tinyNav’ effect. Can you tell me how to do this?

    Currently I have tried inserting a menu ‘page’ on the home section one widget, with a menu shortcode to a menu I have set up – but I can’t for the life of me get it to centre on larger screens!

    Any help would be much appreciated,

    thanks

    Peter

    #24928
    Bill Robbins
    Moderator

    Hello Peter,

    Welcome to WordPress. Great question too. You can change things up so that the original menu stays in place instead of switching over to TinyNav. Here’s how to do that:

    1. Go to your theme options page and choose the Advanced tab.
    2. Scroll down to the Custom CSS box and add this:
      
      @media only screen and (max-width: 767px) {
      	
      	ul#site-navigation {
      		display: block;
      		text-align: center;
      	}
      	
      	#header ul#site-navigation li {
      		display: inline-block;
      		float: none;
      	}
      	
      	select.tinynav {
      		display: none;
      	}
      
      }
      
    3. Update your settings.

    That should hide the TinyNav and replace it with the standard text menu. Let me know if it gives you any trouble.

    Thanks,
    Bill

    #24933
    Peter Macdonald
    Participant

    Thanks Bill,

    simple once you know how!

    Thanks for the near-instant response,

    Peter

    #24935
    Bill Robbins
    Moderator

    Anytime Peter. Let me know if you need anything else.

Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘disable "tinyNav" on mobile’ is closed to new replies.