Configurar o Adobe Target com o SDK da Web da plataforma

Saiba como implementar o Adobe Target usando o SDK da web da Adobe Experience Platform. Saiba como fornecer experiências e transmitir parâmetros adicionais para o Target.

O Adobe Target é o aplicativo da Adobe Experience Cloud que oferece tudo o que você precisa para ajustar e personalizar a experiência do cliente e maximizar a receita em sites da Web e móveis, aplicativos e outros canais digitais.

Objetivos de aprendizagem

No final desta lição, você poderá fazer o seguinte com uma implementação do SDK da Web do Target:

Pré-requisitos

Para concluir as lições desta seção, primeiro você deve:

Adicionar tratamento de cintilação

Antes de iniciar, determine se é necessária uma solução extra de tratamento de cintilação, dependendo de como a biblioteca de tags é carregada.

Implementação assíncrona

Quando uma biblioteca de tags é carregada de forma assíncrona, a página pode terminar a renderização antes que o Target substitua o conteúdo padrão pelo conteúdo personalizado. Esse comportamento pode levar ao que é conhecido como "oscilação", onde o conteúdo padrão é exibido brevemente antes de ser substituído pelo conteúdo personalizado. Caso deseje evitar essa oscilação, o Adobe recomenda adicionar um trecho especial de pré-ocultação imediatamente antes do código incorporado da tag assíncrona.

Este trecho já está presente no site Luma, mas vamos examinar mais de perto para entender o que esse código faz:

<script>
  !function(e,a,n,t){var i=e.head;if(i){
  if (a) return;
  var o=e.createElement("style");
  o.id="alloy-prehiding",o.innerText=n,i.appendChild(o),setTimeout(function(){o.parentNode&&o.parentNode.removeChild(o)},t)}}
  (document, document.location.href.indexOf("adobe_authoring_enabled") !== -1, ".personalization-container { opacity: 0 !important }", 3000);
</script>

O trecho pré-ocultação cria uma tag de estilo no cabeçalho da página com a definição CSS de sua escolha. Essa tag de estilo é removida quando uma resposta do Target é recebida ou o tempo limite é atingido.

O comportamento de pré-ocultação é controlado por duas configurações no final do trecho.

O trecho de pré-ocultação também está disponível nas tags:

Implementação síncrona

O Adobe recomenda implementar tags de forma assíncrona, conforme demonstrado no site Luma. No entanto, se a biblioteca de tags for carregada de forma síncrona, o trecho pré-ocultação não será necessário. Em vez disso, o estilo de pré-ocultação é especificado nas configurações de extensão do SDK da Web da Platform.

O estilo de pré-ocultação para implementações síncronas pode ser configurado da seguinte maneira:

Para saber mais sobre como o SDK da Web da Platform pode gerenciar a cintilação, consulte a seção do guia: gerenciamento de cintilação para experiências personalizadas.

Configurar o fluxo de dados

O Target deve ser ativado na configuração da sequência de dados para que qualquer atividade do Target possa ser entregue pelo SDK da Web da plataforma.

Para configurar o Target na sequência de dados:

Token de propriedade

Os clientes do Target Premium têm a opção de gerenciar permissões de usuário com propriedades. As propriedades do Target permitem que você estabeleça limites em torno de onde os usuários podem executar atividades do Target. Consulte a seção Permissões empresariais da documentação do Target para obter detalhes.

Para configurar ou localizar tokens de propriedade, navegue até Adobe Target > Administração > Propriedades. O ícone </> exibe o código de implementação. O valor at_property é o token de propriedade que você usaria na sequência de dados.

Somente um token de propriedade pode ser especificado por sequência de dados, mas as substituições de token de propriedade permitem que você especifique tokens de propriedade alternativos para substituir o token de propriedade primária definido na sequência de dados. Uma atualização para a ação sendEvent também é necessária para substituir a sequência de dados.

ID do ambiente de destino

Ambientes no Target ajudam a gerenciar a implementação em todos os estágios de desenvolvimento. Essa configuração opcional especifica qual ambiente do Target você usará com cada fluxo de dados.

