Hamburger Menu doesn't open without javascript (missing css noscript, progressive enhancement)

[maltfield]

### Description

The Twenty Twenty-Four hamburger menu (for site navigation on narrow/mobile displays) does not open when clicked/tapped on browsers with javascript disabled.

Note: I'm creating this ticket here on trac because the GitHub repo said to do so here ​https://github.com/WordPress/twentytwentyfour/blob/6d45adf1f4ecb688eb79dacb0f4f9eb34d9d6594/README.md#archived-repository

### Steps to reproduce

1. Download, Install, Open Tor Browser ​https://www.torproject.org/download/
2. Enable "Safest" mode ​https://tb-manual.torproject.org/security-settings/
3. Navigate to some Twenty Twenty-Four website (eg ​https://wp-themes.com/twentytwentyfour/)
4. Reduce the width of the browser until the hamburger menu in the top-right appears
5. Menu icon doesn't appear
6. Clicking the empty area where the menu *should* be does nothing

#### Actual behavior

When javascript is disabled, clicking the hamburger menu does nothing.

#### Expected behavior

The hamburger menu should always open, even on security-hardened web browsers.

#### Why?

There are countless [at-risk](​https://community.torproject.org/user-research/personas/) users around the world who must use Tor Browser for all Internet activity to protect themselves and/or their families. Examples of such groups include:

1. Refugees (eg escaping gang, State, or domestic violence)
2. Journalists (eg reporting on gangs, corruption, or oppressive regimes)
3. Whistleblowers (eg providing information to journalists above)
4. Activists (eg pro-abortion-rights or environmental activists)

Unfortunately, every year numerous people are assassinated in the the above at-risk groups ^{[[1](​https://cpj.org/data/killed/2023/?status=Killed&motiveConfirmed%5B%5D=Confirmed&motiveUnconfirmed%5B%5D=Unconfirmed&type%5B%5D=Journalist&type%5B%5D=Media%20Worker&start_year=2023&end_year=2023&group_by=location)][[2](https://rsf.org/en/rsf-s-2023-round-45-journalists-killed-line-duty-worldwide-drop-despite-tragedy-gaza)][[3](https://unesdoc.unesco.org/ark:/48223/pf0000379589.locale=en)]}. As an Information Security consultant, I've trained such users to use [TAILS](​https://tails.net/) with Tor Browser -- so that all of their internet traffic is protected with [Tor](​https://community.torproject.org/user-research/personas/). And I recommend that they use Tor Browser in "Safest" mode, which disables javascript for additional protection.

Using Tor Browser is the best way for at-risk users to stay safe when using the Internet

Unfortunately it appears that Twenty Twenty-Four has a bug where at-risk users following security best-practices cannot navigate Twenty Twenty-Four websites because the menu doesn't work.

#### Solution

Navigation is neither a bell nor a whistle. Being able to open a menu isn't something that should work only for users with javascript enabled.

For components as critical as basic site navigation, we should provide a <noscript> fallback that opens the menu with CSS.

• ​https://en.wikipedia.org/wiki/Progressive_enhancement

#### Screenshots

Please see the following screenshots taken of the official [Twenty Twenty-Four demo site](​https://wp-themes.com/twentytwentyfour/), taken on 2025-02-27 in Tor Browser v14.0.6 (based on Firefox v128.7.0esr) in Debian 12.

TODO

[maltfield]

In Tor Browser "Standard" Mode (with javascript enabled), the menu works

[maltfield]

In Tor Browser "Strict" Mode (with javascript disabled), the menu does not work

[maltfield]

Meta: How do I edit the OP to fix the html tags & markdown that didn't render?

[poena]

Hi
The menu in this theme is a navigation block that is provided by WordPress. It is not specifically coded for this theme, and the theme can not change its JavaScript.
It is a "drop-in and style" solution and this menu is used in many block themes.

This is not to debate if Tor is important or not: but it is not one of the browsers that are officially supported by WordPress. Please see ​https://make.wordpress.org/core/handbook/best-practices/browser-support/

If you need to create a site for this audience, select a different theme that is built specifically to work without JavaScript.
Or, you can turn the mobile menu off and not use submenus.

If JavaScript is disabled, many other things will stop working, not only the menu.
For example you wont be able to create content or layouts without installing plugins.

Making WordPress work without JavaScript is a much bigger question than this single theme.
It is largely built using JavaScript (React).

[sabernhardt]

The Gutenberg repository has an issue now for the Navigation block (for any theme that might use it):
​https://github.com/WordPress/gutenberg/issues/69363

[westonruter]

Related, for nav menus in non-block bundled themes not working without JavaScript: #50182