Crear un proyecto

Kameleoon ejecuta campañas y marcas de características por proyecto, por lo que crea un proyecto para cada sitio web, aplicación web o aplicación móvil antes de poder instalar Kameleoon en él. El flujo del nuevo proyecto pregunta para qué desea usar el proyecto, recopila su información principal y luego lo guía a través de la instalación.

​

Agregar un nuevo proyecto

Puede configurar tantos proyectos en su cuenta como su plan permita. Un proyecto puede ser un sitio web, una aplicación móvil o cualquier entorno (por ejemplo, staging o production) que utilice internamente. Para agregar un nuevo proyecto:

1. Inicie sesión en su cuenta de Kameleoon.
2. Haga clic en Admin > Projects.
3. Haga clic en New project.
4. En What do you want to use this project for?, seleccione un tipo de proyecto. Después de crear el proyecto, no puede cambiar su tipo.
   • Web Experimentation: Ejecute campañas web en su sitio web usando Prompt-Based Experimentation (PBX) o un editor de código. Usted elige cómo instalar Kameleoon en su sitio web en un paso posterior.
   • Feature Experimentation: Experimente e implemente características usando SDKs de frontend, backend o móvil. Instala Kameleoon con los SDKs de Kameleoon.
   • All campaign types: Cree y administre todos los tipos de campañas desde un solo proyecto. Instala Kameleoon en su sitio web y con SDKs para Feature Experimentation.

5. Si seleccionó Feature Experimentation, en What platform is this project for?, seleccione Web / Backend o Mobile app:
   • Web / Backend: Experimente en sitios web y características impulsadas por backend.
   • Mobile app: Experimente con experiencias de aplicaciones móviles nativas.

6. Haga clic en Next.
7. Ingrese la información principal del proyecto:
   • Main project domain: El dominio principal asociado con el proyecto. Kameleoon puede ejecutar experimentos y personalizaciones en múltiples dominios y subdominios, por lo que el dominio principal es donde Kameleoon configura su fragmento de JavaScript de manera predeterminada. Un proyecto con la plataforma Mobile app no tiene un campo Main project domain.
   • Color: Seleccione un color para el proyecto.
   • Project name (opcional): Un nombre claro y reconocible que facilite encontrar el proyecto en paneles y listas. Kameleoon muestra el nombre en toda la plataforma en lugar de la URL del proyecto. Si lo deja en blanco, Kameleoon muestra la URL del proyecto. Un proyecto con la plataforma Mobile app requiere un nombre de proyecto.
   • Description (opcional): Detalles que ayuden a su equipo a entender el uso previsto del proyecto.
   • Tags: Haga clic en Add tag para agregar una etiqueta.

8. Haga clic en Next y complete los pasos restantes. Consulte Pasos de configuración del proyecto.

Puede editar la información principal en cualquier momento en la pestaña Overview.

​

Pasos de configuración del proyecto

Un formulario paso a paso lo guía a través de la instalación de Kameleoon en un proyecto nuevo. En un proyecto existente, los mismos pasos se abren cuando hace clic en Edit en la sección Installation method o Technical configuration de la pestaña Setup de un proyecto existente, sin el paso Main information. Los pasos que ve dependen del tipo de proyecto y el método de instalación que elija.

​

Pasos por tipo de proyecto

Dos opciones de instalación cambian los pasos aún más. Si selecciona Shopify como método de instalación, Kameleoon omite el paso Technical configuration. Si selecciona Tag Manager, las opciones de Loading mode y las opciones de sitio web dinámico no aparecen. En el paso Main information, haga clic en Next para continuar, o haga clic en Cancel para salir sin guardar. En los pasos Installation method y Technical configuration, haga clic en Back para volver al paso anterior, Next para continuar, o Save for later para guardar su progreso. En el paso Checklist, haga clic en Back, o haga clic en Complete setup cuando termine sus tareas. Cuando abre los pasos desde la pestaña Setup de un proyecto existente, el último botón es Save changes en lugar de Complete setup. Cuando hace clic en Save for later, Kameleoon guarda el proyecto como borrador. El proyecto aparece en la página Projects con el estado Draft. Cuando hace clic en Complete setup, Kameleoon guarda el proyecto y establece su estado en Enabled. Para terminar un borrador, haga clic en Edit en la fila del proyecto, luego complete su información requerida en el flujo de creación del proyecto.

​

Método de instalación

El paso Installation method define cómo se ejecuta Kameleoon en su sitio web. Se aplica a proyectos de Web Experimentation y All campaign types. En Installation method, seleccione una de las siguientes opciones:

• Code snippet pasted on your site (recomendado): Instale Kameleoon agregando el fragmento HTML/JavaScript a sus páginas, incluyendo sitios web construidos con frameworks del lado del servidor.
• Tag Manager (GTM, Tealium iQ, Adobe DTM, …): Implemente Kameleoon a través de su sistema de gestión de etiquetas sin editar el código de la página.
• Shopify: Instale Kameleoon a través de su tema o configuración de la aplicación de Shopify.

Kameleoon es compatible con todos los principales sistemas de gestión de etiquetas. Sin embargo, Kameleoon recomienda encarecidamente que no instale Kameleoon usando un gestor de etiquetas, porque hacerlo aumenta la probabilidad de parpadeo en sus campañas. Para más información, consulte flicker management and performance. Cuando selecciona Code snippet pasted on your site, el paso también muestra Loading mode, que define cómo se carga Kameleoon en su sitio web:

• Asynchronous with anti-flickering (recomendado): Carga Kameleoon de forma asincrónica para preservar la velocidad de la página, mientras que una regla CSS temporal minimiza el parpadeo visible.
• Asynchronous: Carga Kameleoon de forma asincrónica sin bloquear la página, pero el parpadeo visible puede ocurrir si la página se renderiza antes de que se ejecute el script.
• Synchronous: Carga Kameleoon de forma sincrónica para prevenir el parpadeo, pero bloquea la página hasta que se completa la ejecución. Kameleoon generalmente no recomienda este modo.

Para más detalles sobre cada modo de carga, consulte Standard implementation.

​

Configuración técnica

El paso Technical configuration define cómo su sitio, dominios e hosting funcionan con Kameleoon. Se aplica a proyectos de Web Experimentation y All campaign types, excepto cuando selecciona Shopify como método de instalación. Con el método de instalación Tag Manager, el paso comienza directamente con Resource hosting.

​

Soporte de sitio web dinámico

Con el método de instalación Code snippet pasted on your site, el paso comienza con la pregunta Is your website a dynamic website (SPA or PWA)?. Una aplicación de una sola página (SPA) o Progressive Web App (PWA) carga contenido dinámicamente sin recargar la página. Activar el soporte de sitio web dinámico asegura que Kameleoon detecte cambios de URL y ejecute scripts correctamente para pruebas A/B, personalización y seguimiento.

• Enable support for dynamic websites: Active este conmutador si su sitio web es una aplicación web con URLs virtuales.
• Enable dynamic website support for: Seleccione el alcance. Debe seleccionar un alcance cuando el conmutador está activado. Las opciones son Entire website y Chosen elements in the visual editor.
• Set a custom attribute (opcional): Si su sitio web no genera ID únicos para cada elemento HTML, o genera ID dinámicos, ingrese un nombre de atributo (por ejemplo, custom-id) que Kameleoon use para identificar de forma única los elementos modificados.
• Avoid dynamic IDs selectors (opcional): De manera predeterminada, Kameleoon evita ID de HTML que contengan números con más de 5 dígitos. Ingrese su propia expresión regular para excluir otros ID.

El conmutador My site uses a server-side framework (Next.js, Nuxt, SvelteKit, etc.) está en su propia tarjeta debajo de las opciones de sitio web dinámico. Cuando lo activa, la tarea Add JavaScript snippet to your website en el paso Checklist ofrece una instalación recomendada para frameworks de renderización del lado del servidor (SSR), además del fragmento de JavaScript. Obtenga más información sobre configurar experimentos en una aplicación de una sola página y la referencia enableSinglePageSupport.

​

Alojamiento de recursos

De forma predeterminada, Kameleoon sirve sus recursos desde la CDN de Kameleoon. Si elige alojarlos usted mismo, la seguridad y disponibilidad se convierten en su responsabilidad. Cada opción tiene un enlace View documentation.

• Self-host the script file: Sirve el script principal de Kameleoon desde su propio servidor o CDN. Ingrese la URL completa donde aloja el archivo de script en Script file URL.
• Self-host images: Sirve los activos de imagen de Kameleoon desde su propio servidor o CDN. Ingrese la URL base donde aloja los archivos de imagen en Image base URL. Utilice el autoalojamiento de imágenes solo a través de una CDN que proporcione un mecanismo de replicación integrado.

Para más información, consulte Simple self-hosting and on-premises options.

​

Dominios y subdominios

De forma predeterminada, Kameleoon permite solo su dominio principal y sus subdominios (*.example.com). Solo los dominios y subdominios enumerados pueden usar el editor gráfico. También se aplican cuando el targeting de experimentos se basa en datos de visitante compartidos en tiempo real entre el dominio principal y sus subdominios. Kameleoon completa previamente la lista con una entrada de comodín para su dominio principal. Para agregar otro dominio, ingréselo en el campo debajo de la lista y haga clic en Add domain. Para eliminar un dominio, haga clic en la X al final de su fila. En Cross-domain tracking, active Track visitors across listed subdomains para compartir datos de visitantes entre los dominios enumerados para targeting en tiempo real. Kameleoon utiliza almacenamiento local para hacer seguimiento de datos de sesión que puede usar en targeting de campañas. El tracking entre dominios permite hacer seguimiento de visitantes en diferentes subdominios (por ejemplo, example.com y payment.example.com). Kameleoon no trata sus visitantes como visitantes nuevos cuando navegan por sus dominios y subdominios, y sus experiencias se mantienen consistentes en sus propiedades digitales. El tracking entre dominios solo es necesario si pretende usar datos de sesión en todos sus dominios para targeting conductual avanzado. Para más información, consulte Unify session data storage across subdomains.

​

Checklist

El paso Checklist enumera las tareas requeridas que completa para comenzar a ejecutar experimentos. También puede enumerar tareas opcionales. Abra una tarea para ver sus instrucciones y haga clic en Mark as completed cuando la termine. Cada grupo de tareas muestra cuántas de sus tareas completó, por ejemplo 0 of 2 tasks completed. Cuando termine, haga clic en Complete setup. Las tareas aparecen en hasta dos grupos:

• For your A/B tests and personalizations: Tareas para instalar Kameleoon en su sitio web. Este grupo aparece para proyectos de Web Experimentation y All campaign types.
• For your flags and feature experiments: Tareas para instalar un SDK de Kameleoon. Este grupo aparece para proyectos de Feature Experimentation y All campaign types.

​

Tareas para experimentos web y personalizaciones

El grupo For your A/B tests and personalizations enumera las tareas para instalar Kameleoon en su sitio web. Las tareas dependen del método de instalación que seleccionó.

​

Tareas de fragmento de código

