Making one
Appearance → Menus. Add the child item under its parent, then drag it slightly to the right until it indents. That indent is the whole mechanism — WordPress calls it a sub-item, and the theme renders it as a dropdown.
How it behaves
A top-level item with children gets a chevron button beside its label. That button is what opens the sub-menu.
This matters more than it looks. A hover-only dropdown is unreachable by keyboard and awkward on a touchscreen — the first tap opens it and also follows the parent link. With a real button:
- the pointer opens it on hover,
- the keyboard reaches the button with Tab and opens it with Enter or Space,
- a tap opens it without navigating away,
- assistive technology is told whether it is open, via
aria-expanded.
The parent item stays a working link throughout, so a parent page is still reachable.
In the mobile panel
The same toggles, doing the same job: the sub-menu expands in place under its parent rather than flying out. Nothing to configure — see Mobile menu.
Depth
One level of dropdown is what the theme is designed for. Deeper nesting will render, but a second-level fly-out in a blog header is a navigation problem rather than a styling one — if you need three levels, the content probably wants an Archives page or a landing page with links, not a bigger menu.
The footer menu is flat by design and drops sub-items entirely.
Styling the dropdown
Design → Header → Navigation:
| Setting | |
|---|---|
| Dropdown background color | the panel |
| Dropdown text color | links inside it |
| Dropdown hover color | those links under the pointer |
All three are empty by default and follow the header skin — including the dark skin, which lightens the dropdown panel along with everything else, so you rarely need to touch these.
Current-page highlighting
The item for the page you are on is highlighted, and so is its parent. A visitor deep in a section can see which section they are in without opening anything.