Diseño — Plantilla, estilo visual, cabecera y logo

Pantalla Diseño con la elección de plantilla (las de catálogo activan la tienda automáticamente), el estilo visual del sitio, el alto de la cabecera, la forma del logo y el estilo de las tarjetas del catálogo.

La pantalla Diseño controla la apariencia general de toda tu home: qué plantilla usas, el estilo visual del sitio, cuán alto se ve la cabecera, la forma del logo (cuadrado, rectangular, adaptativo), la disposición del logo y menú en la cabecera, y el estilo de las tarjetas del catálogo. Son ajustes que afectan al sitio entero, no a una sección puntual.

A diferencia de Marca que define tu identidad (logo y colores), Diseño define la estructura visual. La regla es: si el cambio afecta a todas las páginas (cabecera, pie, disposición general), va en Diseño. Si afecta solo a la portada, va en Portada. Si es contenido específico de una sección (textos, fotos del bloque), va en cada pantalla.

El estilo visual aplica a todo el sitio (portada, catálogo y secciones). Tiene dos opciones: Tienda online con botones (e-commerce estándar con botones de compra prominentes) y Galería elegante (estilo revista) (minimalista, con la imagen protagonista, tipo lookbook). En una plantilla con ajustes avanzados y plan Pro, puedes sobreescribir detalles de la portada campo por campo desde Portada.

El alto de la cabecera se elige entre 4 opciones (Estándar, Medio +50%, Alto +100%, Extra alto +150%). Afecta a todas las páginas. Ojo: la cabecera alta es más visible al cargar pero deja menos espacio para el contenido en el primer scroll — piénsalo según tu rubro (un restaurante quiere mostrar comida arriba; un consultor profesional puede usar cabecera alta con buen logo).

Manual completo

Cambiar de plantilla

La card «Plantilla» muestra las plantillas disponibles como tarjetas que eliges con un click. Cada tarjeta trae su nombre y una frase de para qué sirve; la seleccionada queda marcada con un check. Las plantillas que muestran el catálogo en la portada llevan el badge «🛒 Incluye catálogo».

Plantilla Para qué tipo de negocio
arte-diseno Tienda de ropa, accesorios, productos curados — catálogo destacado en la home
negocio-local Panadería, cafetería, restaurante con productos visibles
tienda-moderna Tienda online genérica con catálogo grande y simple
norte-studio Estudio creativo (fotografía, diseño, video) — visual minimalista
valentina-salon Salón de belleza, peluquería, spa — foto de portada + equipo
taller-rpm Taller mecánico, lavadero — servicios + proceso técnico
casa-lista Oficios del hogar (gasfitería, electricidad, pintura)
landing-conversion Servicios profesionales (consultor, contador, abogado)
instituto-amauta Educación, capacitaciones, cursos
reserva-salud Clínicas, consultorios, dentistas
ruta-sur Turismo, tours, eventos
mypes-clasica Plantilla clásica y versátil (también la de los sitios migrados del sistema anterior)

Cambiar de plantilla NO borra tus textos. Cada plantilla lee los mismos datos (Marca, Sobre mí, Servicios, etc.) y los presenta a su manera. Lo que sí puede cambiar:

  • Las pantallas disponibles en el panel (algunas plantillas no usan «Aviso destacado» o «Por qué elegirnos»).
  • Si el catálogo se activa o no — las plantillas con catálogo (arte-diseno, negocio-local, norte-studio, tienda-moderna) muestran los productos en la portada, así que al elegir una de ellas MYPES activa tu tienda online automáticamente y te avisa: «Plantilla actualizada. Activamos tu catálogo porque esta plantilla lo muestra en la portada. Tu contenido se conservó.» El catálogo nunca se apaga solo si luego cambias a otra plantilla (no se cierra un canal de venta).

Estilo visual

La card «Estilo visual» define el estilo general del sitio. Afecta la portada, el catálogo y todas las secciones. Dos opciones:

  • Tienda online con botones: e-commerce moderno, con botones de compra prominentes. Pensado para conversión rápida — el cliente ve los botones al toque.
  • Galería elegante (estilo revista): minimalista tipo lookbook, con la imagen protagonista y textos grandes. Pensado para portafolios, productos premium y negocios donde la foto manda.

Si tu plantilla tiene ajustes avanzados de la portada (hoy arte-diseno) y tienes plan Pro, puedes sobreescribir detalles de la portada campo por campo (alineación, estilo de los botones, capa sobre la imagen, tamaño del título, estilo del carrusel) desde Portada.

