Landing page
Última actualización
¿Te fue útil?
Para qué sirve: construir y publicar una landing page simple, usando bloques visuales o código (HTML/CSS).
Importante: antes de editar, tenga un HTML y un CSS listos (puede pedir a una IA que los genere).
Vaya a Marketing → Landing Page.
Haga clic en Añadir proyecto (plantilla en blanco) y déle un nombre.
Resultado: entra en el Editor del proyecto.
Parte superior (derecha):
Crear plantilla → guarda el diseño actual como una plantilla para reutilizar después.
Editor de Código → abre un modal con dos pestañas para pegar HTML y CSS.
Guardar y Publicar → publica la página (el enlace quedará disponible en la lista de proyectos).
Parte superior (centro): selector Desktop/Mobile (para comprobar la responsividad).
Izquierda: Páginas y Capas (árbol de los elementos para facilitar la selección).
Centro: Canvas (donde ves y montas la página).
Derecha: Styles y Properties (ajustes visuales y atributos del elemento seleccionado).
En el panel de Blocks (paleta), tienes los componentes:
Section (crea una sección); 1 Column / 2 Columns / 3 Columns (estructura de columnas)
Heading (título), Text (texto)
Image (imagen), Link / Link Box (enlaces), Video, Map
Cómo usar (ejemplo rápido):
Arrastre una Section al Canvas.
Dentro de ella, arrastre 2 Columns.
A la izquierda: Heading + Text. A la derecha: Image (suba la imagen).
Seleccione cada elemento y ajuste en Styles (tipografía, color, espaciado, fondo).
Haga clic en Editor de Código.
En la pestaña HTML, pegue el HTML de su landing.
En la pestaña CSS, pegue los estilos.
Haga clic en Guardar para aplicar en el Canvas.
Observación: si desea usar el formulario nativo de la plataforma después (para lead/tag/webhook), no inserte <form> en el HTML — construya la estructura visual y, cuando exista el bloque de formulario, úselo en el editor.
5) Publicar y obtener el enlace
Haga clic en Guardar y Publicar.
Vuelva a la lista de proyectos; el proyecto publicado muestra Enlace activo.
Copie el enlace para difusión.
HTML y CSS pegados (o bloques añadidos) y guardados
Ajustes visuales en Styles/Properties
Desktop/Mobile comprobado
Guardar y Publicar realizado
Enlace con Enlace activo copiado
(Opcional) Crear plantilla para reutilizar
Si no tiene código, pida a una IA: “Generar HTML (sin frameworks) y CSS mobile-first para una landing con hero (título, subtítulo, CTA), 3 beneficios en tarjetas y CTA final.” Después, pegue en el Editor de Código (HTML/CSS) y ajuste en Styles.
Última actualización
¿Te fue útil?
¿Te fue útil?