Adicionar componentes a um canal

Última atualização em 2023-05-20
  • Criado para:
  • Intermediate
    Admin
    Developer

Os componentes são os elementos fundamentais da experiência com o AEM (Adobe Experience Manager). Você pode usar vários componentes e adicioná-los ao canal em um projeto do AEM Screens.

Componentes no AEM Screens

O AEM Screens fornece diferentes componentes do AEM que podem ser usados em um projeto do Screens.

Visualização de componentes do AEM Screens

Sempre que criar um projeto AEM Screens, você verá uma lista de componentes padrão que podem ser adicionados ao projeto.

Para exibir os componentes padrão do seu projeto do Screens, siga as etapas abaixo:

  1. Selecione o canal. Por exemplo, We.Retail Na Loja —> Canais —> Canal ocioso.

  2. Clique em Editar na barra de ações para abrir o editor de AEM.

  3. Clique em + ícone na barra lateral para abrir os componentes.

  4. Todos os componentes incluídos por padrão em um projeto do AEM Screens são exibidos, como mostrado na figura abaixo.

screen_shot_2017-12-18at21350pm

Adicionar um novo componente

O AEM fornece vários outros componentes. Você sempre pode adicionar outros componentes (não incluídos por padrão) ao seu projeto, já que eles são compatíveis com o AEM Screens.

O exemplo a seguir mostra a adição de um componente Livefyre a um projeto AEM Screens:

  1. Selecione o canal no qual deseja adicionar um novo componente. Por exemplo, We.Retail Na Loja —> Canais —> Canal ocioso.

  2. Clique em Editar na barra de ações para abrir o editor.

  3. Selecionar Design modo.

  4. Selecione todo o editor de design à direita e clique no símbolo de configurações para abrir a Design de ParSys caixa de diálogo.

  5. Você pode selecionar os componentes que deseja importar para o projeto do AEM Screens. O exemplo a seguir mostra a adição de Livefyre componente a um projeto do AEM Screens.

add_components

OBSERVAÇÃO

Da mesma forma, você pode adicionar qualquer número de outros novos componentes compatíveis com o AEM Screens ao seu projeto.

Compreender os componentes da tela AEM

A seção a seguir explica os componentes do AEM Screens que você pode usar no projeto.

OBSERVAÇÃO

Para exibir as propriedades de qualquer componente, selecione o componente e clique no ícone de martelo para abrir/exibir propriedades.

Aplicativo

A variável Aplicativo permite adicionar um aplicativo ao canal.

O componente do aplicativo tem as seguintes propriedades:

Propriedade Descrição
Caminho do aplicativo Selecione o caminho absoluto onde o aplicativo existe.
Duração (ms) Selecione a duração do aplicativo. Por padrão, a duração é definida como -1, o que significa que o elemento é executado para sempre (ou seja, aplicativo de página única). Definir o valor de duração >0 mostra o elemento para a duração especificada e, em seguida, avança para o próximo.

O exemplo a seguir mostra como incorporar um componente de aplicativo juntamente com a visualização de suas propriedades:

adding_componentsapplication

OBSERVAÇÃO

Consulte o exemplo acima para exibir as propriedades de cada um dos componentes abaixo.

Canal

A variável Canal permite adicionar um canal inteiro ao projeto.

O componente Canal tem as seguintes propriedades:

Propriedade Descrição
Caminho do canal Selecione esse caminho absoluto onde o aplicativo existe.
Duração (ms) Selecione toda a duração do canal. Definir a duração como -1 indica que o canal incorporado executará seu comprimento total em um canal específico.

Página incorporada

Um Página incorporada permite adicionar uma página incorporada ao projeto. Por exemplo, pode ser um aplicativo web ou um catálogo de produtos.

A página Incorporada tem as seguintes propriedades:

Propriedade Descrição
Caminho da página
 Selecione esse caminho absoluto onde o canal existe.
Duração (ms) Selecione toda a duração do canal. Definir a duração como -1 indica que o canal incorporado executará seu comprimento total em um canal específico.

Sequência incorporada

OBSERVAÇÃO

Consulte Sequências incorporadas na seção Criação de telas, para saber mais detalhes sobre sequências incorporadas.

Uma sequência incorporada permite adicionar um canal de sequência incorporada no canal existente (com outros ativos).

A Sequência incorporada tem as seguintes propriedades de página:

Propriedade Descrição
Caminho do canal Selecione o caminho absoluto da sequência que deseja incluir no canal.
Duração (ms) Selecione toda a duração do canal. Definir a duração como -1 indica que o canal incorporado executará seu comprimento total em um canal específico.
Estratégia Defina-o como original ou solteiro. Definir o valor para original significa que a subsequência será totalmente executada em cada ciclo da sequência principal. O outro valor possível é solteiro e que mostraria apenas um item da subsequência em cada execução (por exemplo, o primeiro item no primeiro loop, o segundo item no segundo loop e assim por diante).

