Thread: TIP: A better mobile navigation solution

TIP: A better mobile navigation solution

From the get go I was very displeased with the way Vantage menus worked with mobile. The menu and search bar together took up way too much screen real estate and I did not like it as a select menu.

I knew there had to be a solution so I began looking at plugins and found JQuery Slick Menu Widget. I had to setup a few media queries to hide the default navigation menu and the default mobile navigation select menu at a certain screen widths, and hide, then unhide unhide the Slick Menu I was very happy with the result. You can see how it works on my happy hour site. Just grab your browser re-size handles and drag the browser to a narrower ipad or iphone width - or visit my site on a mobile phone. I'm still playing with the styling, but you'll get the idea.

Once the plugin is installed you'll have a widget that you can drag into the footer sidebar, so that it is available on all pages of the site. The bonus is that you can also set a position from any of several options. The only thing I don't like is that I had to edit the plugin's css in order to style it, as I couldn't immediately identify any other way to accomplish that.

Anyway, hope this is useful to those of you who are "mobile first" types like myself.