Viste una tienda que te encantó y pensaste "yo quiero que la mía se vea así". Ahora puedes: le pasas una captura de pantalla al asistente de IA del editor y él te arma esa estructura en tu tienda. Y si prefieres hacerlo tú, arrastras bloques sobre un lienzo y ves el resultado en vivo, sin escribir una línea de código. Así funciona el tema Personalizada.

Qué es el tema Personalizada

El tema Personalizada convierte tu tienda en un lienzo editable. En lugar de conformarte con una plantilla fija que solo te deja cambiar el color, armas cada página combinando módulos que arrastras y sueltas: inicio, ficha de producto, categoría, "acerca de", preguntas frecuentes y páginas propias con su propia dirección web.

Todo ocurre en vivo. Mueves un bloque y lo ves moverse. Cambias un color y lo ves cambiar. No hay que guardar, salir y refrescar para descubrir cómo quedó.

La IA: de una idea o una captura a tu tienda

Es la parte que cambia el juego para quien no sabe diseñar, y funciona de dos maneras.

Desde una descripción

Le escribes lo que quieres en español normal y él lo construye. Por ejemplo:

"Página de inicio para una cafetería, con un héroe cálido, tres beneficios y una sección de productos destacados."

Y obtienes esa página armada, con sus bloques ya organizados y listos para ajustar.

Desde una captura de pantalla

Aquí está lo interesante: le pasas la imagen de un diseño que te gusta y la IA reproduce esa estructura con tus bloques y tu contenido. Es la forma más rápida que existe de pasar de "quiero algo así" a tenerlo publicado.

Tres modos de trabajo

Cómo aplicar lo que genera la IA
Modo Qué hace Cuándo usarlo
Reemplazar todo Sustituye el diseño actual Empezar de cero o rediseñar completo
Agregar al final Añade lo nuevo debajo de lo existente Sumar una sección sin tocar el resto
Editar lo existente Ajusta conservando tu diseño Mejorar sin perder lo que ya hiciste

Además, el asistente:

  • Genera el CSS que los controles visuales no cubren: animaciones y detalles finos.
  • Genera imágenes reales para fondos, encabezados y llamados a la acción, en lugar de dejar marcadores grises. Hay un tope configurable para cuidar los tiempos.

Una advertencia importante: usa las imágenes generadas para fondos, banners y elementos decorativos, nunca para representar tus productos. Si la imagen no corresponde a lo que el cliente va a recibir, es publicidad engañosa. Para los productos, fotos reales siempre — y con el celular basta, como explicamos en esta guía.

Cómo es el editor por dentro

El editor ocupa toda la pantalla y se divide en tres zonas:

  • Izquierda: la paleta de componentes y las herramientas. De aquí sacas los bloques.
  • Centro: el lienzo, donde ves tu tienda tal como quedará.
  • Derecha: los ajustes del bloque que tengas seleccionado.

Y lo que más agiliza el trabajo diario:

  • Arrastrar y soltar para añadir y reordenar.
  • Migas de pan para saltar a los bloques que contienen a otros, cuando trabajas con estructuras anidadas.
  • Vista escritorio, tablet y móvil dentro del mismo editor, con menú hamburguesa automático en pantallas pequeñas.
  • Gestor de medios: una biblioteca con todas las imágenes de tu tienda para elegir, subir, recortar y borrar sin salir.
  • Plantillas y secciones reutilizables: plantillas de página completas, secciones prediseñadas, guardar las tuyas y copiar de otra página.

Diseña siempre revisando la vista móvil. La mayor parte de tus visitas llega desde un teléfono, y un diseño impecable en pantalla grande puede romperse en una pequeña. El editor te deja alternar entre las tres vistas: úsalo antes de publicar, no después.

Los bloques que puedes usar

Hay alrededor de veinte módulos, agrupados en tres familias:

Módulos disponibles
Familia Módulos
Estructura Secciones, columnas, espaciadores
Contenido Títulos, texto, imagen, botón, video, galería con lightbox, caja con ícono, acordeón, testimonios, mapa, cuenta regresiva, redes sociales
Tienda Barra de navegación, cuadrículas y carruseles de productos, producto destacado, tarjetas de categoría, carrusel de banners, buscador, newsletter y pie de página

Sobre el diseño de cada bloque, puedes controlar:

  • Fondos de color, con transparencia, degradados o imagen
  • Bordes, redondeos y sombras
  • Márgenes y relleno por lado
  • Tipografías y colores por tipo de texto
  • Íconos, con buscador para encontrarlos

