Você está visualizando o conteúdo de ajuda da versão:

O ambiente de criação do AEM fornece vários mecanismos para organização e edição de conteúdo. As ferramentas fornecidas são acessadas de vários consoles e editores de página.

Gerenciar o site

O console Sites permite navegar e gerenciar o site, usando a barra de cabeçalho, a barra de ferramentas, os ícones de ação (aplicáveis ao recurso selecionado), as navegações estruturais e, quando selecionados, os trilhos secundários (por exemplo, linha do tempo e referências).

Por exemplo, exibição de cartão:

chlimage_1

Editar conteúdo da página

Você pode editar uma página com o editor de páginas. Por exemplo:

http://localhost:4502/editor.html/content/we-retail/br/pt/equipment.html

screen_shot_2018-03-22at141536

Observação:

Na primeira vez que você abrir uma página para edição, uma série de slides oferecerá um tour dos recursos.

Ignore o tour, se desejar, e repita-o a qualquer momento selecionando o menu Informações da página.

Acessar ajuda

Ao editar uma página, a Ajuda pode ser acessada de:

  • o seletor Informações da página; isso mostrará os slides de introdução (como na primeira vez que você acessa o editor).
  • a caixa de diálogo Configuração para componentes específicos (usando o ícone ? na barra de ferramentas da caixa de diálogo); isso mostrará a ajuda sensível ao contexto.

Mais recursos relacionados à ajuda estão disponíveis nos consoles.

O navegador de componentes mostra todos os componentes disponíveis para uso na sua página atual. Eles podem ser arrastados para o local apropriado e depois editados para adição de conteúdo.

O navegador de componentes é uma guia dentro do painel lateral (junto com o navegador de ativos e a árvore de conteúdo). Para abrir (ou fechar) o painel lateral, use o ícone na parte superior esquerda da barra de ferramentas:

screen_shot_2018-03-22at141659

Ao abrir o painel lateral, ele deslizará para ser aberto no lado esquerdo (selecione a guia Componentes, conforme necessário). Quando estiver aberta, você pode navegar por todos os componentes disponíveis para a sua página.

A aparência e o manuseio real dependem do tipo de dispositivo usado:

Observação:

Um dispositivo móvel é detectado quando a largura é inferior a 1024px. Esse também pode ser o caso para uma janela pequena de desktop.

  • Dispositivo móvel (por exemplo iPad)

    O navegador de componente cobre completamente a página sendo editada.

    Para adicionar um componente à sua página, toque e segure o componente desejado e mova-o para a direita - o navegador de componente será fechado para mostrar a página novamente - onde você poderá posicionar o componente.

    screen_shot_2018-03-22at141752
  • Dispositivo de desktop

    O navegador de componente é aberto no lado esquerdo da janela.

    Para adicionar um componente à página, clique no componente e arraste-o para o local desejado.

    screen_shot_2018-03-22at141808

    Os componentes são representados por

    • Nome do componente
    • Grupo do componente (em cinza)
    • Ícone ou abreviação
      • Os ícones dos componentes padrão são monocromáticos.
      • As abreviações são sempre os dois primeiros caracteres do nome do componente.

    Na barra de ferramentas superior, no navegador de Componentes, é possível:

    • Filtrar componentes por nome.
    • Limitar a exibição para um grupo específico usando a seleção suspensa.

    Para obter uma descrição mais detalhada do componente, clique ou toque no ícone de informações ao lado do componente no navegador de Componentes (se disponível).

    screen_shot_2018-03-22at141929

    Para mais informações sobre os componentes disponíveis para você, consulte o Console de componentes.

O navegador de ativos mostra todos os ativos disponíveis para o uso direto na sua página atual.

O navegador de ativos é um guia no painel lateral juntamente com o navegador de componentes e a árvore de conteúdo. Para abrir ou fechar o painel lateral, use o ícone na parte superior esquerda da barra de ferramentas:

screen_shot_2018-03-22at141659

Ao abrir o painel lateral, ele deslizará do lado esquerdo. Selecione a guia Assets se necessário.

screen_shot_2018-03-22at142035

Quando o navegador de ativos está aberto, você pode navegar pelos ativos disponíveis para sua página. A rolagem infinita é usada para expandir a lista quando necessário.

chlimage_1

Para adicionar um ativo à página, selecione e arraste para o local desejado. Isso pode ser:

  • Um componente existente do tipo adequado.
    • Por exemplo, você pode arrastar um ativo de imagem para um componente de imagem.
  • Um espaço reservado no sistema de parágrafo para criar um novo componente do tipo adequado.
    • Por exemplo, você pode arrastar um ativo de imagem para o sistema de parágrafo para criar um componente de imagem.

Observação:

