Habilidade dos fragmentos de conteúdo visual para imagem figma-to-visual-content-fragments-skill
Os Fragmentos de conteúdo visual no Adobe Experience Manager (AEM) permitem visualizar e entregar Fragmentos de conteúdo usando um layout definido em um modelo de visualização. Esses modelos são baseados em um modelo HTML usando Handlebars.
Embora a definição de informações de estilo e layout em modelos HTML codificados manualmente seja totalmente viável, é um processo altamente técnico que geralmente é executado por desenvolvedores da Web. Como os designs visuais para experiências modulares são frequentemente criados no Figma, é possível simplificar esse processo para Fragmentos de conteúdo visual importando designs diretamente do Figma para o AEM.
Para obter mais detalhes, consulte:
Pré-requisitos prerequisites
Antes de começar:
-
A importação do Figma requer autenticação.
- O usuário do Figma precisa criar um token de acesso no Figma e armazená-lo no serviço do AEM.
Isso é feito:
- Gerar um token pessoal no Figma
- Fazendo logon no Adobe Experience Manager as a Cloud Service em https://experience.adobe.com
- Persistindo no token em https://experience.adobe.com/#/aem/figmatocontentfragment
Para criar um fragmento visual do conteúdo do Figma to-create-a-visual-content-fragment-from-figma
O fluxo é o seguinte:
-
Crie um design no Figma.
-
Crie um link de compartilhamento para o objeto de design no Figma.
-
No AEM, o usuário do AEM pode começar com um prompt inicial para usar o Coworker para recriar o design aprovado no AEM. O AEM criará automaticamente os modelos de fragmento de conteúdo, fragmentos de conteúdo e modelos do HTML necessários.
-
Quando necessário, a habilidade solicitará mais informações, como o ambiente do AEM a ser usado.
-
O processo de criação também inclui recursos que permitem reutilizar modelos ou fragmentos de conteúdo existentes quando já estão disponíveis.
-
-
A habilidade gera um fragmento de conteúdo e um modelo de fragmento de conteúdo para o conteúdo, além de um modelo de HTML para o layout e design.
- A habilidade fornece um link direto para o fragmento, de onde você pode acessar o modelo e o modelo.
Exemplos de Prompts sample-prompts
Exemplos de prompts incluem:
-
Para importar do Figma:
- Importar do Figma {Figma_share_URL} para o AEM
-
Para importar do Figma e especificar o programa AEM:
- Importar do Figma {Figma_share_URL} para o {AEMaaCS_program/environment_link}