Personalizar los colores de tu tienda permite mantener una identidad visual coherente y mejorar la experiencia de navegación de tus clientes.
Desde el editor de diseño puedes modificar los colores principales y secundarios de la marca, el fondo, los textos y los botones. Los cambios se reflejan directamente en la vista previa antes de guardarlos.
¡Comencemos!
Una vez que entramos al panel, los pasos son los siguientes:
Paso 1: Ingresar a Mis Diseños
Dirígete a:
Panel > Personalizar > Mis Diseños
En esta sección encontrarás los diseños disponibles para tu tienda.
Paso 2: Editar el diseño de la tienda
Busca el diseño que estás utilizando actualmente, presiona el menú de acciones y selecciona:
Editar
Se abrirá el editor visual, donde podrás revisar la tienda y modificar sus distintos componentes.
Paso 3: Ingresar a Colores de la marca
En el menú lateral izquierdo, selecciona:
Colores de la marca
Al ingresar, se mostrarán las paletas recomendadas y los campos de color general de la tienda.
Paso 4: Utilizar una combinación recomendada
En la sección Utiliza nuestras recomendaciones, encontrarás diferentes combinaciones de colores predeterminadas.
Puedes seleccionar una de estas opciones para aplicar rápidamente una paleta completa y luego realizar ajustes individuales si lo necesitas.
Este paso es opcional. También puedes configurar todos los colores manualmente.
Paso 5: Personalizar los colores generales
Dentro de Colores Generales, selecciona cada campo para elegir el color correspondiente.
Color principal de tu marca
Define el color predominante de la identidad visual de la tienda. Puede utilizarse en diferentes elementos destacados del diseño.
Color secundario de tu marca
Complementa al color principal y se utiliza para generar contraste o destacar elementos secundarios.
Color de fondo
Define el color general del fondo de la tienda.
Se recomienda elegir un tono que facilite la lectura y no compita con las imágenes de los productos.
Color de los textos
Configura el color principal de los títulos y textos más relevantes.
Color de los textos secundarios
Define el color de los textos complementarios, aclaraciones y contenidos de menor jerarquía.
Color botones fondo
Permite seleccionar el color de fondo de los botones de la tienda.
Color botones texto
Define el color del texto que aparece dentro de los botones.
Recomendación
Verifica que exista suficiente contraste entre:
El fondo y los textos.
El fondo de los botones y su texto.
Los colores de la marca y las imágenes de los productos.
Esto ayudará a que el contenido sea fácil de leer y los botones puedan identificarse rápidamente.
Paso 6: Revisar los cambios en la vista previa
Los cambios se reflejan directamente en la vista previa de la tienda.
Antes de guardar, revisa especialmente:
El encabezado.
El menú de navegación.
Los textos principales y secundarios.
Los botones.
El fondo de las diferentes secciones.
Las fichas y listados de productos.
Esto permite comprobar cómo funciona la combinación de colores dentro de una tienda real y realizar ajustes antes de publicarla.
Paso 7: Seleccionar el estilo del encabezado
Para cambiar la estructura visual de la parte superior de la tienda, abre la sección:
Encabezado
Aquí podrás elegir entre los modelos de encabezado disponibles para el diseño.
Cada opción puede modificar la organización del logo, el buscador, el menú, el acceso de clientes y el carrito.
Importante
Esta sección permite cambiar el modelo del encabezado. Los colores generales continúan configurándose desde Colores de la marca.
Paso 8: Guardar los cambios
Una vez que estés conforme con el resultado, presiona Guardar en la parte superior del editor.
Luego visita la tienda para comprobar que los colores se visualicen correctamente en las distintas páginas y dispositivos.
Consideraciones importantes
Las paletas recomendadas permiten aplicar rápidamente una combinación de colores.
Puedes modificar individualmente cualquier color después de seleccionar una recomendación.
Los cambios se aplican al diseño que estás editando.
Revisa la legibilidad de los textos y botones antes de guardar.
Evita utilizar colores demasiado similares entre el texto y el fondo.
Los colores pueden visualizarse de forma diferente según la pantalla o el dispositivo.
El modelo del encabezado se selecciona desde la sección Encabezado, no desde los colores generales.
¡Listo! 🙌
Los colores de tu tienda ya quedaron personalizados para representar la identidad visual de tu marca. Una combinación clara y coherente ayudará a mejorar la navegación, destacar los elementos importantes y ofrecer una experiencia más profesional a tus clientes.
Como siempre esperamos que te haya sido de utilidad, si tenés más dudas te sugerimos ingresar a nuestro centro de ayuda o también puedes escribirnos a [email protected]