Y las tarjetas de producto son personalizables: colores, bordes y qué mostrar en cada una — imagen, nombre, precio, botón, calificación—. Eso importa más de lo que parece: la tarjeta es lo que ve el cliente antes de decidir si entra a la ficha.

Borrador, vista previa y publicar: edita sin miedo

El miedo más común es "y si daño algo". El flujo está pensado para que eso no pase:

  1. Trabajas en borrador. Tus cambios no afectan la tienda que están viendo tus clientes.
  2. Vista previa sin guardar, en una pestaña nueva, para ver el resultado real.
  3. Publicas cuando estés conforme.
  4. Si intentas salir con cambios sin guardar, el editor te avisa.

Un detalle práctico: desde el mismo editor puedes cambiar banners, redes sociales, logo y colores de marca, y esos cambios se replican a los ajustes generales de la tienda. No tienes que ir a otra pantalla a repetirlo.

Para quien quiere afinar: CSS y HTML

Si sabes de código —o tienes quien te ayude— el editor no te limita: puedes añadir CSS y HTML a la medida por bloque y por página, con editores con resaltado de sintaxis, más un editor visual para el texto enriquecido.

Es el equilibrio que suele faltar: plantillas listas para quien no quiere complicarse, y control fino para quien lo necesita.

5 secciones que toda tienda debería tener

Si no sabes por dónde empezar, arma tu página de inicio con esto, en este orden:

  1. Encabezado claro. Qué vendes y para quién, en una frase. No un eslogan abstracto: palabras que tu cliente usaría.
  2. Productos destacados. Los que más vendes, arriba. Usa la cuadrícula o el carrusel.
  3. Tres beneficios. Envíos, formas de pago, garantía. Las cajas con ícono sirven exactamente para esto.
  4. Prueba social. El bloque de testimonios con reseñas reales de tus clientes.
  5. Pie de página completo. Contacto, preguntas frecuentes, términos y políticas. Los clientes desconfiados lo buscan ahí antes de pagar.

La cuenta regresiva y el carrusel de banners son excelentes para promociones con fecha límite. Cómo diseñarlas sin regalar margen, en esta guía de cupones.

Errores de diseño que cuestan ventas

  1. Texto claro sobre fondo claro. Se ve elegante en tu pantalla y es ilegible al sol.
  2. Encabezado gigante que empuja los productos fuera de la primera pantalla.
  3. Más de dos tipografías.
  4. El botón de comprar sin contraste. Debe resaltar, no combinar.
  5. Mover el carrito de sitio. Va arriba a la derecha porque la gente ya lo busca ahí.
  6. Imágenes pesadas. Cada una hace tu tienda más lenta, y la velocidad afecta la conversión y tu posición en Google.
  7. Diseñar solo en computador cuando la mayoría compra en celular.

La prueba definitiva: pídele a alguien que no conozca tu negocio que compre algo desde su propio celular mientras lo miras, sin ayudarlo. Donde dude, ahí tienes un problema de diseño.

Preguntas frecuentes

¿Necesito saber diseño o programación?

No. Puedes partir de una plantilla, pedirle a la IA que la genere desde una descripción o una captura, y ajustar arrastrando bloques. El CSS a la medida está disponible para quien lo quiera, pero es opcional.

¿Puedo copiar el diseño de otra tienda?

La IA puede reproducir una estructura a partir de una captura: dónde va el encabezado, cuántas columnas, en qué orden las secciones. Usa esas referencias como inspiración de organización, con tus propias imágenes, textos y marca.

¿Los cambios se ven de inmediato en mi tienda?

No hasta que publiques. Trabajas en borrador, revisas con la vista previa y publicas cuando estés conforme.

¿Puedo crear páginas nuevas además de las que ya existen?

Sí. Puedes crear páginas propias con su propia dirección web, además de inicio, producto, categoría, acerca de y preguntas frecuentes.

¿Cambiar el diseño afecta mis productos o mis pedidos?

No. El tema es la capa visual: productos, inventario, pedidos y clientes no se ven afectados.

¿Cambiar el diseño afecta mi posicionamiento en Google?

Mientras no cambien las direcciones de tus páginas, no. Lo que sí influye es la velocidad de carga: un diseño liviano ayuda, uno cargado de imágenes pesadas perjudica.

¿Puedo reutilizar una sección que ya diseñé?

Sí. Puedes guardar tus propias secciones, usar secciones prediseñadas y copiar bloques de otra página.

Sigue leyendo: Cómo fotografiar tus productos · Convertir visitantes en compradores