Nuevo módulo «ENLACE» ¿como se puede cambiar el color del enlace activo?

  • Nuevo módulo «ENLACE» ¿como se puede cambiar el color del enlace activo?

    Discusión creada por Pila Vicente Toral el 22 de febrero de 2026 en 12:23 PM

    Estoy haciendo un menú global con DIVI 5 utilizando el módulo «ENLACE» , no consigo cambiar el color del enlace cuando está en la página activa ¿me podéis ayudar?

    Jefferson Maldonado ha respondido hace 1 mes 3 Miembros · 4 Respuestas
  • 4 Respuestas
  • Juan Peron

    Miembro
    24 de febrero de 2026 en 8:43 AM

    ¿Probaste con CSS?
    Que el profe lo revise, pero debería funcionar. En los links hay varios atributos a tener en cuenta. Quedo atento para ver cómo mejorarlo.
    Donde dice color # ahí poné el código del color que quieras.

    En el módulo ENLACE → Avanzado → CSS ID y Clases → Clase CSS, poné por ejemplo:
    link-menu-global

    Después agregá el CSS en alguno de estos lugares:

    Divi → Opciones del tema → CSS personalizado
    o
    Theme Builder → tu Header → Advanced → Custom CSS
    o
    Apariencia → Personalizar → CSS adicional

    El estilo apunta al enlace activo usando el atributo aria-current (que usa WordPress moderno y Divi 5) y también contempla las clases clásicas current-menu-item y current_page_item como respaldo.

    En ambos casos, se define el color activo con el código que vos elijas y se fuerza con prioridad para que sobrescriba otros estilos.

  • Jefferson Maldonado

    organizador
    24 de febrero de 2026 en 10:05 AM

    Hola, Vicente.👋

    Sí se puede hacer, y en Divi 5 es bastante sencillo si lo hacemos de forma ordenada, complementando los pasos que te ha indicado Juan, te dejo los pasos claros y rápidos.

    Primero: añade una clase al módulo

    1. Ve al módulo ENLACE que estás usando en el menú.

    2. Entra en Avanzado → CSS ID y Clases.

    3. En Clase CSS escribe por ejemplo:

    link-menu-global

    Guarda el módulo.

    Segundo: añade el CSS para el enlace activo
    Ahora agrega este CSS en alguno de estos lugares:

    • Divi → Opciones del tema → CSS personalizado

    • O Apariencia → Personalizar → CSS adicional

    • O en el Header global del Theme Builder → Avanzado → Custom CSS

    Pega esto:

    .link-menu-global a[aria-current="page"],
    .link-menu-global a.current-menu-item,
    .link-menu-global a.current_page_item {
    color: #e63946 !important; /* Cambia este color */
    }

    Solo cambia #e63946 por el color que tú quieras.

    Por qué funciona
    Divi 5 y WordPress marcan el enlace activo usando el atributo aria-current=»page» y también clases como current-menu-item.

    Con ese CSS estamos apuntando exactamente al enlace activo y forzando el color para que sobrescriba el estilo por defecto.

    Si no cambia el color, revisa:

    • Que la clase esté bien escrita

    • Que el CSS esté pegado en el sitio correcto

    • Que no haya caché activa

    Con eso debería funcionar sin problema 👍

  • Pila Vicente Toral

    Miembro
    27 de febrero de 2026 en 3:59 AM

    Gracias por vuestra ayuda.

    He hecho lo que me me habéis dicho, pero no funciona. Es una página en construcción y no os puedo pasar el link todavía.

    Os adjunto 2 fotos de la creación del atributo y el css, por si veis algo raro, lo he aplicado al «módulo enlace»

    • Jefferson Maldonado

      organizador
      5 de marzo de 2026 en 10:41 AM

      En este caso Vicente, abría que esperar entonces a que Elegant Themes publique una actualización o tutorial sobre esto, porque ya vi que varias personas lo están pidiendo, seguramente lo mejoran dentro de Divi directamente.

      Cuando tengamos una actualizacion te avisamos.

Inicia sesión para responder.