Essa ação está disponível para tipos de ativos e componentes específicos. Consulte Inserir um componente usando o navegador de ativos para obter mais detalhes.

Na barra de ferramentas superior dos ativos, é possível filtrá-los por:

  • Nome
  • Caminho
  • Tipo de ativo como imagens, manuscritos, documentos, vídeos, páginas, parágrafos e produtos
  • Características do ativo, como Orientação (Retrato, Paisagem, Quadrado) e Estilo (Cor, Monocromático, Tom de cinza)
    • Disponíveis somente para determinados tipos de ativos

A aparência e o manuseio real dependem do tipo de dispositivo usado:

Observação:

Um dispositivo móvel é detectado quando a largura é menor do que 1024px; ou seja, também está em uma janela de desktop pequena.

  • Dispositivos móveis como o iPad

    O navegador de ativos cobre completamente a página que está sendo editada.

    Para adicionar um ativo à sua página, toque e segure o ativo desejado, em seguida, mova-o para a direita - o navegador de ativos será fechado para mostrar a página novamente, onde você poderá adicionar o ativo ao componente desejado.

    screen_shot_2018-03-22at142223
  • Dispositivo de desktop

    O navegador de ativos é aberto no lado esquerdo da janela.

    Para adicionar um ativo à página, clique no ativo e arraste-o para o componente ou local desejado.

    screen_shot_2018-03-22at142337

Se você precisar fazer uma alteração rápida em um ativo, pode iniciar o editor de ativos diretamente do navegador de ativos, clicando no ícone de edição mostrado ao lado do nome do ativo.

screen_shot_2018-03-22at142448

Árvore de conteúdo

A Árvore de conteúdo fornece uma visão geral de todos os componentes na página em uma hierarquia, de modo que seja possível visualizar rapidamente como a página é composta.

A Árvore de conteúdo é uma guia dentro do painel lateral (junto com o navegador de ativos e de componentes). Para abrir (ou fechar) o painel lateral, use o ícone na parte superior esquerda da barra de ferramentas:

screen_shot_2018-03-22at142042

Ao abrir o painel lateral, ele deslizará para ser aberto (a partir do lado esquerdo). Selecione a guia Árvore de conteúdo, se necessário. Quando aberta, é exibida uma representação de exibição em árvore de sua página ou modelo, para que seja mais fácil entender como o conteúdo é estruturado hierarquicamente. Além disso, em uma página complexa, facilita alternar entre os componentes da página.

screen_shot_2018-03-22at142526

Uma página pode ser facilmente composta de vários componentes do mesmo tipo, portanto a árvore exibe o texto descritivo (em cinza) após do nome do tipo de componente (em preto). O texto descritivo é originado de propriedades comuns do componente, como título ou texto.

Os tipos de componentes serão exibidos no idioma do usuário, enquanto o texto de descrição do componente apresenta o idioma da página.

Clicar no ícone de divisa ao lado de um componente recolherá ou expandirá o respectivo nível.

screen_shot_2018-03-22at142559

Clicar no componente realçará o componente no editor de páginas.

screen_shot_2018-03-22at142647

Se você clicar em um componente na árvore que seja editável, um ícone de chave inglesa aparecerá à direita do nome. Clicar no ícone de edição iniciará diretamente a caixa de diálogo referente ao componente.

screen_shot_2018-03-22at142725

Observação:

A Árvore de conteúdo não ficará disponível se você estiver editando uma página em um dispositivo móvel (se a largura do navegador for menor do que 1024px).

Fragmentos: navegador do conteúdo associado

Se a página contiver Fragmentos do conteúdo, então você também terá acesso ao navegador para o conteúdo associado.

Referências

As referências mostram as conexões com a página selecionada:

  • Blueprints
  • Lançamentos
  • Live copies
  • Cópias de idioma
  • Uso do componente de referência
  • Referências a páginas de produtos (do console Comércio - Produtos)

Abra o console e navegue até o recurso desejado, e abra Referências usando:

screen_shot_2018-03-22at153653

Selecione o recurso desejado para mostrar uma lista de tipos de referências relevantes para esse recurso:

screen_shot_2018-03-22at153731

Selecione o tipo de referência apropriado para obter mais informações. Em determinadas situações, outras ações estão disponíveis ao selecionar uma referência específica, incluindo:

Por exemplo, você pode corrigir uma referência desfeita em um componente de Referência:

chlimage_1

Eventos - Linha do tempo

Para os recursos adequados (por exemplo, as páginas no console Sites ou os ativos no console Assets), a linha do tempo pode ser usada para mostrar a atividade recente de qualquer item selecionado.

Abra o console e navegue até o recurso desejado, e abra Linha do tempo usando:

screen_shot_2018-03-22at153952

