Menús: navegación multilingüe con submenús anidados

AliothPress usa un solo árbol de menú para todos los idiomas. El menú se construye una vez y cada visitante lo ve resuelto en su idioma automáticamente: slugs correctos, etiquetas traducidas y ningún enlace a contenido no disponible. El menú de cabecera admite hasta 3 niveles (elemento → hijo → nieto). El menú del pie de página es plano a propósito. Los elementos del menú pueden ser páginas, entradas o enlaces personalizados (incluidas anclas y URL de archivos), cada uno con comportamiento por idioma. Los borradores y las traducciones ausentes se ocultan por idioma, nunca en todo el sitio.

Cómo funciona la resolución multilingüe

Una página o entrada se añade al menú eligiendo cualquiera de sus versiones de idioma. El motor enlaza el elemento del menú con el translation group del contenido, no con un idioma concreto.

Para cada visitante, cada elemento se resuelve de forma independiente:

Dos consecuencias útiles:

• No importa en qué idioma hiciste clic en el editor de menús. Añadir la versión alemana de una página produce el mismo elemento de menú que añadir la inglesa. Añadir ambas es seguro: los duplicados dentro del mismo nivel se fusionan automáticamente. El menú guarda referencias neutras respecto al idioma en lugar de páginas de un idioma concreto.
• Publicar un borrador o reactivar un idioma restaura sus elementos de menú al instante. Nada necesita reconstruirse.

Anidamiento: tres niveles

El menú de cabecera admite tres niveles:

Elemento superior

├── Hijo

│   └── Nieto

└── Hijo

En el editor de menús:

• Arrastra un elemento a la derecha (≥ 30 px) sobre otro para anidarlo como su hijo. Funciona con elementos superiores (crea un hijo) y con hijos (crea un nieto).
• Arrastra a la izquierda para subir un elemento un nivel.
• Los botones ⤵ / ⤴ hacen lo mismo sin arrastrar. El botón ⤵ se oculta cuando el anidamiento superaría los tres niveles.
• Una rama siempre se mueve entera. Arrastrar, anidar, desanidar o eliminar un padre se lleva consigo todo su subárbol.
• Un cuarto nivel no puede crearse: ni arrastrando, ni con botones, ni con peticiones fabricadas a mano. El servidor impone el mismo límite de forma independiente.

En el sitio público:

• Escritorio: los hijos aparecen en un desplegable. Los nietos se abren en un flyout lateral (con soporte de teclado y atributos ARIA). Cerca del borde derecho de la pantalla, el flyout se abre hacia la izquierda automáticamente.
• Móvil: la barra lateral muestra acordeones anidados: un toque en el padre despliega los hijos, un toque en un hijo con elementos despliega los nietos. Sin hover.

El tope de tres niveles forma parte del motor. Está diseñado para que futuros módulos oficiales, como una tienda con árboles de categorías profundos, puedan ampliarlo sin cambios en la lógica de menús.

Enlaces personalizados, anclas y archivos

La pestaña Enlaces añade elementos que no son páginas ni entradas:

• URL y etiquetas por idioma. Ejemplo: /docs#getting-started con la etiqueta Docs para inglés, /dokumentation#erste-schritte con la etiqueta Doku para alemán. En un idioma sin URL configurada, el elemento se oculta.
• Los enlaces de ancla siguen entendiendo de idiomas: el selector de idioma lleva /docs#getting-started a su equivalente alemán, en cualquier profundidad de anidamiento.
• Las URL de archivos (p. ej. /press-kit.pdf) funcionan como elementos de menú, también como nietos, y admiten target="_blank".
• Solo se aceptan URL https://, http://, mailto:, tel: y relativas con /. Las URL javascript:, data: y relativas al protocolo las rechazan el editor y, de forma independiente, el servidor.

Qué pasa cuando el contenido cambia

El editor de menús del panel sigue siendo funcional en todos estos estados: una cobertura de idiomas desigual entre elementos del menú es una configuración soportada y probada, no un error.