Mobile Navigation

January 21, 2015

Mobile Navigation Plugin

A responsive fullscreen mobile menu navigation. Activate it for your custom made theme to save some time.

Settings:

  • Mobile location
  • Mobile breakpoint
  • Background color
  • Text brightness
  • Logo as text or image
  • Logo and menu font family
  • Disable navigation, menu location, CSS, javascript
  • Hide on scroll, on or off
  • Custom CSS

If you don’t want the HTML to go through the action wp_footer, place this somewhere after the beginning of your body-tag: <?php do_action('mn_nav'); ?>. It might be better for readability and perhaps SEO.

Installation

  1. Upload mobile-navigation folder to the /wp-content/plugins/ directory, or use the plugin installer in wp-admin.
  2. Activate the plugin through the ‘Plugins’ menu in WordPress.
  3. Go to Options > Mobile Navigation and set your settings. Be sure to choose a menu that is not empty.

Screenshots

  1. Closed mobile navigation

    Closed mobile navigation

  2. Open fullscreen mobile navigation

    Open fullscreen mobile navigation

  3. General settings

    General settings

  4. Logo settings

    Logo settings

  5. Advanced settings

    Advanced settings

FAQ

Does Mobile Navigation work with every theme?

No. Some themes has some strange CSS and javascript. If another mobile menu tries to be on top there might be a conflict.

Why not put more settings?

I try to keep the settings down. It should just be enough to adapt it to your site in terms of colors and fonts.

Why doesn’t it work?

Make sure you have the actions wp_head() and wp_footer() in your theme. If you have too large screen compared to the breakpoint in your settings the menu is not shown.

Why is the CSS generated as file?

It’s not a good practice to have CSS generated inline. You can disable the CSS if you prefer adding your own.

Changelog

1.5

  • CSS inline option – Use only if file and folders are not writable
  • If no breakpoint set, it will be set to 600px

1.4

  • Added warning when file not writable
  • Setting to set text dark or bright
  • Optional. Put directly after in your theme. Then the mobile menu HTML will be put there instead of the footer. Might be good for readability and perhaps SEO.

1.3

  • Bug fixes.

1.2

  • Initial release on wordpress.org

1.1

  • Many bugs fixed.

1.0

  • A not so public release.

Details

  • Version: 1.5
  • Active installations: 600
  • WordPress Version: 4.1
  • Tested up to: 4.1.41

Ratings


5 Stars
4 Stars
3 Stars
2 Stars
1 Stars