[Integração]{class="badge positive"}
Personalization usando o Visual Experience Composer
[AEM Sites 6.5]{class="badge informative"}
Neste capítulo, exploraremos a criação de experiências usando o Visual Experience Composer arrastando e soltando, alternando e modificando o layout e o conteúdo de uma página da Web no Target.
Visão geral do cenário
A página inicial do site WKND exibe atividades locais ou a melhor coisa a ser feita em torno de uma cidade na forma de layouts de cartão. Como profissional de marketing, você recebeu a tarefa de modificar a página inicial, reorganizando os layouts do cartão para ver como isso afeta o engajamento do usuário e impulsiona a conversão.
Usuários envolvidos
Para este exercício, os seguintes usuários precisam estar envolvidos e, para executar algumas tarefas, você pode precisar de acesso administrativo.
- Produtor/Editor de Conteúdo (Adobe Experience Manager)
- Profissional de marketing (Adobe Target/Equipe de otimização)
Página inicial do site WKND
Pré-requisitos
-
AEM
- Instância de publicação do AEM em execução no 4503
- AEM integrado ao Adobe Target usando tags
-
Experience Cloud
- Acesso à Adobe Experience Cloud de suas organizações -
https://<yourcompany>.experiencecloud.adobe.com - Experience Cloud provisionado com Adobe Target
- Acesso à Adobe Experience Cloud de suas organizações -
Atividades do profissional de marketing
-
O profissional de marketing cria uma atividade de público-alvo A/B no Adobe Target.
-
Na janela do Adobe Target, navegue até a guia Atividades.
-
Clique no botão Criar atividade e selecione o tipo de atividade como Teste A/B
-
Selecione o canal Web e escolha o Visual Experience Composer.
-
Insira o URL da atividade e clique em Avançar para abrir o Visual Experience Composer.
-
Para o Visual Experience Composer carregar, habilite o Permitir carregamento de scripts não seguros no navegador e recarregue a página.
-
Observe que a página inicial do site WKND é aberta no editor do Visual Experience Composer.
-
A Experiência A fornece a Página Inicial WKND padrão e vamos editar o layout de conteúdo para a Experiência B.
-
Clique em um dos contêineres de layout do cartão (Melhores Roasters) e selecione a opção Reorganizar.
-
Clique no contêiner que você deseja reorganizar e arraste-o e solte-o no local desejado. Vamos reorganizar o contêiner Melhores Roasters da primeira linha, primeira coluna, para a primeira linha, terceira coluna. Agora o contêiner Melhores assadores está ao lado do contêiner Exposições de Fotografia.
Após a troca
-
Da mesma forma, reorganize as posições para os outros contêineres de cartão.
-
Também vamos adicionar um texto de cabeçalho abaixo do componente Carrossel e acima do layout do cartão.
-
Clique no contêiner do carrossel e selecione a opção Inserir após > HTML para adicionar HTML.
code language-html <h1 style="text-align:center">Check Out the Hot Spots in Town</h1>
-
Clique em Avançar para continuar com sua atividade.
-
Selecione o Método de Alocação de Tráfego como manual e aloque 100% de tráfego para a Experiência B.
-
Clique em Avançar.
-
Forneça as Métricas de meta para sua Atividade e Salve e Feche o Teste A/B.
-
Forneça um nome (Atualização da Página Inicial do WKND) para a Atividade e salve as alterações.
-
Na tela Detalhes da atividade, Ative sua atividade.
-
Navegue até a página inicial da WKND (http://localhost:4503/content/wknd/en.html) e observe as alterações que adicionamos à atividade Atualização de página inicial A/B de teste WKND.
-
Abra o console do navegador e inspecione a guia de rede para procurar a resposta do público-alvo para a atividade de Atualização de página inicial A/B de WKND.
-
Resumo
Neste capítulo, um profissional de marketing conseguiu criar uma experiência usando o Visual Experience Composer arrastando e soltando, alternando e modificando o layout e o conteúdo de uma página da Web sem alterar nenhum código para executar um teste.