---
url: 'https://dxpr.com/drupal-blog/drupal-dropdown-menu'
title: 'Drupal dropdown menus: how to build them in Drupal 11 | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-23T08:27:11+00:00'
updated: '2026-10-23T08:27:16+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: 'A dropdown menu in Drupal 11 always starts in the same place: the core menu system, where you nest links under a parent. What turns that structure into a dropdown is either your theme or a menu module. This post walks through both routes, shows what the result looks like on desktop and on a phone, and compares the menu modules that are maintained for Drupal 11 today.'
tags:
  - 1.0.12
  - 1.4.0
  - planet
  - menus
  - megamenu
  - 'multilevel menu'
  - 'DXPR Theme'
  - 'drupal theme'
image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
published: true
og:
  site_name: DXPR
  updated_time: '2026-10-23T08:27:16+0000'
  'image:alt': 'Drupal dropdown menus: how to build them in Drupal 11'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      '@type': FAQPage
      mainEntity:
        -
          '@type': Question
          name: 'How do I make a dropdown menu in Drupal?'
          acceptedAnswer:
            '@type': Answer
            text: '<p>Nest the child links under their parent in <em>Structure</em>, <em>Menus</em>, save the menu, and tick <em>Show as expanded</em> on each parent link. A theme with dropdown support, such as Olivero or DXPR Theme, then shows the children as a dropdown. If your theme does not, add a module such as Superfish.</p>'
        -
          '@type': Question
          name: 'Why does my Drupal menu not show its dropdown?'
          acceptedAnswer:
            '@type': Answer
            text: '<p>Usually because the parent link does not have <em>Show as expanded</em> ticked, so Drupal only renders its children on the parent&#039;s own page. Ticking <em>Expand all menu links</em> in the menu block&#039;s settings fixes that for every parent at once. The other common cause is the block&#039;s <em>Number of levels to display</em>, which limits how deep the block renders; a value of 1 hides every dropdown.</p>'
        -
          '@type': Question
          name: 'Can a Drupal dropdown menu contain images or blocks?'
          acceptedAnswer:
            '@type': Answer
            text: '<p>Not with core menus alone: a core menu holds links. Mega menu modules such as The Better Mega Menu and Drupal Mega Menu let you place images, videos and blocks inside a dropdown. Many sites keep the menu to links and put that content on the landing pages the menu leads to, which is easier to maintain and to translate.</p>'
        -
          '@type': Question
          name: 'How do dropdown menus work on phones?'
          acceptedAnswer:
            '@type': Answer
            text: '<p>Responsive themes fold the menu behind a hamburger icon below a breakpoint and open each level on tap; DXPR Theme does this below 1200 pixels by default, and the breakpoint is a theme setting. For a separate off-canvas menu on phones, the Responsive and off-canvas menu module adds one through the mmenu library.</p>'
        -
          '@type': Question
          name: 'Can AI build my Drupal menu?'
          acceptedAnswer:
            '@type': Answer
            text: '<p>Yes. With the Drush Webmaster skill installed, a coding agent such as Claude Code creates, nests and orders menu links from a brief, and with DXPR Theme&#039;s agent skill it also sets the header layout and menu colors. A person reviews the result on the site before it goes live. <a href="/drupal-agent-skills">See the DXPR agent skills</a>.</p>'
    -
      '@type': BlogPosting
      headline: 'Drupal dropdown menus: how to build them in Drupal 11'
      description: 'A dropdown menu in Drupal 11 always starts in the same place: the core menu system, where you nest links under a parent. What turns that structure into a dropdown is either your theme or a menu module. This post walks through both routes, shows what the result looks like on desktop and on a phone, and compares the menu modules that are maintained for Drupal 11 today.'
      about:
        - planet
        - menus
        - megamenu
        - 'multilevel menu'
        - 'DXPR Theme'
        - 'drupal theme'
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/sites/default/files/documentation-files/2026/menu-03b-desktop-crop.webp'
        width: '1440'
        height: '424'
      datePublished: '2026-10-23T08:27:11+0000'
      dateModified: '2026-10-23T08:27:16+0000'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      mainEntityOfPage: 'https://dxpr.com/drupal-blog/drupal-dropdown-menu'
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/drupal-blog/drupal-dropdown-menu'
      description: 'A dropdown menu in Drupal 11 always starts in the same place: the core menu system, where you nest links under a parent. What turns that structure into a dropdown is either your theme or a menu module. This post walks through both routes, shows what the result looks like on desktop and on a phone, and compares the menu modules that are maintained for Drupal 11 today.'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
      inLanguage: en
