Personalização dos consoles

CUIDADO

Este documento descreve como personalizar consoles na interface moderna e habilitada para toque e não se aplica à interface clássica.

AEM fornece vários mecanismos para permitir que você personalize os consoles (e a funcionalidade de criação de página) da sua instância de criação.

  • Clientlibs

    Clientlibs permitem estender a implementação padrão para obter novas funcionalidades, reutilizando funções, objetos e métodos padrão. Ao personalizar, você pode criar sua própria clientlib em /apps. Por exemplo, ela pode conter o código necessário para seu componente personalizado.

  • Sobreposições

    As sobreposições são baseadas em definições de nó e permitem que você sobreponha a funcionalidade padrão (em /libs) com sua própria funcionalidade personalizada (em /apps). Ao criar uma sobreposição, uma cópia 1:1 do original não é necessária, já que a fusão de recursos sling permite herança.

Eles podem ser usados de várias maneiras para estender seus consoles de AEM. Uma pequena seleção é abordada abaixo (em um nível alto).

OBSERVAÇÃO

Para obter mais informações, consulte:

Este tópico também é abordado na sessão AEM Gems - Personalização da interface do usuário para AEM 6.0.

CUIDADO

Você deve não alterar nada no caminho /libs.

Isso ocorre porque o conteúdo de /libs é substituído na próxima vez que você atualizar sua instância (e pode muito bem ser substituído quando você aplicar uma correção ou um pacote de recursos).

O método recomendado para configuração e outras alterações é:

  1. Recrie o item necessário (isto é, como ele existe em /libs) em /apps

  2. Faça quaisquer alterações em /apps

Por exemplo, os seguintes locais na estrutura /libs podem ser sobrepostos:

  • consoles (quaisquer consoles com base nas páginas da interface do usuário do Granite); por exemplo:

    • /libs/wcm/core/content
OBSERVAÇÃO

Consulte o artigo da Base de conhecimento, Resolução de problemas AEM problemas da interface do usuário do toque, para obter mais dicas e ferramentas.

Personalização da Visualização padrão para um console

Você pode personalizar a visualização padrão (coluna, cartão, lista) para um console:

  1. É possível reordenar as visualizações sobrepondo a entrada necessária de abaixo:

    /libs/wcm/core/content/sites/jcr:content/views

    A primeira entrada será o padrão.

    Os nós disponíveis correlacionam-se às opções de visualização disponíveis:

    • column
    • card
    • list
  2. Por exemplo, em uma sobreposição para lista:

    /apps/wcm/core/content/sites/jcr:content/views/list

    Defina a seguinte propriedade:

    • Nome: sling:orderBefore
    • Tipo: String
    • Valor: column

Adicionar nova ação à barra de ferramentas

  1. Você pode criar seus próprios componentes e incluir as bibliotecas do cliente correspondentes para ações personalizadas. Por exemplo, uma ação Promover ao Twitter em:

    /apps/wcm/core/clientlibs/sites/js/twitter.js

    Isso pode ser conectado a um item da barra de ferramentas no console:

    /apps/<yourProject>/admin/ext/launches

    Por exemplo, no modo de seleção:

    content/jcr:content/body/content/header/items/selection/items/twitter

Restringir uma ação da barra de ferramentas a um grupo específico

  1. É possível usar uma condição de renderização personalizada para sobrepor a ação padrão e impor condições específicas que devem ser cumpridas antes de ser renderizada.

    Por exemplo, crie um componente para controlar as condições de renderização de acordo com o grupo:

    /apps/myapp/components/renderconditions/group

  2. Para aplicá-los à ação Criar site no console Sites:

    /libs/wcm/core/content/sites

    Crie a sobreposição:

    /apps/wcm/core/content/sites

  3. Em seguida, adicione a condição de renderização para a ação:

    jcr:content/body/content/header/items/default/items/create/items/createsite/rendercondition

    Usando as propriedades neste nó, é possível definir groups permitido para executar a ação específica; por exemplo, administrators

Personalização de colunas na Visualização da Lista

OBSERVAÇÃO

Esse recurso é otimizado para colunas de campos de texto; para outros tipos de dados, é possível sobrepor cq/gui/components/siteadmin/admin/listview/columns/analyticscolumnrenderer em /apps.

Para personalizar as colunas na visualização da lista:

  1. Sobreponha a lista das colunas disponíveis.

    • No nó:

      /apps/wcm/core/content/common/availablecolumns

    • Adicione suas novas colunas ou remova as existentes.

    Consulte Usando Sobreposições (e a Fusão de Recursos Sling) para obter mais informações.

  2. Opcionalmente:

    • Se desejar conectar dados adicionais, você precisa gravar um [PageInforProvider](https://helpx.adobe.com/br/experience-manager/6-4/sites/developing/using/reference-materials/javadoc/com/day/cq/wcm/api/PageInfoProvider.html) com um

      pageInfoProviderType propriedade.
      Por exemplo, consulte a classe/grupo anexado (do GitHub) abaixo.

  3. Agora é possível selecionar a coluna no configurador de coluna da visualização de lista.

Filtrar recursos

Ao usar um console, um caso de uso comum é quando o usuário deve selecionar entre os recursos (por exemplo, páginas, componentes, ativos etc.). Isso pode assumir a forma de uma lista, por exemplo, a partir da qual o autor deve escolher um item.

Para manter a lista em um tamanho razoável e também relevante para o caso de uso, um filtro pode ser implementado na forma de um predicado personalizado. Consulte este artigo para obter detalhes.

Nesta página

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now