Personalizar y ampliar el editor universal customizing-extending

Obtenga información acerca de los diferentes puntos de extensión y otras funciones que le permiten personalizar la experiencia de creación del Editor universal para satisfacer las necesidades de los autores de contenido.

Información general overview

El editor universal permite dos tipos de adaptación para las necesidades de su proyecto.

Ambos tipos se detallan en las secciones siguientes.

Personalización del editor universal customizing

El editor universal ofrece varias opciones integradas para personalizar su funcionalidad.

Desactivación de publicación disable-publish

Algunos flujos de trabajo de creación requieren que el contenido se revise antes de publicarse. En estos casos, la opción para publicar no debe estar disponible para ningún autor.

Por lo tanto, el botón Publish se puede suprimir por completo en una aplicación añadiendo los siguientes metadatos.

<meta name="urn:adobe:aue:config:disable" content="publish"/>

Filtrado de componentes filtering-components

Al utilizar el Editor universal, puede restringir los componentes permitidos por componente de contenedor. Para ello, debe introducir una etiqueta de script adicional, que apunte a la definición del filtro.

<script type="application/vnd.adobe.aue.filter+json" src="/static/filter-definition.json"></script>

Una definición de filtro puede tener el aspecto siguiente, que restringiría un contenedor para permitir únicamente agregar texto e imágenes.

[
  {
    "id": "container-filter",
     "components": ["text", "image"]
   }
]

A continuación, puede hacer referencia a la definición del filtro desde el componente contenedor agregando la propiedad data-aue-filter, pasando el ID del filtro definido anteriormente.

data-aue-filter="container-filter"

Al establecer el atributo components en una definición de filtro en null, se permiten todos los componentes, como si no hubiera ningún filtro.

[
  {
    "id": "another-container-filter",
     "components": null
   }
]

Mostrar y ocultar condicionalmente componentes en el carril Propiedades conditionally-hide

Aunque un componente o componentes suelen estar disponibles para los autores, puede haber ciertas situaciones en las que no tiene sentido. En estos casos, puede ocultar componentes en el carril de propiedades agregando un atributo condition a los campos del modelo de componentes.

Las condiciones se pueden definir usando el esquema JsonLogic. Si la condición es verdadera, se mostrará el campo. Si la condición es falsa, el campo estará oculto.

Modelo de ejemplo
code language-json
 {
    "id": "conditionally-revealed-component",
    "fields": [
      {
        "component": "boolean",
        "label": "Shall the text field be revealed?",
        "name": "reveal",
        "valueType": "boolean"
      },
      {
        "component": "text-input",
        "label": "Hidden text field",
        "name": "hidden-text",
        "valueType": "string",
        "condition": { "===": [{"var" : "reveal"}, true] }
      }
    ]
 }
Condición falsa
Campo de texto oculto
Condición verdadera
Campo de texto mostrado

Ampliación de la IU del editor universal extending

Como servicio de Adobe Experience Cloud, la interfaz de usuario del editor universal se puede ampliar con el Experience Manager y App Builder.

Las extensiones de interfaz de usuario son aplicaciones de JavaScript creadas con Adobe App Builder que se pueden incrustar en aplicaciones de interfaz de usuario que se ejecutan en el shell unificado de Adobe Experience Cloud, como el editor universal. Puede agregar sus propios botones y acciones al menú de encabezado y al carril de propiedades, así como crear sus propios eventos para el editor universal.

Si desea explorar estas posibilidades, consulte los siguientes recursos:

  1. Extensibilidad de la interfaz de usuario: esta es la documentación para desarrolladores para la extensión de la interfaz de usuario.
  2. Guías de extensibilidad de la IU: instrucciones paso a paso sobre cómo desarrollar su propia extensión
  3. Puntos de extensión de editor universal: documentación de punto de extensión específica de editor universal
TIP
AEM Si prefiere aprender con el ejemplo, consulte el tutorial de extensibilidad de la interfaz de usuario de . Aunque se centra en ampliar la consola de fragmentos de contenido, los conceptos para implementar una extensión de interfaz de usuario en el editor universal son los mismos.

Con Extension Manager en AEM Sites, puede habilitar o deshabilitar las extensiones por instancia, tener acceso a las extensiones de origen de Adobe, incluidas las del editor universal, y mucho más.

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab