En esta página: Aprenda a agregar un selector CSS y modificaciones en el encabezado de página a sus páginas web con el editor no visual de Adobe Journey Optimizer, sin instalar una extensión de explorador ni cargar el diseñador web.
Además del Journey Optimizer diseñador web visual, también puede agregar modificaciones a sus páginas web usando un editor no visual.
Esto puede resultar útil si no puede instalar o no tiene permiso para instalar extensiones de explorador como Adobe Experience Cloud Visual Helper, que es necesario para cargar las páginas en el diseñador web.
En algunos casos, también es posible que le resulte más fácil utilizar un editor no visual para aplicar modificaciones en un selector CSS concreto, sin el riesgo de modificar otros elementos en una página web o de cambiar la estructura de la página.
Para crear sus experiencias web con el editor no visual, siga los pasos a continuación.
-
En la pantalla Editar contenido del recorrido o la campaña, anule la selección de la opción Editor visual.
-
Haga clic en Agregar una modificación para empezar a editar el contenido web.
-
Se muestra el editor no visual. Puede añadir la primera modificación mediante el panel izquierdo.
-
En la lista desplegable, seleccione el tipo de modificación.
Hay dos tipos disponibles. Vienen con diferentes opciones. Consulte los vínculos siguientes para obtener más información:
- Selector de CSS - Más información
- Página
<head>- Más información
-
Haga clic en el botón Agregar personalización. Se abre el editor de personalización.
Puede aprovechar el editor de personalización Journey Optimizer con todas sus capacidades de personalización y creación. Más información
-
Escribe tu contenido y guarda tus cambios.
-
La primera modificación se muestra en la parte superior del panel Modificaciones.
Haga clic en el botón Más acciones que está junto a la modificación y seleccione Información para mostrar sus detalles. También puede eliminar la modificación si es necesario.
note NOTE El panel Modificaciones es el mismo que al usar el diseñador web. Todas las acciones que puede realizar con él se detallan en esta sección. -
Haga clic en el botón Agregar en la parte superior del panel Modificaciones para agregar otra modificación y repita los pasos anteriores.
-
Además, puede seleccionar cualquier elemento del sitio web y rastrear los clics en ese elemento. Para habilitar el rastreo de clics y definir las acciones que desea rastrear, haga clic en el segundo icono del carril izquierdo, como se muestra a continuación:
Use el botón Agregar componente para seleccionar una nueva acción que rastrear. Obtenga más información acerca del uso del rastreo de clics en esta sección.
-
Haga clic en la flecha de la parte superior izquierda de la pantalla para volver a la pantalla de edición de recorrido o campaña. Puede ver la cantidad actual de cambios y agregar más.
También puede cambiar al diseñador web si lo desea. Se conservarán todas las modificaciones.
This section contains structured knowledge intended to support interpretation, retrieval, and question answering related to this topic.
For complete understanding, this information should be combined with the documentation on this page. Neither source is intended to stand alone; the page describes the feature, while this section provides additional context that helps disambiguate terminology, intent, applicability, and constraints.
- TL;DR: This page explains how to add CSS selector and page head modifications to web pages using the Journey Optimizer non-visual editor, without installing a browser extension or loading the web designer.
Intents:
- Edit web content without installing a browser extension or loading the web designer
- Switch off the Visual editor option to open the non-visual editor
- Add a CSS Selector or Page head modification
- Apply personalization to a modification through the personalization editor
- Enable click tracking on a selected element
- Switch back to the web designer while preserving modifications
Glossary:
- Non-visual editor: An editor that adds CSS selector and page head modifications to web pages without installing a browser extension or loading the web designer (product-specific)
- CSS Selector: A modification type that applies changes on a particular CSS selector (product-specific)
- Page
<head>: A modification type that applies changes to the page head (product-specific) - Modifications pane: The pane listing added modifications, the same one used in the web designer (product-specific)
- Click tracking: Selecting any element of the website to track the clicks on it, enabled from the left rail (product-specific)
Guardrails:
- To open the non-visual editor, unselect the Visual editor option on the Edit content screen in the journey or campaign.
- Two modification types are available: CSS Selector and Page head.
- The non-visual editor can be used when you cannot, or are not allowed to, install browser extensions such as the Adobe Experience Cloud Visual Helper required to load pages in the web designer.
- Switching to the web designer preserves all your modifications.
Terminology:
- Canonical name: non-visual editor — Acronym: n/a — variants: web non-visual editor
- Synonyms: “web designer” = “visual editor”
- Do not confuse: “non-visual editor” (no browser extension or web designer required) ≠ “web designer” (visual editor requiring the browser extension)
- Do not confuse: “CSS Selector” (modification on a CSS selector) ≠ “Page head” (modification to the page head)
FAQ:
- Q: How do I open the non-visual editor? — From the Edit content screen in the journey or campaign, unselect the Visual editor option, then click Add a modification.
- Q: What modification types can I add? — CSS Selector and Page head.
- Q: Do I need a browser extension to use the non-visual editor? — No, it lets you edit content without installing a browser extension or loading the web designer.
- Q: Can I track clicks on an element? — Yes, select any element of your website and enable click tracking from the second icon on the left rail, using Add Component to select an action to track.
- Q: Will my modifications be kept if I switch to the web designer? — Yes, all your modifications will be preserved.