WordPress Wednesday: How to Create a Custom Menu

Time for another WordPress Wednesday! Weekly tips for new and established self-hosted WordPress users, designed to help you get the most out of your site from Sarah, a freelance WordPress website developer.


How to create a custom WordPress menu

If you’re new to WordPress you might not have realised that you can customise the menus on your site. (We’re talking about the navigation on the front end of your site, not the menus on the dashboard).

How to create a custom menu in WordPress

how our main navigation menu looks

There are many reasons for wanting to create a custom menu in WordPress, but the main ones are usually that you want to have a bit more control on how the list of pages are displayed, or maybe you want to add an external link to your Etsy shop or Tumblr account.

First things first, to find your menu you need to go to Appearance > Menus in the sidebar.

Screen Shot 2015-07-14 at 16.11.32

From there you’ll see the Edit Menus section. If you don’t have any custom menus set up yet it’ll ask you create one. If you do, it’ll load the one you were working on most recently. To create a new menu just give it a name (something like Main, Header menu, Footer menu etc) then click the create menu button.

Screen Shot 2015-07-14 at 16.46.06

Once you’ve done that you can start adding stuff to your menu.

Screen Shot 2015-07-14 at 16.46.20

Usually you can add a lot more than you think, so if you don’t see the option you want in the selection on the left, head to the top right of the screen and click on the Screen Options button.

Screen Shot 2015-07-14 at 16.46.29

From there you can check the boxes that you want to use – like posts or tags for example. If you have a portfolio or are using WooCoomerce then you’ll also be able to add projects and products to the menu.

Screen Shot 2015-07-14 at 16.46.37

Once you’ve decided what to add you just need to check the boxes and click Add to Menu.

Screen Shot 2015-07-14 at 16.47.05

From there you can drag items underneath each other to create sub menus.

Screen Shot 2015-07-14 at 16.47.22

If you want to edit how the page name displays you can – just click on the down arrow to open up the item and then rename the Navigation Label. Don’t worry – that’ll only change the menu name, not the actual name of your page!

Screen Shot 2015-07-14 at 16.47.44

You can also add custom links to your menu. If you want to be able to open links in a new tab head to your Screen Options like before and check the Link Target option under Show advanced menu properties.

Screen Shot 2015-07-14 at 16.48.24

You can specify where you want your menu to show – some themes have space for more than one menu. For example, our theme has room for two. We’ve utilised that by setting two different menus but you can set it to be the same one if you prefer.

Screen Shot 2015-07-14 at 16.48.35

You can also access that section from the Manage Locations tab at the top.

Screen Shot 2015-07-14 at 16.48.45

Ta-da! Now if you refresh your site you should see your custom menu in place. You can also go one step further if you want to and add your new menu to your sidebar or footer.

Head to Appearance > Widgets and drag the Custom Menu block over to the widget area you’d like to display it in.

Screen Shot 2015-07-14 at 16.53.54

Then just select your new menu from the dropdown box and click save.

Screen Shot 2015-07-14 at 16.54.23

That’s it – it really is simple to create a custom menu with WordPress but it can make your site look a lot more streamlined and organised, so we really think it’s worth doing! :)

Sarah Chong

Sarah Chong is a freelance Wordpress website developer, an unapologetic geek and a lover of all things yellow.

Leave a Reply

})(jQuery)
Hier gehts zum Onlineshop