Principal/WordPress Fullstack/Blueprints/Temas personalizados/Desarrollo de Mega-Menu adaptativo con Walker_Nav_Menu personalizado e iconos
Volver a tarjetas «Temas personalizados»Temas personalizados(ТЗ 22 из 54)
Especificación: Desarrollo de Mega-Menu adaptativo con Walker_Nav_Menu personalizado e iconosТрудозатраты~10 рабочих часов
Фриланс вилка~$450 – $750 (€400 – €700)
Оценка веб-студии~$950 – $1,600 (€900 – €1500)
ТЗ заказчика (исходный бриф):
Nuestra tienda cuenta con más de 30 categorías. El menú desplegable por defecto de WordPress es inmanejable. Necesitamos un mega-menú moderno en varias columnas con iconos, banners de promociones, accesibilidad total por teclado y un acordeón móvil fluido.
Ключевые требования:
- •Campos personalizados en el menú de administración: selector de icono SVG, texto de insignia ('NUEVO', 'TOP') y casilla de mega-menú
- •Clase PHP que extienda Walker_Nav_Menu con marcado semántico y atributos ARIA
- •Diseño en cuadrícula CSS Grid para paneles desplegables con espacio para banners destacados
- •Accesibilidad completa WCAG 2.1 AA: navegación con Tab y flechas, cierre con Escape y estados aria-expanded
- •Cajón de navegación móvil con botón de hamburguesa y acordeones para subcategorías
Ограничения проекта:
- •Sin plugins de mega-menú de terceros (Max Mega Menu, UberMenu) — código nativo ligero
- •Compatibilidad total con la interfaz nativa Apariencia > Menús de WordPress
- •Cero desplazamiento acumulado del diseño (CLS = 0) al abrir o cerrar paneles
Критерии приёмки (KPI):
- Aprobación del 100% en auditoría de accesibilidad WCAG 2.1 AA
- Paquete JavaScript del menú < 8KB gzipped
- Foco de teclado visible y contenido dentro del panel desplegable activo
Пошаговое практическое руководство по ТЗ
Подробный разбор архитектуры, код реализации и советы эксперта по каждому этапу: