Personalização e extensão do Editor universal customizing-extending

Saiba mais sobre os diferentes pontos de extensão e outros recursos que permitem personalizar a experiência de criação do Editor universal para atender às necessidades dos autores de conteúdo.

Visão geral overview

O Editor universal permite dois tipos de adaptação para as necessidades do seu projeto.

Ambos os tipos são detalhados nas seções a seguir.

Personalização do Editor universal customizing

O Editor universal oferece várias opções integradas para personalizar sua funcionalidade.

Desabilitar publicação disable-publish

Determinados workflows de criação exigem que o conteúdo seja revisado antes de ser publicado. Nessas situações, a opção de publicar não deve estar disponível para nenhum autor.

Portanto, o botão Publish pode ser totalmente suprimido em um aplicativo adicionando os seguintes metadados.

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

Componentes de filtragem filtering-components

Ao usar o Editor universal, é possível restringir os componentes permitidos por componente do contêiner. Para fazer isso, é necessário introduzir uma tag de script adicional, que aponta para a definição do filtro.

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

Uma definição de filtro pode ser semelhante à seguinte, o que restringiria um contêiner para permitir apenas a adição de texto e imagens.

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

Em seguida, você pode fazer referência à definição de filtro a partir do componente de contêiner adicionando a propriedade data-aue-filter, transmitindo a ID do filtro definido anteriormente.

data-aue-filter="container-filter"

Definir o atributo components em uma definição de filtro como null permite todos os componentes, como se não houvesse filtros.

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

Mostrar e ocultar componentes condicionalmente no painel Propriedades conditionally-hide

Embora um componente ou componentes possam estar disponíveis para os autores, pode haver certas situações em que isso não faça sentido. Nesses casos, você pode ocultar componentes no painel de propriedades adicionando um atributo condition aos campos do modelo de componente.

As condições podem ser definidas usando o esquema JsonLogic . Se a condição for verdadeira, o campo será exibido. Se a condição for falsa, o campo ficará oculto.

Modelo de amostra
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] }
      }
    ]
 }
Condição falsa
Campo de texto oculto
Condição Verdadeira
Campo de texto mostrado

Extensão da interface do editor universal extending

Como um serviço do Adobe Experience Cloud, a interface do editor universal pode ser estendida usando o App Builder e o Experience Manager.

As extensões de interface do usuário são aplicativos do JavaScript criados com o Adobe App Builder que podem ser incorporados em aplicativos de interface do usuário executados no Adobe Experience Cloud Unified Shell, como o Editor universal. Você pode adicionar seus próprios botões e ações ao menu de cabeçalho e ao painel de propriedades, bem como criar seus próprios eventos para o Editor universal.

Se você quiser explorar essas possibilidades, consulte os seguintes recursos:

  1. Extensibilidade da Interface do Usuário - Esta é a documentação do desenvolvedor para a extensão da Interface do Usuário.
  2. Guias de Extensibilidade da Interface do Usuário - Instruções detalhadas sobre como desenvolver sua própria extensão
  3. Os Pontos de Extensão do Editor Universal - Documentação de pontos de extensão específicos do Editor Universal
TIP
Se preferir aprender por exemplo, consulte o tutorial sobre extensibilidade da interface do AEM. Embora se concentre na extensão do console de Fragmentos de Conteúdo, os conceitos para implementar uma extensão de interface no Editor Universal são os mesmos.

Usando o Extension Manager no AEM Sites, você pode habilitar ou desabilitar suas extensões por instância, acessar extensões próprias do Adobe, inclusive as do Universal Editor, e muito mais.

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