Opciones del Compositor de experiencias visuales
Al hacer clic en un elemento de página en el Adobe Target Visual Experience Composer (VEC), un menú muestra las opciones disponibles para ese tipo de elemento. Además, se muestra una ruta DOM en la parte inferior de la página que permite navegar fácilmente por la estructura de la página.
Las distintas acciones de Visual Experience Composer (VEC) se agrupan en opciones de menú apropiadas para que su trabajo sea más rápido y eficiente:
Opciones de imagen
Si hace clic en una imagen en una actividad A/B Test, el VEC tiene un aspecto similar al de la siguiente ilustración:
Seleccione componentes del marco Componentes del lado izquierdo para insertar los siguientes elementos:
- Básico (divisor, HTML, imagen).
- Texto (encabezado, párrafo, vínculo).
- Dinámico (Recommendations, Fragmento de experiencia, oferta de HTML).
El menú en la parte superior de la imagen le permite hacer lo siguiente:
- Insertar un vínculo (
- Cambiar la imagen (
- Agregar personalización (
- Eliminar la imagen (
El marco de la derecha permite configurar aún más las propiedades de la imagen.
Los iconos de la parte superior del marco permiten hacer lo siguiente:
- Edite el HTML (
- Duplique la imagen (
- Eliminar la imagen (
- Ocultar la imagen (
Las opciones del marco derecho permiten hacer lo siguiente:
- Edite la clase CSS.
- Configure las propiedades de la imagen (origen, título, texto alternativo).
- Edite la dirección URL del vínculo.
- Configure el tamaño de la imagen (altura y anchura). Haga clic en Show Advanced Options para configurar el tamaño, la anchura, la altura, el desbordamiento y el ajuste de objeto mínimos y máximos de la imagen.
- Configure la posición de la imagen en la página (absoluta, fija, relativa, estática o fija).
- Configure el espaciado del elemento, incluidos el margen y el relleno.
- Configure los efectos del elemento (opacidad). Haga clic en Show Advanced Options para configurar los valores de sepia, escala de grises, contraste, brillo y desenfoque de la imagen. También puede invertir o rotar la imagen.
- Configure los estilos en línea de la imagen.
Opciones de texto
Si hace clic en texto en una actividad A/B Test, el VEC tiene un aspecto similar al de la siguiente ilustración:
Seleccione componentes del marco Components del lado izquierdo para insertar los siguientes elementos:
- Básico (divisor, HTML, imagen).
- Texto (encabezado, párrafo, vínculo).
- Dinámico (Recommendations, Fragmento de experiencia, oferta de HTML).
Haga clic en el icono Show Modifications (
El menú en la parte superior del elemento de texto permite hacer lo siguiente:
- Configure las propiedades del texto (nivel de encabezado, párrafo, comilla de bloque o monoespacio)
- Seleccione el color del texto (
- Configure los atributos del texto (negrita, cursiva, subrayado o tachado) (
- Configure la alineación del texto (izquierda, centro, derecha, justificar) (
- Insertar un vínculo (
- Reemplace el contenido con una oferta de HTML, Fragmento de experiencia o [Recomendación]/help/main/c-recommendations/recommendations-as-an-offer.md).
- Edite el HTML (
- Agregar personalización (
- Eliminar la imagen (
El marco del lado derecho permite configurar aún más las propiedades del texto.
Los iconos de la parte superior del marco permiten hacer lo siguiente:
- Edite el HTML (
- Duplicar el texto (
- Eliminar el texto (
- Ocultar el texto (
Las opciones del marco derecho permiten hacer lo siguiente:
- Edite la clase CSS.
- Configure el color de fondo y la imagen del texto.
- Configure la tipografía del texto (estilo de encabezado, tamaño de fuente, grosor de fuente, altura de línea, alineación, color de texto, estilo de texto (negrita, cursiva, subrayado o tachado)).
- Configure listas, incluidas las listas con viñetas, numeradas o A,B,C.
- Elija el color del borde.
- Configure el tamaño del cuadro de texto (alto y ancho). Haga clic en Show Advanced Options para configurar el tamaño, la anchura, la altura, el desbordamiento y el ajuste de objeto mínimos y máximos del cuadro de texto.
- Configure la posición del cuadro de texto en la página (absoluta, fija, relativa, estática o fija) y establezca el número de píxeles desde arriba, derecha, abajo e izquierda.
- Configure el espaciado del elemento, incluidos el margen y el relleno.
- Configure los efectos del elemento (opacidad). Haga clic en Show Advanced Options para configurar los valores de sepia, escala de grises, contraste, brillo y desenfoque de la imagen. También puede invertir o rotar el texto.
- Configure los estilos en línea.
Editar HTML html
Además del código HTML, puede editar e insertar JavaScript personalizado.
Hay varias opciones disponibles para aplicar formato de texto enriquecido al editar texto y HTML para las actividades A/B y Experience Targeting. Puede seleccionar un tipo de letra, elegir un estilo de letra y cambiar la alineación del texto, entre otras opciones estándar de formato de texto. Al modificar un HTML, puede alternar entre la vista de código y la vista de edición enriquecida del HTML.
Se pueden anidar las siguientes etiquetas HTML5:
<a>
<h1-h6>
, <p>
, <ul>
, <ol>
, <menu>
, <div>
, <figure>
, <figcaption>
<ins>
<h1-h6>
, <p>
, <ul>
, <ol>
, <menu>
<del>
<ul>
, <ol>
, <menu>
, <h1-h6>
, <p>
<label>
<p>
Desplazamiento por elementos utilizando la ruta DOM dom-path
Al hacer clic en un elemento de la página, aparece el menú de opciones de VEC. Además, al hacer clic en un elemento, la ruta DOM correspondiente se muestra en la parte inferior de la página.
Si no ve la ruta DOM, haga clic en el icono Show DOM (
Puede utilizar la ruta DOM para ver rápidamente información sobre el elemento seleccionado (tipo, ID y clase) y subir o bajar por la ruta DOM para seleccionar el elemento deseado.
Puede navegar fácilmente a cualquier elemento principal, del mismo nivel o secundario dentro del VEC utilizando la ruta DOM.
La función de ruta DOM también está disponible al configurar el rastreo de clics.