---
[Blog](/blog) / Drupal dropdown menus: how to build them in Drupal 11 # Drupal dropdown menus: how to build them in Drupal 11

   **Jurriaan** 23 October 2026

A dropdown menu in Drupal 11 always starts in the same place: the core menu system, where you nest links under a parent. What turns that structure into a dropdown is either your theme or a menu module. This post walks through both routes, shows what the result looks like on desktop and on a phone, and compares the menu modules that are maintained for Drupal 11 today.

The screenshots come from a Drupal 11.4 site with DXPR Theme 8.2.2, taken in October 2026; the module details come from drupal.org on 23 October 2026.

**In short:** build the menu under *Structure*, *Menus*, nest the links, and tick *Show as expanded* on every parent. A theme with dropdown support, such as Olivero (one dropdown level) or DXPR Theme (three levels, automatic columns), then renders the dropdowns. Add a module such as Superfish or The Better Mega Menu only when the theme cannot do what you need.

**Let an AI agent build the menu.** A menu is a list of links with a hierarchy, the kind of structured task a coding agent does well. With the [Drush Webmaster skill](/drupal-agent-skills), an agent creates and orders the menu links from a short brief, and with DXPR Theme's agent skill it sets the header layout and menu colors to match the brand. You review the result on the site.

## 1. Create the menu structure in Drupal core

Go to *Structure*, *Menus*, and edit the menu that sits in your header, usually *Main navigation*. Add the links with *Add link*, then drag each child under its parent so it indents one level, and press **Save**.

Next, edit every parent link and tick **Show as expanded**. Without it, Drupal only renders a parent's children on that parent's own page, so the dropdown stays empty everywhere else. To expand every parent at once, tick *Expand all menu links* in the settings of the menu block instead. For a parent that should only open its dropdown, enter `<button>` or `<nolink>` as the link instead of a page.

## 2. Let the theme render the dropdowns

Most current Drupal themes turn a nested menu into dropdowns on their own; how deep they go and how the dropdown looks differs per theme.

- **Olivero**, Drupal core's default front-end theme up to Drupal 11.4, places its main menu block with a depth of two: the top level plus one dropdown level, with a button next to each parent.
- **DXPR Theme** renders three levels. A dropdown with 8 or more links splits into columns, and from 15 links it spans the full width of the header, which gives you a mega menu without a module. On a mouse, dropdowns open on hover, and when any dropdown has a third level they open on click. Below the mobile breakpoint, 1200 pixels by default, the menu folds into a hamburger menu that expands each level in place. The [mega menu guide](/hc/documentation/learn-dxpr-theme/low-code-theme-customization/responsive-multi-level-mega-menus) covers every setting.

## 3. Or add a menu module

A module makes sense when the theme cannot render what you need, for example images or blocks inside the dropdown, or a separate off-canvas menu for phones. These are the maintained options for Drupal 11:

