WordPress menu customazation – quick and easy.

Discover how to customize quick & easy your WordPress menu for better navigation and a personalized look. Change colors, move items, create a sticky menu, and more.

New to WordPress? One of the first things you’ll probably wonder is how to adjust your website’s menu. That’s understandable – navigation is one of the most crucial parts of any website.

A good, clear, and eye-catching menu helps guide visitors and improves usability. Of course, a poorly designed menu can do the opposite.

Looking for ways to customize the navigation menu on your WordPress site? This article covers everything you need to know.

We’ll explore how to edit your WordPress menu’s content, design, and position. With these tips, you’ll create the ideal menu for your visitors – helping them find what they need faster, stay longer, and even boosting your SEO.

There’s a lot on the menu, so let’s dive in and start customizing!

How to Add Menus in the WordPress Admin Dashboard

Let’s start simple: adding a menu in WordPress.

Go to Appearance > Menus in your WordPress dashboard. Here, you can create new menus, edit existing ones, assign them to specific locations, and delete them. Let’s walk through this step by step.

Note: You can also edit menus via Appearance > Customizer > Menus. If you make changes here, WordPress will show them live in a preview. Click Publish to make the changes permanent.

Add Menu Items

In the ‘Appearance > Menus’ section, you’ll see existing menus that you can edit. If no menu has been created yet, click the link at the top of the screen that says:

‘Edit your menu below or create a new one’

Then click the blue ‘Save Menu’ button.

To add items to your menu, use the ‘Add Items’ button. You can add:

• Posts
• Pages
• Custom Links
• Categories
• Tags

Check the box next to the page or post you want to add – multiple selections are possible. Then click ‘Add to Menu’. The selected item will now appear in the menu structure.

Adding Posts and Categories works the same way, only the content differs. With ‘Custom Links’, you can enter any URL, including links to external websites.

Edit Menu Labels

On the right side of the screen, you’ll see your menu items displayed as stacked blocks. You can drag these to rearrange their order. If you drag a block slightly underneath another one, it becomes a sub-item – this is how you create dropdown menus.

Once you’re happy with the layout, click the ‘Save Menu’ button to confirm.

Clicking the arrow next to a menu item reveals additional options. Here, you can change the Navigation Label (the displayed name of the menu item), remove items, edit the URL for custom links. Don’t forget to save your menu after making changes.

Use the Screen Options (Make Sure to Enable It First)

At the top of the page, you’ll find the ‘Screen Options’ button. Click on it to open the menu.

Under ‘Screen Options’, you’ll find additional settings to customize your menu items. For example, if you want the option to open links in a new tab, check the box labeled ‘Link Target’.

Once enabled, each menu item will now include a checkbox to open the link in a new tab – simply tick it if desired.

Does your WordPress theme support descriptions for menu items? Then enable the ‘Description’ option. You’ll now be able to add a short piece of text to relevant menu items.

Publish Your Menu

Once you’re happy with your menu and its contents, you can publish it.
There are two ways to do this:

1. Choose Menu Location under Menu Settings

Under ‘Menu Settings’, you specify where you want the menu to appear. The available options vary depending on your theme, but there is almost always a ‘Primary Menu’. Select it, click ‘Save Menu’, and open your site in the browser. You will now see where your theme displays the menu.

Also try experimenting with the other options, such as ‘Secondary Menu’ and ‘Footer Menu’, to see where they are shown on your site.

2. Assign a menu using the Manage Locations button

At the top of the screen, you’ll see a ‘Manage Locations’ button. Clicking this allows you to select and assign menus to specific locations.

Note: You can also assign menus to a widget area on your site, such as the footer. To do this, go to:

Appearance > Widgets

Now select an available widget area, for example, ‘Footer One’. Click the + icon to add a new block and search for ‘Navigation Menu’.

Select the correct menu, and it will now also appear in the footer.

Menus can also be assigned to a widget area – in this case, ‘Footer One’. You’ll now see the menu appear (also) at the bottom of the page.

Fully Customize Your WordPress Menus (Advanced Users)

You now know how to add and edit a WordPress menu on your site. But there’s a lot more you can do. Let’s dive a little deeper. Not comfortable with CSS? Then ask your webmaster for help. The next steps will help you customize your WordPress menu even further.

For the examples, we’re using the free ‘Neve’ theme from ThemeIsle. If you’re using a different theme, things may work a little differently – but you’ll quickly figure it out, and we’ll show you how.

Find the right CSS code

If you want to style a WordPress navigation menu, you do this with CSS. CSS is your website’s styling language, and it controls things like colors, font size and type, effects, and more.

Tip: Create a ‘Child Theme’ before making any changes. This ensures your modifications won’t be lost when the WordPress theme is updated.

👉 Read the article: Creating a WordPress Child Theme for a perfect template

CSS works with small snippets of code that define the appearance of menus or menu items.

If you’re using Google Chrome as your browser, you can inspect elements and view the relevant code. Right-click on an element, such as the “Home” menu button, and select ‘Inspect Element’ from the menu.

Google Chrome will open the Developer Tools, where you can see the HTML and CSS code used for that button. You’ll then know exactly which code to adjust in your theme—for example, to change the button’s color.

Filter in the ‘Styles’ window using the keyword color. This shows you which colors the stylesheet uses for the theme. If you click on a colored square, a ‘color picker’ will appear. Here, you can select a different color – for example, red.

In the example, you can now see that the menu items are no longer grey, but red.

Hovering over the URL of a stylesheet reveals which file you need to edit to permanently change the color code.

💡 Tip: You can edit CSS files via Appearance > Theme Editor in the WordPress dashboard.

However, be careful – if you make a mistake, your site might stop working. While this can usually be fixed easily, it can still be alarming. That’s why it’s important to always create a backup first and to use a Child Theme to keep your changes safe during theme updates.

💡 Tip: In Developer Tools, you can easily see how changes appear on different devices. You can do that here:

Change Your Menu Colors

Changing the colors of menus is easy and can be done in several ways.

First, there’s the background color of a menu. This is often part of the header. If you find the header code using Developer Tools, you can modify it.

This first method doesn’t always work. Some themes have a dedicated navigation bar. In that case, you’ll need to modify the wrapping element of the menu itself.

Use Developer Tools again to find the correct code and optionally filter by color. If the code doesn’t make sense to you, try changing various color values until you find the right one.

With this snippet of code, you change the background color to blue in the Neve theme.

💡 Note: In Developer Tools, you can adjust color codes, but this is purely visual. The tool does not save the changes. To make them permanent, you need to save them in the CSS file of your Child Theme.

Create a Sticky Menu

A WordPress navigation menu typically appears at the top of your site and disappears when you scroll down. With a sticky menu, it stays fixed at the top of the screen.

A sticky menu can be very helpful for giving visitors constant access to top navigation.

There are three ways to enable a sticky menu:

1. Many WordPress themes have a built-in sticky menu option. In that case, it’s as simple as checking a box – and you’re done.

2. You can also make a menu sticky using CSS. It may sound tricky, but this video shows you exactly how it works.

3. A third option is to install a plugin. A good example is myStickymenu. This video shows how the plugin works and how to configure it step by step.

Little coding experience? Then using a plugin is the fastest option. However, it adds extra weight to your site, which can slow things down and potentially make it more vulnerable to hackers. That’s why it’s best to first explore option 1 (theme settings) and option 2 (CSS).

How Do You Customize Your WordPress Navigation Menu?

Navigation is essential for every WordPress website. If your menus aren’t set up properly, your site becomes practically unusable. You can customize navigation menus in several ways: directly within WordPress, using plugins, or by adding code. With the tips in this article and the many helpful videos on YouTube, you’ll be creating the perfect menus for your site in no time. hat’s your preferred method for customizing your WordPress menus?