Sequência incorporada dinâmica

Uma sequência incorporada dinâmica permite adicionar uma sequência semelhante à mencionada acima, exceto por função de canal.

Consulte Sequências incorporadas na seção Criação de telas, para saber mais detalhes sobre sequências incorporadas.

A sequência incorporada dinâmica tem as seguintes propriedades:

Propriedade Descrição
Função da atribuição do canal
 Insira a função do canal.
Duração (ms) Selecione toda a duração do canal. Definir a duração como -1 indica que o canal incorporado executará seu comprimento total em um canal específico.
Estratégia Defina-o como original ou solteiro. Definir o valor para original significa que a subsequência será totalmente executada em cada ciclo da sequência principal. O outro valor possível é solteiro e que mostraria apenas um item da subsequência em cada execução (por exemplo, o primeiro item no primeiro loop, o segundo item no segundo loop e assim por diante).

Fragmento de experiência

Um Fragmento de experiência permite adicionar um fragmento de experiência (grupo de um ou mais componentes, incluindo conteúdo e layout que podem ser referenciados nas páginas) ao canal do AEM Screens. Arraste e solte o componente no editor de AEM e selecione o fragmento de experiência.

Para saber mais sobre como criar um fragmento de experiência e aproveitá-lo em um projeto do AEM Screens, consulte Uso de fragmentos de experiência.

exp

Propriedade Descrição
Fragmento de experiência
Fragmento de experiência Selecione o fragmento de experiência.
Duração Selecione toda a duração do fragmento de experiência reproduzido no canal.
Configuração offline
Bibliotecas do lado do cliente Arquivos JavaScript e CSS.
Arquivos estáticos Arquivos estáticos que você pode adicionar como configurações offline ao fragmento de experiência.
OBSERVAÇÃO

A variável Bibliotecas do cliente e a variável Arquivos estáticos que você adicionar a partir deste componente será adicionado além do já configurado Bibliotecas do cliente e os Arquivos estáticos que são adicionados do repositório do fragmento de experiência Propriedades.

Imagem

Uma imagem permite adicionar uma imagem ao seu canal.

O ativo de imagem tem três guias: Imagem, Acessibilidade, e Sequência:

Propriedade Descrição
Imagem
Ativo de imagem Selecione o ativo de imagem.
Título Título da imagem.
Vincular a Adicione um link à imagem.
Descrição Breve descrição da imagem.
Tamanho Tamanho da imagem.
Acessibilidade
Texto alternativo Texto alternativo para a imagem.
Sequência
Duração Por padrão, a duração está definida como 8000 ms. Se quiser alterar a duração da reprodução da imagem, atualize o Duração campo.

Transição

O componente de Transição permite adicionar uma transição ao projeto do Screens.

A imagem a seguir mostra o componente de transição (adicionado via arrastar e soltar) ao editor.

screen_shot_2019-07-25at104237am

Selecione o ícone de transição e clique no botão Configurar (ícone de chave inglesa) para abrir a Transição caixa de diálogo. Essa caixa de diálogo inclui três guias:

  • Transição
  • Sequência
  • Ativação
OBSERVAÇÃO

Por padrão, a sequência é definida como 600 ms. É possível atualizar a sequência de transição para outro valor usando o Sequência guia.

transição

O componente de transição tem as seguintes propriedades:

Propriedade Descrição
Transição
Tipo

O tipo de transição entre o elemento anterior e o posterior. A transição Tipo O inclui as seguintes opções:

  • Normal
  • Esmaecer
  • Deslizar da direita
  • Deslizar da esquerda
  • Deslizar do topo
  • Deslizar da parte inferior
Sequência
Duração Selecione toda a duração da transição. Por padrão, é definido como 600 ms.
Ativação
Ativo desde Carimbo de data e hora que descreve quando a transição pode estar ativa.
Ativo até Carimbo de data e hora que descreve até quando a transição pode estar ativa.
Programação Adicione um agendamento predefinido.

Vídeo

O componente de Vídeo permite que você adicione um vídeo ao seu projeto do Screens.

O componente de vídeo tem as seguintes propriedades:

Propriedade Descrição
Ativo de vídeo Selecione o link para o vídeo.
Duração Selecione a duração do vídeo. Por padrão, a duração é definida como -1, o que significa que o elemento é executado para sempre. Definir o valor de duração >0 mostra o elemento para a duração especificada e, em seguida, avança para o próximo.
Renderização

Se a taxa de proporção do vídeo não couber na tela, é possível ajustar a renderização para contain ou capa.

Contain significa que o vídeo completo é exibido e as áreas ausentes são preenchidas com uma borda preta.

Capa significa que o vídeo cobre toda a janela de visualização, mas algumas partes que transbordam nas laterais ficam ocultas.
Tamanho Tamanho do vídeo.
Página anterior
Next page

Nesta página