Cabecera del sitio

La cabecera aparece arriba en todas las páginas (portada, catálogo, producto, contacto). En la card «Cabecera del sitio» ajustas:

Alto de la cabecera

Opción Cuándo usarla
Estándar Default. Funciona para la mayoría de negocios.
Medio (+50%) Cuando tu logo es ancho o quieres más respiración. El logo se agranda proporcionalmente si su tamaño lo permite.
Alto (+100%) Negocios premium donde la cabecera se vuelve parte de la identidad.
Extra alto (+150%) Casos especiales — cabecera como portada alternativa. Ojo: roba espacio al contenido.

Forma del logo

Cómo se ve el logo en la cabecera.

Opción Para qué tipo de logo
Cuadrado (1:1) Default. Logos cuadrados o circulares (la mayoría).
Rectangular ancho (2:1) Logos horizontales tipo banner (negocio + texto al lado, ej. «Polería Don José»).
Adaptativo Solo alto fijo, el ancho fluye con la imagen. Ideal para logos con texto al lado o elementos asimétricos, para que no se vean pequeños en un cuadrado.

Disposición del logo y menú (solo Pro)

Cómo se acomodan el logo, el menú y el carrito en la cabecera:

  • Usar el del estilo visual (default): aplica lo que decidió el estilo visual que elegiste.
  • 3 columnas (logo · menú · carrito): logo a la izquierda, menú al medio, carrito/redes a la derecha.
  • Centrado (logo arriba, menú debajo): todo apilado en el medio.

Requiere plan Pro. Si tu plan es gratuito, este selector está deshabilitado y manda el estilo visual.

Estilo de las tarjetas del catálogo

Solo en las plantillas con catálogo. Cómo se ven las tarjetas de producto en la portada:

  • Limpio (recomendado): la foto tal cual con el nombre y precio debajo.
  • Con difuminado: el texto va sobre la imagen oscurecida.

Buenas prácticas

  • No cambies de plantilla constantemente. Cada cambio reordena cómo se ven las secciones. Elige una y refínala. Si vas a cambiar, hazlo con tiempo para revisar todo.
  • Prueba el estilo «Galería elegante» si vendes productos premium / hechos a mano. La foto grande con texto sobre ella eleva lo percibido.
  • Cabecera alta solo si tu logo es muy reconocible. Cabecera alta con logo genérico se siente pesada.
  • Forma «Adaptativo» del logo si tu logo es asimétrico o tiene texto al lado. El fondo del «Cuadrado» puede arruinar logos modernos.

Cómo se ve en mobile

Todos los ajustes de Diseño son responsive. En mobile:

  • La cabecera se compacta automáticamente (logo izq + menú hamburguesa der).
  • El alto de la cabecera se reduce a una versión compacta.
  • La disposición (3 columnas vs centrado) no aplica en mobile — usa siempre un layout compacto.
  • La forma del logo se respeta.

FAQ

¿Puedo previsualizar la plantilla antes de cambiarla? Sí, con el Editor con vista previa (ver Editor) ves tu home en vivo mientras editas. También puedes abrir tu sitio público en una nueva pestaña. Si cambias plantilla y no te gusta, la cambias de regreso (sin perder textos).

¿El estilo visual está en todas las plantillas? Sí. El selector «Estilo visual» (Tienda online con botones / Galería elegante) aplica a cualquier plantilla y afecta la portada, el catálogo y las secciones.

¿El plan Pro me da plantillas exclusivas? No. Todas las plantillas están disponibles en todos los planes. Pro desbloquea ajustes avanzados de la portada, la disposición del logo y menú, y otros caps (más productos, carrusel avanzado, etc.), pero no plantillas premium.

¿Si elijo una plantilla con catálogo y no tengo catálogo, qué pasa? MYPES activa tu tienda online automáticamente al aplicar la plantilla (porque esa plantilla muestra los productos en la portada) y te lo avisa. Tu contenido se conserva. Si aún no cargaste productos, agrégalos desde el bucket Catálogo. El catálogo no se vuelve a apagar solo si luego cambias de plantilla.

¿Puedo modificar el código HTML/CSS de mi plantilla? No. Las plantillas son rígidas por diseño. Si necesitas algo muy específico (ej. integrar un widget de terceros), escríbenos por WhatsApp y vemos.