How to fixed menu scrolling on top wordpress

When you create a website, you spend a lot of time choosing your theme, crafting your content, and promoting your brand online. But no matter how great your site looks and how interesting your content is, you can’t reach your goals if users can’t find your key pages easily. A sticky menu can help this cause. In this article, we’ll show you how to create a sticky menu in WordPress 🧑‍💻.

While there are lots of ways you can improve navigation on your site, a sticky menu is a unique solution since it stays permanently visible on the screen without interrupting or annoying your visitors.

This makes it easy for them to get to your most important content fast.

What is a sticky menu and why do you need one?

Traditional website menus would disappear once the user scrolls past them. This makes it very easy for people to overlook some important piece of content that you really want them to see.

Sticky menus can solve this issue. A sticky menu is a fixed navigation menu on a website that remains visible and in the same place, even when users scroll away and explore the site. It’s so effective that persistent navigation bars (or sticky headers) are pretty much a standard in web design.

👉 Here’s a demo of a sticky menu in WordPress:

Sticky menus are also popular because they aren’t obtrusive. You can usually find them on the side of the screen, which gives you plenty of space to create a website that looks exactly the way you want. These menus can improve the user experience because they contain helpful links that make it easier for users to navigate your site and find exactly what they are looking for with a click or two.

Because these sticky menus are locked in place, your audience will always see your most valuable content, drawing their eyes exactly where you want to. You can use the sticky menu to promote your call-to-action landing pages, social media icons, popular categories, and more.

For example, if you are running an ecommerce store, your top navigation menu should have all of the links that drive sales, like product search, categories, and checkout. If you make that top menu sticky, you can reduce your cart abandonment rates.

⌛ See why it’s important? Let’s go over the steps you need to follow to create a sticky menu in WordPress.

We’re going to cover two different ways you can create a sticky menu:

• (a) and
• (b)

(a) Using the Neve theme to create a sticky menu in WordPress

First, let’s take a look at creating a sticky menu using the Neve theme. Neve is one of the most accessible and useful themes you can adopt for your blog or ecommerce site – and it’s really easy to create a sticky menu using this theme. When you opt for the Pro Version of Neve, you can create a sticky menu that moves when a reader scrolls. And there are plenty of too!

👉 Here’s how to create your sticky menu:

1. Once you have the Neve theme installed, click on Appearance and Customize.

2. Click on Header on the left sidebar menu to open the header builder.

3. You can set up each of the header builder’s three rows to be Sticky and/or to Show only on scroll. Sticky, as we’ve learnt, means that the row will always stick to the top of the page. Show only on scroll means that the row will only appear after the user scrolls on the page.

Access the option to make your menu sticky by clicking the gear icon you’ll see at the beginning of each row:

4. Simply click on the Stick to top option on the left to make your menu sticky.

💡 Bonus tip: Want to make your sticky header smaller when visitors scroll? Read our guide to find out how.

(b) Create a sticky menu using a WordPress plugin

You can also use a plugin to create your sticky WordPress menu. Don’t worry – it’s very easy! 🤩

1. Go to plugins on the right-hand side of your WordPress admin console and select Add New.

2. Search for a sticky menu plugin. We recommend Fixed Widget and Sticky Elements for WordPress because it works with any theme and is very easy to install. Once you find it, click Install and Activate.

3. Next, head over to Appearance on the sidebar menu and select Widgets.

4. Click on the + sign to add your sticky menu. In the search bar that pops up, type and then select Navigation Menu.

5. Give your menu a name and select the menu you’ve created for your site, e.g., Primary Menu. Make sure to check the Fixed Widget box by clicking the square next to it.

6. Click Update to save your sticky menu and you’re done! The menu will remain visible, even when visitors scroll.

How do I make my menu stay on top in WordPress?

The easiest way to add a sticky navigation menu in WordPress is by using Sticky Menu (or Anything!) on Scroll. This plugin allows you to make anything sticky, including menus. First, you'll need to install and activate the plugin. If you need help, then please see our guide on how to install a WordPress plugin.

How do I get the menu bar at the top of WordPress?

How To Turn on The Top Bar Area.

Go to Dashboard -> Appearance -> Customize -> Header ->Top Bar..

Find the Enable Top Bar& turn it on..

Click onSave Changes..

How do I make a sticky header scroll in WordPress?

Open the List View, select your header, click on the three vertical dots and then wrap your header in a Group block. Once you have done that, open up your Settings and scroll down to Position. Open up the drop-down and then select sticky.

How do I change the position of the menu in WordPress?

Move menu to the left.

Go to WordPress admin dashboard -> Appearance -> Customize..

Then go to Header -> Primary Header..

Under the Header Elements option, drag the Main Navigation tile above the Site Branding tile and publish the changes..