Selecione o recurso desejado, em seguida escolha Exibir todos ou Atividades para listar as ações recentes nos recursos selecionados:

screen_shot_2018-03-22at154130

Informações da página

As Informações da página (ícone de equalizador) abrem um menu que também fornece os detalhes sobre a última edição e a última publicação. Dependendo das características da página (e de seu respectivo site) mais ou menos opções podem estar disponíveis:

screen_shot_2018-03-22at154210

Por exemplo, quando apropriado, Informações da página também terá as opções:

Além disso, Informações da página pode fornecer acesso ao Analytics e a recomendações, quando apropriado.

Modos de página

Há vários modos ao editar uma página, o que permite ações diferentes:

  • Edição - o modo a ser usado ao editar o conteúdo da página.
  • Layout - permite que você crie e edite seu layout responsivo dependente do dispositivo (se a página for baseada em um contêiner de layout)
  • Andaime - ajuda a criar um grande conjunto de páginas que compartilha a mesma estrutura, mas tem um conteúdo diferente.
  • Desenvolvedor - permite executar várias ações (requer privilégios). Que incluem inspecionar os detalhes técnicos de uma página e seus componentes.
  • Design - permite que você habilite/desabilite para o uso em uma página e configure o design do componente (se a página for baseada em um modelo estático).
  • Direcionamento - aumenta a relevância do conteúdo através do direcionamento e medição em todos os canais.
  • Distorção - permite que você veja o status de uma página em um ponto específico no tempo.
  • Status da Live Copy - permite ter uma visão geral rápida do status da live copy e quais componentes são ou não herdados.
  • Visualização- o modo usado para visualizar a página da forma que será exibida no ambiente de publicação; ou navegar usando os links no conteúdo.
  • Anotar - usado para adicionar ou exibir anotações na página.

Você pode acessar esses itens usando os ícones no canto superior direito. O ícone real será alterado para refletir o modo usado no momento:

chlimage_1

Observação:

  • Dependendo das características da página, alguns modos podem não estar disponíveis.
  • O acesso a alguns modos exige permissões/privilégios adequados.
  • O modo Desenvolvedor não está disponível em dispositivos móveis devido a restrições de espaço.
  • Existe um atalho de teclado (Ctrl-Shift-M) para alternar entre o modo de Visualização e o atualmente selecionado (por exemplo, Editar, Layout etc).

Seleção de caminho

Ao criar, geralmente é necessário selecionar outro recurso, como ao definir um link para outra página ou recurso ou ao selecionar uma imagem. Para selecionar um caminho com facilidade, os campos de caminho oferecem o recurso de completar automaticamente, e o navegador de caminho permite uma seleção mais robusta.

Campos de caminho

Para ilustração, o exemplo usado aqui é o componente de imagem. Para obter mais informações sobre como usar e editar componentes, consulte Componentes para criação de página.

Agora, os campos de caminho têm as funcionalidades de completar automaticamente e de look-ahead, para facilitar a localização de um recurso. Basta começar a digitar no campo de caminho e o AEM oferecerá a caminhos correspondentes à medida que você digita.

screen_shot_2018-03-22at154403

Clicar no botão Abrir caixa de diálogo no campo de caminho abre a caixa de diálogo navegador de caminho para permitir opções mais detalhadas de seleção.

screen_shot_2018-03-22at154427

O navegador de caminho é organizado da mesma maneira que a exibição de colunas do console de sites, permitindo uma seleção mais detalhada dos recursos.

screen_shot_2018-03-22at154521

Uma vez que um recurso é selecionado, o botão Selecionar no canto superior direito da caixa de diálogo ficará ativo. Clique ou toque para confirmar a seleção ou Cancele para interromper.

Se o contexto permite a seleção de vários recursos, selecionar um recurso também ativa o botão Selecionar, mas também adiciona uma contagem do número de recursos selecionados no canto superior direito da janela. Clique no X ao lado do número para desmarcar tudo.

chlimage_1

As navegações estruturais podem ser usadas para avançar rapidamente na hierarquia do recurso.

chlimage_1

A qualquer momento, você pode usar o campo de pesquisa na parte superior da caixa de diálogo.

chlimage_1

Clique no X no campo de pesquisa para cancelar a pesquisa.

Para limitar sua pesquisa, você pode revelar as opções de filtro e filtrar seus resultados com base em um determinado caminho.

chlimage_1

Atalhos de teclado

Vários atalhos de teclado estão disponíveis.

Esta obra está licenciada sob uma licença não adaptada da Creative Commons Attribution-Noncommercial-Share Alike 3.0  As publicações do Twitter™ e do Facebook não são cobertas pelos termos do Creative Commons.

Avisos legais   |   Política de privacidade online