Con el método de instalación Code snippet pasted on your site, la lista de verificación incluye las siguientes tareas. Add JavaScript snippet to your website instala Kameleoon en sus páginas. Haga clic en Copy, pegue el fragmento justo después de la etiqueta <head> en sus páginas web, antes que cualquier otro script, y haga clic en Mark as completed. Un enlace Implementation guide abre las instrucciones de instalación. Si activó My site uses a server-side framework en el paso Technical configuration, la tarea tiene dos opciones. SSR Framework (recomendado) es la instalación nativa para su framework: usa el código del sitio del proyecto para inicializarlo. La tarea muestra el Project sitecode con un botón de copia. Seleccione Next.js, Nuxt o SvelteKit en Select your SSR framework, luego haga clic en Apply. El framework aparece en una tabla debajo de la lista, con un enlace a su documentación. JavaScript snippet es la instalación estándar: haga clic en Copy y pegue el fragmento justo después de la etiqueta <head> en sus páginas web, antes que cualquier otro script. Set up file synchronization cubre mantener actualizada una copia autoalojada del archivo de aplicación de Kameleoon. El archivo de aplicación es dinámico: su contenido cambia cada vez que el estado de un experimento o personalización cambia en la plataforma, y cada vez que cambia la configuración. Configure la sincronización entre el archivo alojado en su servidor o CDN y el archivo original que Kameleoon genera, luego haga clic en Mark as completed. Su CDN proporciona su propia interfaz para esta configuración. En un servidor HTTP estándar como nginx o Apache, use un trabajo cron que ejecute un comando wget para recuperar el archivo cada 5 minutos. Para comandos y detalles, consulte Application file and public resources self-hosting. La tarea aparece para los métodos de instalación de fragmento de código y gestor de etiquetas, y un enlace Implementation guide abre las instrucciones.

​

Tareas del gestor de etiquetas

Con el método de instalación Tag Manager, la lista de verificación incluye las siguientes tareas. Add this code to your Tag Manager instala Kameleoon a través de su sistema de gestión de etiquetas. Haga clic en Copy, pegue el código en la interfaz del gestor de etiquetas y haga clic en Mark as completed. Un enlace Implementation guide abre las instrucciones. Set up file synchronization cubre mantener actualizada una copia autoalojada del archivo de aplicación de Kameleoon. Es la misma tarea que con el fragmento de código: configure la sincronización entre el archivo alojado en su servidor o CDN y el archivo original que Kameleoon genera, luego haga clic en Mark as completed. Después de completar la tarea del gestor de etiquetas, la lista de verificación la enumera como la siguiente tarea requerida.

​

Tareas de Shopify

Con el método de instalación Shopify, el grupo tiene una sola tarea. Installation via the Shopify app instala Kameleoon a través de la integración de Kameleoon en la Shopify App Store. Copie el código del sitio del proyecto, úselo en Shopify para instalar Kameleoon en su sitio y haga clic en Mark as completed. Un enlace en la tarea abre las directrices de instalación.

​

Tarea de tracking entre subdominios

Si activó Track visitors across listed subdomains en el paso Technical configuration, la lista de verificación también incluye Host the Kameleoon static HTML file. La tarea permite targeting entre subdominios en sus subdominios enumerados. Descargue el archivo HTML, cárguelo en el directorio estático de su dominio principal para que sea accesible públicamente, ingrese la URL completa del archivo alojado y haga clic en Mark as completed.

​

Tareas para marcas de características y experimentos de características

El grupo For your flags and feature experiments enumera las tareas para instalar un SDK de Kameleoon.

​

Tarea Instalar el SDK

Install the SDK es una tarea requerida. Siga la guía de instalación del SDK para su lenguaje de programación y use el código del sitio vinculado a su proyecto para inicializar el SDK. La tarea muestra el Project sitecode con un botón de copia. Seleccione su SDK en la lista Select your SDK y haga clic en Apply. El SDK aparece en una tabla debajo de la lista, con un enlace a su documentación en el lado izquierdo de la tabla. Haga clic en Mark as completed cuando termine. Para instalar Kameleoon en un sitio, aplicación web o aplicación móvil con un SDK, consulte la documentación en client-side and mobile SDKs.

​

Tarea opcional del gestor de etiquetas

Add this code to your Tag Manager es una tarea opcional. Copie el código, péguelo en la interfaz del gestor de etiquetas para instalar Kameleoon en su sitio y haga clic en Mark as completed. La tarea no aparece en un proyecto con la plataforma Mobile app, cuya lista de verificación tiene solo la tarea Install the SDK. Después de completar la configuración, administre la configuración, consentimiento, scripts e instalación del proyecto en Manage your projects.