A Adobe recomenda definir a ID de ambiente do Target de forma diferente para cada um dos fluxos de dados de desenvolvimento, preparo e produção para simplificar as coisas. Como alternativa, você pode organizar seus ambientes na interface do Target usando o recurso hosts.

Para configurar ou localizar IDs de Ambiente, navegue até Adobe Target > Administração > Ambientes.

Namespace de ID de terceiros do Target

Essa configuração opcional permite especificar qual símbolo de identidade usar para a ID de terceiros do Target. O Target só oferece suporte à sincronização de perfis em um único símbolo de identidade ou namespace. Para obter mais informações, consulte a seção Sincronização de perfil em tempo real para mbox3rdPartyId do guia do Target.

Os Símbolos de Identidade foram encontrados na lista de identidades em Coleção de Dados > Cliente > Identidades.

Para os propósitos deste tutorial usando o site Luma, use o Símbolo de Identidade lumaCrmId configurado durante a lição sobre Identidades.

Renderizar decisões de personalização visual

As decisões de personalização visual se referem às experiências criadas no Visual Experience Composer do Adobe Target. Primeiro, você deve entender a terminologia usada nas interfaces do Target e das tags:

Atualizar a ação Enviar evento

As decisões de personalização visual do Target são entregues pelo SDK da Web da plataforma, se o Target estiver ativado na sequência de dados. No entanto, eles não são renderizados automaticamente. Você deve atualizar a ação Enviar evento para habilitar a renderização automática.

A configuração de renderizar decisões de personalização visual faz com que o SDK da Web da Platform aplique automaticamente quaisquer modificações que tenham sido especificadas usando o Visual Experience Composer do Target ou "mbox global".

Se preferir renderizar ou executar ações nessas decisões usando o código personalizado, você pode deixar a configuração Renderizar decisões de personalização visual desabilitada. O SDK da Web da Platform é flexível e fornece esse recurso para fornecer controle total. Consulte o manual para obter mais informações sobre renderização manual de conteúdo personalizado.

Configurar uma atividade do Target com o Visual Experience Composer

Agora que a parte de implementação básica foi concluída, crie uma atividade de Direcionamento de experiência (XT) no Target para validar se tudo está funcionando corretamente. Você pode consultar o tutorial do Target para criação de atividades de Direcionamento de experiência se precisar de ajuda.

Validar com o Debugger

Se você configurar uma atividade, verá seu conteúdo renderizado na página. No entanto, mesmo se nenhuma atividade estiver ativa, você também pode examinar a chamada de rede Enviar evento para confirmar se o Target está configurado corretamente.

Configurar e renderizar um escopo de decisão personalizado

Escopos de decisão personalizados (conhecidos formalmente como "mboxes") podem ser usados para fornecer conteúdo em HTML ou JSON de maneira estruturada usando o Experience Composer baseado em formulário do Target. O conteúdo entregue a um desses escopos personalizados não é renderizado automaticamente pelo SDK da Web da Platform. Ele pode ser renderizado usando uma ação em Tags.

Adicionar um escopo à ação Enviar evento

Modifique sua regra de carregamento de página para adicionar um escopo de decisão personalizado:

Processar a resposta do Target

Agora que você configurou o SDK da Web da Platform para solicitar conteúdo para o escopo homepage-hero, é necessário fazer algo com a resposta. A extensão de marca SDK da Web da Platform fornece um evento Enviar evento concluído, que pode ser usado para acionar imediatamente uma nova regra quando uma resposta de uma ação Enviar evento for recebida.

Configurar uma atividade do Target com o Experience Composer baseado em formulário

Agora que você tem uma regra para renderizar manualmente um escopo de decisão personalizado, pode criar outra atividade de Direcionamento de experiência (XT) no Target. Desta vez, use o Experience Composer baseado em formulário.

Validar com o Debugger

Se você ativou sua atividade, deve ver a renderização do conteúdo na página. No entanto, mesmo se nenhuma atividade estiver ativa, você também pode consultar a chamada de rede Enviar Evento para confirmar se o Target está solicitando conteúdo para seus escopos personalizados.

