Desde nuestro editor Drag&Drop de Landing Optimizer podrás diseñar, añadir contenido y crear páginas de confirmación para tus landings de forma sencilla.
Partes principales
Barra superior
Desde la barra superior puedes realizar las siguientes acciones:
- Nombre Landing: dando clic al nombre de tu landing, podrás ir al panel principal, desde donde podrás ver las estadísticas, las distintas versiones, etc.
- Contenido: desde esta pestaña podrás editar el contenido de tu página
- Confirmación: desde aquí podrás editar la página de confirmación de tu landing. Esta es la página que verá el contacto una vez cumplimente la información (ver más sobre páginas de confirmación: https://mdtr.io/IcLDw)
- Más: Desde el icono de ‘+’, podrás añadir nuevos pasos o ventanas emergentes a tu landing page (ver más sobre landing multipasos: https://mdtr.io/14mTz)
- Herramienta: desde este ícono podrás:
- Navegar elementos: permite ir a cada elemento dando clic en el nombre del mismo
- Márgenes: al activar esta opción puedes ver los márgenes de los elementos
- Ver en producción: permite visualizar cómo luce tu landing una vez publicada. Esta opción estará disponible únicamente después de haber publicado tu página.
- Vista previa: ver cómo se verá tu landing y sus distintas versiones antes de publicarla
- Deshacer: revertir los últimos cambios
- Rehacer: restaurar cambios que se habían deshecho previamente
- Publicar: hacer visible la página para todos
- Guardar: guardar todos los cambios
Barra de herramientas principal
Este menú de la izquierda contiene los componentes clave para personalizar y gestionar tu página. Desde aquí podrás modificar el fondo, las fuentes predeterminadas, ajustar las propiedades SEO y mucho más.
- Elementos de la página: secciones, imágenes, botones, texto, formulario, video, área, html.
- Propiedades generales de la página: fondo y dimensiones.
- Editar código: opciones avanzadas de SEO, funcionalidades JavaScript y estilos CSS).
(Ver más sobre los elementos del editor de Landing: https://mdtr.io/Q7Ph1)
Selectores
El selector aparecerá siempre que hagas hagas clic sobre el elemento para editarlo.
Hay 2 tipos de selectores:
1- Selectores de las secciones
– Podrás editar cada sección pulsando en el icono ‘Configuración’ ,
– Duplicar la sección, pulsando en el icono «Duplicar»
– Para desplazar una sección hacia una posición inferior en la página utiliza el ícono de la ‘Flecha hacia abajo’
– Para desplazar una sección hacia una posición superior en la página utiliza el ícono de la ‘Flecha hacia arriba’
– Para borrar la sección desde el icono «Papelera» .
Puedes ver más sobre las secciones de una landing en el siguiente enlace: https://mdtr.io/GFD9i
2- Selectores de cada elemento
– Podrás editar las propiedades generales del elemento pulsando el icono ‘Configuración’
– Podrás editar cada elemento pulsando en el icono «Editar»
– Duplicar el elemento, pulsando en el icono «Duplicar»
– Borrar el elemento desde el icono «Borrar» .
Propiedades de los elementos
Cuando pulses en el icono «Configuración» podrás acceder a lo que llamamos «Propiedades de cada elemento».
Podrás cambiar las dimensiones de las secciones (geometría), el fondo, el borde, tipografía, etc. También, si tienes conocimientos en HTML, desde la pestaña Id/Clase podrás añadir estilos al elemento, que no te ofrece la biblioteca de la herramienta (como fuentes, efectos especiales, etc.). Si quieres aprender más sobre cómo añadir CSS y JS personalizados ve al siguiente enlace: https://mdtr.io/0arkr.
Guía vectorial
Al desplazar cada elemento, aparecerán líneas vectoriales que te permitirán afinar la colocación del elemento con respecto a los otros elementos y al bloque en el que se encuentra.
