If you're using the WordPress Block Editor (also known as Gutenberg), you're probably enjoying how visual and flexible it feels. But when it comes to building a dropdown menu, things can get a little confusing—especially if you're used to the Classic Editor or Customizer.

Don't worry, though. It's totally doable. In this guide, I'll show you exactly how to create a dropdown menu in WordPress using the Block Editor—without touching any code.

First, Know What the Block Editor Can and Can't Do

Here's the thing: the Block Editor is great for designing pages and posts, but it doesn't manage your main navigation menu the way the Customizer does.

However, with Navigation Blocks, you can build custom menus right inside full-site editing themes—or within page content if needed.

So if your theme supports full site editing (like Twenty Twenty-Two or Twenty Twenty-Three), you're good to go. If not, you might want to stick with the Customizer or a plugin for menus.

Step-by-Step: Build a Dropdown Menu with the Block Editor

Step 1: Go to the Site Editor

  1. From your WordPress dashboard, go to Appearance > Editor.
  2. This opens the Full Site Editor, where you can edit headers, footers, and more using blocks.

Note: You'll only see this option if your theme supports block-based editing.

Step 2: Edit the Navigation Block

  1. In the editor, click on the Header template part.
  2. Find or add a Navigation block.
  3. You'll see options to add menu items just like you would with a regular menu.

Step 3: Add Top-Level and Sub-Menu Items

  1. Add your main menu items by clicking the + icon.
  2. To create a dropdown, click on any menu item, then hit the "Add submenu" button.
  3. Add the child items inside the submenu.

That's your dropdown right there. It's all visual and block-based, which makes it easier to see what's happening.

Step 4: Rearrange and Customize

  • Drag items to reorder them.
  • Click any item to change the label or link.
  • Use the right sidebar to style your menu—like changing colors or spacing.

You'll also find settings for mobile responsiveness and layout under the block options.

Step 5: Save and Test

Once you're done:

  1. Click Save at the top.
  2. Visit your site and hover over your dropdowns.
  3. Test it on mobile to make sure everything works smoothly.

Quick Tips for Better Dropdown Menus

  • Keep it simple: Don't nest too many levels.
  • Use clear names: Labels should say exactly what they are.
  • Test across devices: Especially on phones and tablets.
  • Use consistent styles: Match your dropdown to the overall site vibe.

Final Thoughts

Creating a dropdown menu in WordPress using the Block Editor might seem unfamiliar at first, but it's easier than it looks. The Navigation block gives you full control in a visual way, making menu setup feel more natural. As long as your theme supports full-site editing, you're good to go.

Take your time to organize the menu, keep it clean, and test it on different devices. A user-friendly menu makes a big difference in how visitors experience your site. And with the Block Editor, you don't need to rely on plugins or code to get it done right.