Enviar parâmetros para o Target

Nesta seção, você passará dados específicos do Target e examinará em mais detalhes como os dados XDM são mapeados para parâmetros do Target.

Parâmetros de página (mbox) e XDM

Todos os campos XDM são automaticamente passados para o Target como parâmetros de página ou parâmetros de mbox.

Alguns desses campos XDM serão mapeados para objetos especiais no back-end do Target. Por exemplo, o web.webPageDetails.URL estará automaticamente disponível para criar condições de direcionamento baseadas em URL ou como o objeto page.url ao criar scripts de perfil.

Você também pode adicionar parâmetros de página usando o objeto de dados.

Parâmetros especiais e o objeto de dados

Há alguns pontos de dados que podem ser úteis para o Target que não são mapeados a partir do objeto XDM. Estes parâmetros especiais do Target incluem:

Esses parâmetros devem ser enviados no objeto data em vez de no objeto xdm. Além disso, os parâmetros de página (ou mbox) também podem ser incluídos no objeto data.

Para preencher o objeto de dados, crie o seguinte elemento de dados, reutilizando elementos de dados criados na lição Criar elementos de dados:

Atualizar a regra de carregamento da página

Transmitir dados adicionais para o Target fora do objeto XDM requer a atualização de todas as regras aplicáveis. Para este exemplo, a única modificação que você deve fazer é incluir o novo elemento de dados data.content na regra de carregamento de página genérica e na regra de exibição de página do produto.

Divisão de solicitações do Personalization e do Analytics

A camada de dados no site Luma é completamente definida antes do código incorporado das tags. Isso nos permite usar uma única chamada para buscar conteúdo personalizado (por exemplo, do Adobe Target) e enviar dados de análise (por exemplo, para o Adobe Analytics).

No entanto, em muitos sites, a camada de dados não pode ser carregada com antecedência suficiente ou rapidez suficiente para usar uma única chamada para ambos os aplicativos. Nessas situações, você pode usar duas ações Enviar evento em um único carregamento de página e usar a primeira para personalização e a segunda para análise. Separar os eventos dessa maneira permite que o evento de personalização seja acionado o mais rápido possível, enquanto aguarda que a camada de dados seja carregada completamente antes de enviar o evento do Analytics. Isso é semelhante a muitas implementações do SDK pré-Web, em que o Adobe Target acionaria o target-global-mbox na parte superior da página e o Adobe Analytics acionaria a chamada s.t() na parte inferior da página

Para criar a solicitação de personalização integrada:

Para criar a solicitação do Analytics na parte inferior:

Validar com o Debugger

Agora que as regras foram atualizadas, é possível validar se os dados estão sendo transmitidos corretamente usando o Adobe Debugger.

Validar na interface do Target

Em seguida, examine a interface do Target para confirmar se os dados foram recebidos e estão disponíveis para uso em públicos-alvo e atividades. Os dados do XDM são mapeados automaticamente para parâmetros do Target personalizados. Você pode validar se os dados XDM foram recebidos pelo Target e estão disponíveis ao criar um público-alvo.

Em seguida, valide se o atributo de perfil de estado de logon foi passado com êxito.

Se você tiver o Target Premium, também poderá validar se os dados da entidade foram passados corretamente e se os dados do produto foram gravados no catálogo de produtos da Recommendations.

Validar com garantia

Além disso, você pode usar o Assurance onde for apropriado para confirmar se as solicitações de decisão do Target estão obtendo os dados corretos e se qualquer transformação do lado do servidor está ocorrendo corretamente. Você também pode confirmar se as informações de campanha e experiência estão contidas nas chamadas do Adobe Analytics, mesmo quando as chamadas de decisão e do Adobe Analytics do Target são enviadas separadamente.

Isso confirma que as informações do A4T que estavam na fila para transmissão posterior quando fizemos a chamada do Target Decisioning foram enviadas corretamente quando a chamada de rastreamento do Analytics foi acionada posteriormente na página.

Agora que concluiu esta lição, você deve ter uma implementação funcional do Adobe Target usando o SDK da Web da plataforma.

Próximo: