Componentes para fragmentos de conteúdo

Componentes para criação de fragmentos

Consulte Content Fragment Management API - Client-Side.

Componentes da autoria de página

Os fragmentos de conteúdo do Adobe Experience Manager (AEM) são criados e gerenciados como ativos independentes da página. Eles permitem criar conteúdo não vinculado a canais, juntamente com variações (podem ser específicas de cada canal). Em seguida, é possível usar estes fragmentos e suas variações ao criar suas páginas de conteúdo. Você também pode usar um ativo de fragmento de conteúdo existente ao arrastá-lo do navegador de ativos para a página (como para outros componentes baseados em ativos, como a Imagem do componente de base). O componente de fragmento de conteúdo predefinido exibe apenas um elemento do fragmento de conteúdo referenciado. Usando a caixa de diálogo do componente, você pode definir o elemento e a variação e o intervalo de parágrafos do fragmento que deseja exibir na página.

Definição

O componente Fragmento de conteúdo é usado para manter uma referência a um ativo de fragmento de conteúdo (ativos de texto efetivamente aprimorados). O tipo de recurso para o fragmento de conteúdo é:

• dam/cfm/components/contentfragment/contentfragment

A referência é definida na propriedade:

• fileReference

Somente o editor da interface habilitada para toque oferece suporte total aos componentes do fragmento de conteúdo, que inclui a biblioteca do cliente:

• cq.authoring.editor.plugin.cfm

Essa biblioteca adiciona recursos específicos aos fragmentos de conteúdo ao editor. Por exemplo, há suporte para a capacidade de adicionar e configurar fragmentos de conteúdo na página, a capacidade de pesquisar ativos de fragmento de conteúdo no navegador de ativos e para o conteúdo associado no painel lateral.

Conteúdo intermediário

O componente Fragmento de conteúdo t permite que você solte componentes adicionais entre os diferentes parágrafos do elemento exibido. Basicamente, o elemento exibido é composto de parágrafos diferentes (cada parágrafo é marcado por um retorno de carro). Entre cada um desses parágrafos, é possível inserir conteúdo usando outros componentes.

De um ponto de vista técnico, cada parágrafo do elemento exibido vive em seu próprio parsys, e cada componente adicionado entre os parágrafos será (sob o capô) inserido no parsys.

Em outras palavras, se a instância do componente de fragmento de conteúdo for composta de três parágrafos, o componente terá três parsys diferentes no repositório. Todo o conteúdo intermediário adicionado ao fragmento de conteúdo será localizado dentro desses parsys.

No repositório, o conteúdo intermediário é armazenado em relação à sua posição dentro da estrutura geral do parágrafo, ou seja, não é anexado ao conteúdo real do parágrafo.

Para ilustrar isto, consideremos que temos:

• Uma instância de um fragmento de conteúdo composto de três parágrafos

• E que algum conteúdo já foi inserido após o segundo parágrafo

  • Isso significa que o conteúdo será armazenado no segundo parsys.

Basicamente, se a estrutura de parágrafo dessa instância mudar (alterando a variação, o elemento ou o intervalo de parágrafos exibidos), isso pode afetar o conteúdo intermediário exibido quando o conteúdo do fragmento do conteúdo:

• É editado e outro parágrafo é adicionado antes do segundo parágrafo:

  • O conteúdo intermediário será exibido após o parágrafo recém-criado (o segundo parágrafo agora contém o parágrafo recém-criado).

• É editado e o segundo parágrafo é removido:

  • O conteúdo intermediário será exibido após o parágrafo anterior ao terceiro (o segundo parsys agora contém o terceiro parágrafo anterior).

• Está configurado de modo que somente o primeiro parágrafo seja exibido:

  • O conteúdo intermediário não será exibido (o segundo parsys não é mais renderizado devido à nova configuração).

Personalização do componente de fragmento de conteúdo

Para usar o componente de fragmento de conteúdo pronto para uso como um modelo de extensão, você deve respeitar o seguinte contrato:

• Reutilize o script de renderização HTL e seu POJO associado para ver como o recurso de conteúdo intermediário é implementado.

• Reutilize o nó do fragmento do conteúdo: cq:editConfig

  • Os ouvintes afterinsert/ afteredit/ afterdelete são usados para disparar eventos JS. Esses eventos serão manipulados na biblioteca do cliente cq.authoring.editor.plugin.cfm para exibir o conteúdo associado no painel lateral.
  • Os cq:dropTargets estão configurados para suportar arrastar ativos de fragmento de conteúdo.
  • cq:inplaceEditing está configurado para suportar a criação de um fragmento de conteúdo no editor de páginas. O editor local do fragmento é definido na biblioteca do cliente cq.authoring.editor.plugin.cfm e permite que um link rápido abra o elemento/variação atual no editor de fragmentos.

Regravação de ativos antes de renderizar

O Gerenciamento de fragmentos de conteúdo usa um processo de renderização interno para gerar a saída HTML final para uma página. Isso é usado internamente pelo componente Fragmento do conteúdo, mas também pelo processo em segundo plano que atualiza os fragmentos referenciados nas páginas de referência.

Internamente, o Sling Rewriter é usado para essa renderização. A respectiva configuração é encontrada em /libs/dam/config/rewriter/cfm e pode ser ajustada se necessário. Consulte Apache Sling Rewriter para obter mais informações.

A configuração predefinida usa os seguintes transformadores:

• transformer-cfm-payloadfilter - para recuperar a body parte ( <body>...</body>) somente do HTML do fragmento

• transformer-cfm-parfilter - filtros parágrafos indesejados se um intervalo de parágrafo for especificado (como pode ser feito com o componente Fragmento do conteúdo)

• transformer-cfm-assetprocessor - é usado internamente para recuperar uma lista dos ativos incorporados ao fragmento

O processo de renderização é exposto por meio de [com.adobe.cq.dam.cfm.content.FragmentRenderService](https://helpx.adobe.com/experience-manager/6-4/sites/developing/using/reference-materials/javadoc/com/adobe/cq/dam/cfm/ContentFragment.html) e pode ser aproveitado (por exemplo) pelos componentes personalizados, se necessário.