Ir al contenido
Instalar la app
Español

Ajustar los colores del menú

Define los colores de la barra del menú, los submenús, las pestañas, las etiquetas de producto y el botón de agregar al carrito.

Guía práctica Todos los planes 3 min de lectura

Los colores de la pestaña Colores se aplican a todos los elementos del menú, así que puedes adaptarlo a tu marca en un solo lugar.

Cambiar un color

  1. Abre la pestaña Colores

    En el editor de menús, haz clic en el icono del bote de pintura en la barra lateral izquierda (1).

    Abre la pestaña Colores (1) y haz clic en un campo de color (2).
  2. Elige un color

    Haz clic en el campo junto a un color (2). Elige un color o escribe un código hexadecimal como #FFFFFF.

  3. Revisa la vista previa

    Pasa el cursor sobre los elementos de la vista previa para comprobar los colores al pasar el cursor.

  4. Guarda y publica

    Haz clic en Guardar y luego en Publicar.

Ajustes de color

Menú principal

Color de fondo
El fondo de la barra del menú.
Hover background color
El fondo de un elemento de nivel superior al pasar el cursor o mientras su submenú está abierto.
Separator color
Líneas divisorias entre elementos, que se muestran cuando Mostrar separador en escritorio o Mostrar separador en móvil están activados en Ajustes del menú.
Color del texto
Texto e iconos de los elementos de nivel superior.
Hover text color
Texto e iconos de los elementos de nivel superior al pasar el cursor.

Submenú

Menús desplegables, mega menús y su contenido.

Color de fondo
El fondo del submenú.
Border color
El borde del submenú, que se muestra cuando Mostrar borde está activado en Ajustes del menú.
Heading color
Encabezados dentro de los submenús, como los títulos de las listas de enlaces.
Color del texto
Enlaces y texto dentro de los submenús.
Hover text color
Enlaces del submenú al pasar el cursor.
Description color
Texto de descripción bajo los elementos.
Hover description color
Texto de descripción al pasar el cursor.

Tab menu

Heading color
Nombres de las pestañas.
Active heading color
El nombre de la pestaña seleccionada.
Active background color
El fondo de la pestaña seleccionada.

Etiqueta

Etiquetas de los productos que se muestran en el menú.

Sale text color · Sale background color
La etiqueta de oferta en los productos con descuento.
Sold out text color · Sold out background color
La etiqueta de agotado.

Botón Agregar al carrito

Se muestra cuando Mostrar botón Agregar al carrito está activado en Ajustes del menú > Avanzado.

Color del texto · Hover text color
Texto del botón, en estado normal y al pasar el cursor.
Color de fondo · Hover background color
Fondo del botón, en estado normal y al pasar el cursor.

Solución de problemas

Los elementos son difíciles de leer o desaparecen al pasar el cursor

Asegúrate de que Color del texto contraste con Color de fondo, y Hover text color con Hover background color. Un texto blanco sobre un fondo blanco al pasar el cursor hace que los elementos desaparezcan.

Quiero un elemento de otro color

Usa los ajustes de Color del propio elemento (plan Pro Navigation), por ejemplo para un elemento “Rebajas” en rojo. Consulta Editar un elemento de menú.

¿Te ha sido útil?

Informar de un problema