- El Graphic editor no funciona en modo incógnito.
- Cuando las cookies entre sitios están bloqueadas, el Graphic editor no funcionará.
- Mozilla bloquea las cookies por defecto. Si utiliza Mozilla, debe habilitar las cookies manualmente.
Beneficios para el usuario
- Mejor rendimiento y compatibilidad.
- Interfaz de usuario intuitiva para una mejor experiencia y facilidad de uso.
- Capacidad para realizar ediciones por lotes en varias páginas.
- Opciones avanzadas de personalización.
- Integración fluida con el Widget Studio de Kameleoon.
- Funciones impulsadas por IA para la generación de contenido, el manejo de selectores CSS y variaciones de diseño.
Abrir el Graphic editor
El modo de edición de Kameleoon ofrece las herramientas para crear variaciones de páginas web y lanzar experimentos A/B.A través de su sitio web
Para iniciar Kameleoon:- Vaya a una página web en la que tenga instalado el script de Kameleoon.
- Pulse shift + F2 en Windows o fn + shift + F2 en Mac.
Si no ocurre nada, añada
#kameleooon=true al final de su código.- Una vez que Kameleoon se cargue, se abrirá una ventana emergente. Rellene su nombre de usuario y contraseña para acceder al editor.
- Se abre una ventana emergente que le pide seleccionar un experimento (si ya ha creado uno) o crear uno nuevo. Haga clic en Create para crear un experimento.
- Rellene la información de su experimento y seleccione Classic A/B en Experiment type.
- Haga clic en Start.
A través de la aplicación Kameleoon
También puede iniciar el editor desde la aplicación Kameleoon.- Inicie sesión en su aplicación Kameleoon.
- Haga clic en New experiment > With the graphic editor.
- Rellene la información de su experimento y seleccione Graphic A/B en Experiment type.
- Haga clic en Create.
Estructura
Panel de experimentos (lado izquierdo)
Función: gestiona el experimento actual, incluidas las variaciones y los elementos de la página. Características:- Añadir variaciones y elementos.
- Editar selectores CSS.
- Ver y gestionar elementos presentes en distintas páginas.
Área principal de edición (centro)
Función: permite interactuar directamente con los elementos de la página web para editarlos. Características:- Seleccionar y modificar texto, imágenes y otros contenidos.
- Acceder a atajos de edición.
Panel derecho (lado derecho)
Pestañas: Design, State, History Características:- Personalizar contenido, texto, fondo, borde, sombra, padding, margin y más.
- Gestionar estados de los elementos (por ejemplo, default, hovered, active, focus, disabled).
- Gestionar el historial de cambios de cada elemento.
Barra de herramientas superior
Función: ofrece herramientas para visualizar y finalizar los cambios. Características:- Cambio de modo de dispositivo.
- Simular cambios.
- Finalizar el experimento.
Personalizar la visualización del Graphic editor
- Zoom: ajuste el nivel de zoom para adaptarlo a su pantalla y preferencias.
- Reduce Left Panel: minimice el panel izquierdo para aumentar el espacio de trabajo.
- Hide Left Panel: oculte completamente el panel izquierdo para una vista sin distracciones.
- Modo pantalla completa: amplíe el editor a pantalla completa para una experiencia de edición inmersiva.
Simulación y finalización
- Simulación: haga clic en SIMULATE para previsualizar cómo se verán y funcionarán los cambios en su sitio web.
- Finalización: haga clic en FINALIZE para acceder a los pasos de finalización.
Cambio de dispositivo
Utilice la barra de herramientas superior para alternar entre distintas vistas de dispositivo (escritorio, tableta, móvil) para asegurarse de que el diseño es adaptable y se muestra correctamente en todos los dispositivos.Extensión Kameleoon Graphic editor
Mejore el uso del Graphic Editor con la extensión Kameleoon Graphic Editor.Cuándo utilizar la extensión del Graphic editor
- Algunos sitios web restringen el uso de un iframe. Para hacer frente a las restricciones de iframe, utilice la extensión Graphic Editor para anular estas limitaciones e iniciar el Graphic Editor.
- Ciertos sitios web presentan una versión móvil cuando detectan un user agent móvil. Para garantizar que el Graphic Editor muestre correctamente la versión móvil, el navegador debe identificarse como un dispositivo móvil. La extensión facilita el proceso de identificación móvil.