Fragmentos de conteúdo visual visual-content-fragments
Os fragmentos de conteúdo contêm conteúdo estruturado destinado à saída JSON, sem design ou layout. A adição de modelos do HTML permite criar experiências visuais totalmente decoradas com conteúdo estruturado no formato HTML:
-
A visualização de um fragmento de conteúdo ajuda na garantia da qualidade do conteúdo, permitindo que as partes interessadas revisem o conteúdo antes que ele seja usado, sem precisar abrir o Editor de fragmentos de conteúdo
-
A entrega de um fragmento visual auxilia a entrega omnicanal, para reutilização de experiências modulares em canais como Web, email ou aplicativos móveis.
A saída renderizada de um Fragmento de conteúdo do AEM que usa o layout e o design de um modelo anexado do HTML é chamada de Fragmento de conteúdo visual.
Os modelos do HTML contêm informações de layout e design, permitindo a visualização dos Fragmentos de conteúdo. A conexão entre um modelo e um Fragmento de conteúdo é estabelecida usando a sintaxe Handlebars para mapear tags do HTML para tipos de dados (campos) definidos no Modelo de fragmento de conteúdo. Essa definição permite que o conteúdo criado nos respectivos campos do Editor de fragmento de conteúdo seja exibido nos locais apropriados no modelo.
Você ou sua equipe de desenvolvimento pode criar e personalizar seus próprios modelos do HTML e, em seguida, carregar e anexar um ou mais aos Modelos de Fragmento de Conteúdo para que os fragmentos correspondentes possam ser renderizados em experiências, visualizados e entregues conforme necessário.
Criar um modelo create-a-template
Os modelos do HTML desenvolvidos com o Handlebars permitem visualizar e entregar fragmentos de conteúdo visual no formato HTML. A sintaxe Handlebars.js define espaços reservados para o conteúdo criado em campos de Fragmento de conteúdo.
Para obter detalhes sobre como desenvolver seus próprios modelos, consulte Fragmentos de conteúdo visual - Modelos.
Fazer upload e atribuir seu modelo upload-and-assign-your-template
Um modelo é associado a um Modelo de fragmento de conteúdo para que possa ser usado com qualquer Fragmento de conteúdo criado a partir desse modelo.
Para fazer upload do novo modelo do HTML:
-
No console de Fragmentos de conteúdo, abra a guia para Modelos de fragmento de conteúdo.
-
Navegue até o local do modelo do fragmento.
-
Selecione o ícone de informações (i) para o modelo necessário:
O painel direito será exibido.
-
Role para baixo para mostrar Modelos do HTML, o Modelo Genérico já está listado, pois é o padrão:
-
Selecione + para carregar seu modelo de um arquivo do HTML (
.html). Uma caixa de diálogo permitirá Procurar seu sistema de arquivos local e selecionar seu arquivo de modelo. -
Depois de carregadas, duas exibições do modelo são mostradas para você revisar:
- à esquerda: uma renderização do template sem conteúdo
- à direita: o código do HTML, que também pode ser editado aqui antes de importar para o AEM
-
Selecione Avançar para continuar.
-
Digite um Nome do modelo para usar no AEM.
-
Confirme com Criar Modelo.
-
O modelo será criado no AEM e listado em Modelos do HTML, nas propriedades dos Modelos de fragmento de conteúdo.
Após carregado, ele pode ser usado para pré-visualização de fragmentos. Você também pode Baixar ou Excluir o modelo.
Visualizar o fragmento com um modelo preview-your-fragment-with-a-template
Para visualizar o fragmento de conteúdo usando um modelo:
-
No console de Fragmentos de conteúdo, navegue até o local do fragmento.
-
Ou:
- selecionar o fragmento no console
- abrir o fragmento no editor
-
Selecione Visualizar na barra de ferramentas superior de:
- o console de Fragmentos de conteúdo
- o editor, onde você pode selecionar Modelo
Em ambos os casos, uma nova janela modal será aberta.
-
Se nenhum modelo personalizado estiver disponível, o AEM usará o Modelo genérico para exibir seu fragmento. O Modelo Genérico:
- exibe os campos do fragmento no formato de tabela, nome e conteúdo
- mostra o conteúdo totalmente hidratado dos fragmentos referenciados na mesma visualização
-
Se os modelos personalizados estiverem disponíveis, você poderá selecionar o modelo que deseja usar (incluindo o Modelo Genérico).
-
Se o fragmento de conteúdo for publicado, você também poderá exibir e copiar sua URL de visualização e URL de publicação.
Por exemplo, visualize com o Modelo genérico:
Entregar seu fragmento de conteúdo visual deliver-your-visual-content-fragment
O fragmento de conteúdo visual pode ser entregue a vários públicos-alvo no formato HTML.
Entregar ao navegador deliver-to-the-browser
Copie a URL de visualização ou a URL de publicação. Acesse isso diretamente do navegador para ver o fragmento de conteúdo visual.
Entregar à Edge Delivery Services deliver-to-edge-delivery-services
Você pode fornecer o fragmento visual em uma página do Edge Delivery Service (EDS).
- Navegue até o Projeto EDS.
- Adicione ou acesse um Bloco do tipo incorporado.
- Cole a URL de Publicação no bloco.
- Publique sua página de EDS. A representação do HTML do fragmento é vista.
Entregar em uma página do AEM deliver-to-an-AEM-page
Você pode entregar seu fragmento de conteúdo visual em uma página do AEM usando o componente principal: fragmento de conteúdo.
Ao configurar um **componente do Fragmento do conteúdo** na sua página:
-
Especifique o Fragmento do conteúdo necessário.
-
Selecione Visualização de Fragmento de Conteúdo.
-
Selecione o Modelo de visualização necessário na lista suspensa.
-
O fragmento visual será mostrado na página.
Baixar seu modelo download-your-template
Para baixar o modelo do HTML no AEM:
-
No console de Fragmentos de conteúdo, abra a guia para Modelos de fragmento de conteúdo.
-
Navegue até o local do modelo do fragmento.
-
Selecione o ícone de informações (i) para o modelo necessário:
O painel direito será exibido.
-
Role para baixo para mostrar Modelos do HTML.
-
Selecione a elipse do modelo que deseja baixar.
-
Selecione Baixar.
-
Especifique o nome e o local do arquivo.
-
Confirme com Salvar.
Excluir seu modelo delete-your-template
Para excluir seu novo modelo do HTML (do AEM):
-
No console de Fragmentos de conteúdo, abra a guia para Modelos de fragmento de conteúdo.
-
Navegue até o local do modelo do fragmento.
-
Selecione o ícone de informações (i) para o modelo necessário:
O painel direito será exibido.
-
Role para baixo para mostrar Modelos do HTML.
-
Selecione a elipse do modelo que deseja baixar.
-
Selecione Excluir.
-
Na caixa de diálogo a seguir, confirme a ação com Excluir.