Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

Add option to use a single header HTML structure for both desktop and mobile

Abierto
  • ¿Algo no está bien?
#4,540 0 comentarios 0 reacciones 0 asignados Ver en GitHub

Los mantenedores suelen responder en 1 día

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
4/5
Tiempo estimado
3-5 días
Aptitud para principiantes
52/100
Tipo de issue
Nueva funcionalidad
Claridad
Bastante claro
Estado de actividad
Tranquilo
Stack tecnológico
php, wordpress
Área
accessibility, frontend, performance, web-dev

Línea de trabajo

Comienza siguiendo la configuración de Header Builder Customizer y los puntos de entrada del renderizado para desktop/mobile. Compara la capacidad existente de single-layout de Footer Builder para identificar la configuración y el comportamiento esperados. Se considera terminado cuando el nuevo toggle mantiene el renderizado separado de forma predeterminada, emite condicionalmente una única estructura de header y mantiene el funcionamiento del toggle móvil o del comportamiento de hamburger.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

customer report feature-request-triage

Impact: 75 · Confidence: 95 · Complexity: 75

Description

Problem

The Neve Header Builder currently outputs separate HTML nodes for the desktop and mobile header views, hiding the inactive view via CSS. This creates duplicated HTML elements (logos, navigation menus, buttons) which inflates the DOM size, affects page weight, and can create duplicate accessibility text/links for screen readers.

Desired Behavior

Provide a Customizer setting (e.g., "Use desktop header layout on mobile") that allows users to render only a single set of header HTML. When enabled, the theme should rely purely on responsive CSS to handle the transition to mobile layout, eliminating the secondary mobile-specific HTML wrapper entirely. This should mirror the capability currently available in the Neve Footer Builder.

Acceptance Criteria
  • Add a toggle in the Header Builder settings to apply the desktop layout/HTML to mobile devices.
  • When enabled, the builder conditionally skips rendering the mobile header wrapper and outputs only one unified header structure.
  • Ensure mobile toggle/hamburger behaviors continue to function seamlessly when inheriting the desktop header HTML.
  • Maintain current separate-node rendering as the default to ensure backwards compatibility for existing sites.

Customer Context

An intermediate-level pro user is requesting a way to prevent duplicate header DOM nodes to optimize page performance and SEO/accessibility metrics. They note the footer builder already allows using one layout across devices and they desire the same functionality for the header builder to reduce DOM complexity.

Root Cause Analysis

The root cause is an architectural decision in Neve's Header Builder to render specific DOM structures for distinct device views (Desktop vs. Mobile) to allow full flexibility in building completely different headers per device. While this enables high customizability, it forces users with simpler header designs to carry the performance penalty and accessibility confusion of duplicated DOM elements that are simply display-toggled via CSS. The gap is the lack of a capability to opt out of this device-split rendering in favor of a single, purely CSS-responsive DOM tree.

Reasoning

The customer has identified a legitimate optimization gap in the Neve Header Builder. Rendering separate HTML branches for desktop and mobile increases DOM size and can cause duplicate accessibility text or navigation links. The request to optionally mirror the desktop header HTML on mobile—relying on responsive CSS instead of duplicated nodes—is well-reasoned and aligns with performance best practices.

Source: HelpScout #3383993106
Generated by feature-request-triage workflow (ID: feature-request-triage_6a5349954b5fe5.70064094)

Lenguaje dominante
PHP
Estrellas
307
Forks
88
Merge medio
2 d 21 h
PR fusionados (30 d)
15

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de Codeinwp/neve

Todos los issues de Codeinwp/neve

Issues similares

Más issues de PHP

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.