How to Create a Mobile Ready Responsive WordPress Menu


Hey there and welcome to WPBeginner. In
this video I want to walk you through how you can create a mobile-ready responsive wordpress menu. To get that on your site, let’s go to our WordPress dashboard we’ll
be installing a plug-in so we’ll head over to plugins add new we’re looking
for the responsive menu plug-in and that gives you like the what they call is the
hamburger style menu so we’ll install that, and we need to activate it. Once
it’s activated you’ll see a new menu item over here and you can go in and set
it up. The break point that means how small does the screen size need to get before
it starts using this one. 800 is pretty good it’s usually for tablet or smaller
and the menu to use it for we have all pages that’s our default menu for the
site and then you can add some CSS if you want. So I’m happy with that so we’ll
click update let’s go to the front of our site to show you what it looks like.
Alright since our site is on a full screen we are seeing the full menu up here but
let’s see what it will look like when we shrink it. So when you shrink it you now see the
responsive menu here and i can go through and pick the page that I want
from there. Now the other one I want to show you is different style of menu it’s
called the responsive drop-down menu and it will be a little bit different. So I’m
going to remove this one and I want to add a new plugin called responsive
select menu. This is the one we want so we’ll install
that one and activate it and now when we go to our site now instead of the little
hamburger icon we have this drop down. To check out a couple more advanced
techniques go to our article see how you can add the toggle effect for your menu
and a slide in mobile menu in WordPress If you like this video click on the like
button and go ahead and leave us a comment there we’d love to hear from you
and subscribe to our YouTube channel to get the latest videos

Leave a Reply

Your email address will not be published. Required fields are marked *