| Module | What it does | Latest stable release | Reported sites |
|---|---|---|---|
| [Superfish Dropdown Menu](https://www.drupal.org/project/superfish) | Dropdowns from the jQuery Superfish plugin, with multi-column sub-menus and right-to-left support; needs the Superfish library in `/libraries` | 8.x-1.17, 16 Oct 2026, Drupal 9 to 11 | 64,556 |
| [The Better Mega Menu](https://www.drupal.org/project/tb_megamenu) | An admin interface for dropdowns that combine menu links with images, videos and blocks | 8.x-1.10, 28 Aug 2025, Drupal 8 to 11 | 18,522 |
| [Responsive and off-canvas menu](https://www.drupal.org/project/responsive_menu) | A horizontal menu on wide screens and an off-canvas menu on phones, through the mmenu library | 4.4.5, 4 Feb 2025, Drupal 9.3 to 11 | 10,647 |
| [Drupal Mega Menu](https://www.drupal.org/project/we_megamenu) | A drag-and-drop mega menu builder with layout styles and animations; minimally maintained | 8.x-1.17, 22 Sep 2026, Drupal 10.3 and 11 | 5,067 |
| [Simple Mega Menu](https://www.drupal.org/project/simple_megamenu) | Foundations for a mega menu you build yourself with Twig and content entities | 2.2.0, 9 Sep 2024, Drupal 10.3 and 11 | 1,655 |

To show only part of a menu elsewhere on the page, for example the children of the current section in a sidebar, core's menu blocks have *Initial visibility level* and *Number of levels to display* settings, and the [Menu Block](https://www.drupal.org/project/menu_block) module adds options such as rooting the block at a specific menu item.

## Which option should you pick?

- **Links only, one dropdown level:** core menus and your theme, nothing to install.
- **Three levels, columns or a full-width mega menu, and a mobile menu:** a theme that renders them, such as DXPR Theme, so the menu stays plain Drupal configuration.
- **Images, videos or blocks inside the dropdown:** The Better Mega Menu or Drupal Mega Menu. Each one adds its own configuration screen and markup to maintain.
- **A dedicated off-canvas menu on phones:** Responsive and off-canvas menu.

## Questions about Drupal dropdown menus

### How do I make a dropdown menu in Drupal?

Nest the child links under their parent in *Structure*, *Menus*, save the menu, and tick *Show as expanded* on each parent link. A theme with dropdown support, such as Olivero or DXPR Theme, then shows the children as a dropdown. If your theme does not, add a module such as Superfish.

### Why does my Drupal menu not show its dropdown?

Usually because the parent link does not have *Show as expanded* ticked, so Drupal only renders its children on the parent's own page. Ticking *Expand all menu links* in the menu block's settings fixes that for every parent at once. The other common cause is the block's *Number of levels to display*, which limits how deep the block renders; a value of 1 hides every dropdown.

### Can a Drupal dropdown menu contain images or blocks?

Not with core menus alone: a core menu holds links. Mega menu modules such as The Better Mega Menu and Drupal Mega Menu let you place images, videos and blocks inside a dropdown. Many sites keep the menu to links and put that content on the landing pages the menu leads to, which is easier to maintain and to translate.

### How do dropdown menus work on phones?

Responsive themes fold the menu behind a hamburger icon below a breakpoint and open each level on tap; DXPR Theme does this below 1200 pixels by default, and the breakpoint is a theme setting. For a separate off-canvas menu on phones, the Responsive and off-canvas menu module adds one through the mmenu library.

### Can AI build my Drupal menu?

Yes. With the Drush Webmaster skill installed, a coding agent such as Claude Code creates, nests and orders menu links from a brief, and with DXPR Theme's agent skill it also sets the header layout and menu colors. A person reviews the result on the site before it goes live. [See the DXPR agent skills](/drupal-agent-skills).

## A mega menu without a module.

DXPR Theme turns your Drupal menu into multi-level dropdowns, full-width mega menus and a mobile menu, styled from its settings. Try it in the live demo or read the step-by-step guide.

 [Try Live Demo](https://try.dxpr.com)

 [Read the mega menu guide](/hc/documentation/learn-dxpr-theme/low-code-theme-customization/responsive-multi-level-mega-menus)

 <a class="a2a_button a2a_button_x"></a><a class="a2a_button a2a_button_linkedin"></a>