Configuração da integração padrão da Shopify

Esta página orienta você sobre como integrar a Braze à Shopify usando nossa integração padrão para usuários com uma loja on-line da Shopify. Se você usa um site headless da Shopify ou está procurando implementar soluções mais personalizadas, consulte a configuração de integração personalizada da Shopify.

Etapa 1: Conectar sua loja Shopify

1. Na Braze, acesse Integrações de parceiros > Parceiros de tecnologia e pesquise “Shopify”.
2. Na página de parceiro do Shopify, selecione Iniciar configuração para começar o processo de integração.
   
   
   
   
3. Na loja de apps do Shopify, instale o aplicativo da Braze.
   
   

Nota

Se a sua conta do Shopify estiver associada a mais de uma loja, você pode trocar a loja em que está conectado selecionando o ícone da loja no cabeçalho e selecionando Trocar de loja.

4. Após instalar o app da Braze, você será redirecionado para a Braze para confirmar o espaço de trabalho que deseja conectar ao Shopify. Uma loja Shopify pode se conectar a apenas um espaço de trabalho. Se precisar trocar, selecione o espaço de trabalho correto.
   
   

5. Selecione Iniciar configuração.
   
   

Etapa 2: Ativar os SDKs web da Braze

Para lojas online do Shopify, você pode selecionar a configuração padrão para implementar automaticamente o SDK web da Braze e o SDK JavaScript.

Depois de selecionar o caminho de integração com configuração padrão, você precisará escolher quando a Braze deve inicializar e carregar os SDKs entre as seguintes opções:

• Ao visitar o site, como no início da sessão
  • Rastreia tanto usuários identificados quanto anônimos
• Ao criar uma conta, como no login da conta
  • Rastreia apenas usuários identificados
  • Começa a rastrear dados quando os visitantes do site se inscrevem ou fazem login em suas contas

Nota

Novos clientes são provisionados com as versões mais recentes do SDK web da Braze e do SDK JavaScript durante a configuração. Clientes existentes podem visualizar a versão atual do SDK nas configurações de integração, receber notificações quando uma versão mais recente estiver disponível e fazer upgrade por conta própria nas configurações de integração.

Etapa 3: Configure seus dados do Shopify

Configuração de dados padrão

Importante

Para esta integração, o alias de usuário deve usar o seguinte formato para que a Braze possa associar os webhooks ao perfil de usuário correto:

• alias_label: shopify_cart_${cartToken}
• alias_name: shopify_cart_token

Agora você vai selecionar os dados do Shopify que deseja rastrear.

Os seguintes eventos serão ativados por padrão na integração padrão.

Para saber mais sobre os dados rastreados por meio da integração, consulte Recursos de dados do Shopify.

Importante

A integração do Shopify oferece suporte a webhooks de criação e atualização de clientes do Shopify, que estão localizados nas suas configurações de dados. Quando um perfil de usuário é criado ou atualizado no Shopify, um perfil de usuário correspondente na Braze será criado ou atualizado.

Essas ações não disparam eventos personalizados na Braze e são usadas exclusivamente para sincronizar dados de usuários do Shopify com a Braze. Os dados sincronizados incluem atributos personalizados, atributos padrão e, se ativado na sua configuração, estados de grupo de inscrições.

Configuração de preenchimento de dados históricos

Na etapa Track Shopify data, marque a caixa de seleção para incluir o carregamento inicial de dados históricos como parte da sua integração.

Para saber o que é importado, o comportamento de relatórios de receita, capturas de tela de configuração e orientações caso você já use a Braze com Campaigns ou Canvas ativos, consulte Preenchimento de dados históricos.

(Avançado) Configuração de rastreamento de dados personalizados

Com os SDKs da Braze, você pode rastrear eventos personalizados ou atributos personalizados que vão além dos eventos padrão desta integração. Eventos personalizados capturam interações exclusivas na sua loja, como:

O rastreamento de dados personalizados fornece insights mais profundos sobre o comportamento do usuário e oferece suporte a personalizações adicionais. Para implementar eventos personalizados, você precisa editar o código do tema da sua loja virtual no arquivo theme.liquid. Talvez seja necessário pedir ajuda aos seus desenvolvedores.

Por exemplo, o snippet JavaScript a seguir verifica se o usuário atual se inscreveu em uma newsletter e registra isso como um evento personalizado no perfil dele na Braze:

1
2
3
4
5
6
7
8
9

braze.logCustomEvent(
  “subscribed_to_newsletter”,
  {
    newsletterName: ‘News and Offers’,
    customerEmail: ‘customer_1@example.com’,
    sendOffers: true
  }
);

O SDK precisa estar inicializado (escutando por atividade) no dispositivo do usuário para registrar eventos ou atributos personalizados. Para saber mais sobre o registro de dados personalizados, consulte Objeto User e Objeto logCustomEvent.

Etapa 4: Configurar como gerenciar usuários

Selecione seu tipo de external_id no menu suspenso.

Importante

Usar um endereço de e-mail ou um endereço de e-mail com hash como seu ID externo da Braze pode simplificar o gerenciamento de identidade nas suas fontes de dados. No entanto, é importante considerar os possíveis riscos à privacidade do usuário e à segurança dos dados.

• Informações que podem ser adivinhadas: Os endereços de e-mail são facilmente adivinháveis, o que os torna vulneráveis a ataques.
• Risco de exploração: Se um usuário mal-intencionado alterar seu navegador da web para enviar o endereço de e-mail de outra pessoa como seu ID externo, ele poderá acessar mensagens confidenciais ou informações de conta.

Por padrão, a Braze converte automaticamente os e-mails da Shopify em letras minúsculas antes de usá-los como ID externo. Se estiver usando e-mail ou e-mail com hash como ID externo, confirme se os endereços de e-mail também foram convertidos em letras minúsculas antes de atribuí-los como ID externo ou antes de fazer o hash a partir de outras fontes de dados. Isso ajuda a evitar discrepâncias nos IDs externos e a criação de perfis de usuário duplicados na Braze.

Nota

As próximas etapas dependem da seleção do seu ID externo:

• Se você selecionou um tipo de ID externo personalizado: Conclua as etapas 4.1—4.3 para definir sua configuração de ID externo personalizado.
• Se você selecionou o ID do cliente da Shopify, e-mail ou e-mail com hash: Pule as etapas 4.1—4.3 e vá diretamente para a etapa 4.4.

Etapa 4.1: Criar o metacampo braze.external_id

1. No painel de administração da Shopify, acesse Settings > Metafields and metaobjects.
2. Selecione Customers > Add definition.
3. Em Name, digite braze.external_id.
4. Selecione o namespace e a chave gerados automaticamente (custom.braze_external_id) para editá-los e alterá-los para braze.external_id.
5. Em Type, selecione ID Type.

Depois que o metacampo for criado, preencha-o para seus clientes. Recomendamos as seguintes abordagens:

• Ouça os webhooks de criação de clientes: Configure um webhook para ouvir os eventos do customer/create. Isso permite que você escreva o metacampo quando um novo cliente é criado.
• Preencha os clientes existentes: Use a Admin API ou a Customer API para preencher o metacampo de clientes criados anteriormente.

Possível condição de corrida

O webhook customers/create da Shopify pode ser disparado antes que o metacampo braze.external_id seja gravado no perfil do usuário. Quando isso acontece:

1. Se o metacampo estiver ausente, a Braze chama o endpoint configurado (Etapa 4.2) para buscar o ID externo.
2. Se essa chamada também falhar ou atingir o tempo limite, a Braze cria um perfil de usuário temporário com o ID do cliente da Shopify como ID externo.
3. Em qualquer evento subsequente em que o metacampo esteja presente (como customers/update ou orders/create para um evento ecommerce.order_placed), a Braze detecta automaticamente a incompatibilidade e mescla o perfil temporário com o ID externo correto.

Isso significa que perfis duplicados temporários são possíveis, mas se corrigem automaticamente. Você não precisa tomar nenhuma ação manual para mesclar esses perfis.

Etapa 4.2: Crie um endpoint para recuperar seu ID externo

Você deve criar um endpoint público que a Braze possa chamar para recuperar o ID externo. Isso permite que a Braze busque o ID em cenários em que a Shopify não pode fornecer o metacampo braze.external_id diretamente.

Especificações do endpoint

Método: GET

A Braze envia os seguintes parâmetros para seu endpoint:

Exemplo de endpoint

1

GET https://mystore.com/custom_id?shopify_customer_id=1234&[email protected]&shopify_storefront=dev-store.myshopify.com

Resposta esperada

A Braze espera um código de status 200 retornando o JSON do ID externo:

1
2
3

{
  "external_id": "my_external_id"
}

Validação

É fundamental validar se o shopify_customer_id e o email_address (se houver) correspondem aos valores do cliente na Shopify. Você pode usar a API do Shopify Admin ou a API do cliente para validar esses parâmetros e recuperar o metacampo braze.external_id correto.

Comportamento de falha e mesclagem

Qualquer código de status diferente de 200 é considerado uma falha.

• Implicações da mesclagem: Se o endpoint falhar (retornar algo diferente de 200 ou expirar), a Braze não consegue recuperar o ID externo. Consequentemente, a mesclagem entre o usuário do Shopify e o perfil de usuário da Braze não acontece naquele momento.
• Lógica de nova tentativa: A Braze pode tentar novas tentativas de rede imediatas padrão, mas se a falha persistir, a mesclagem é adiada até o próximo evento qualificado (por exemplo, a próxima vez que o usuário atualizar seu perfil ou concluir um checkout).
• Suportabilidade: Para garantir a mesclagem de usuários em tempo hábil, certifique-se de que seu endpoint esteja altamente disponível e lide com o campo opcional email_address de forma adequada.

Etapa 4.3: Insira seu ID externo

Repita a Etapa 4 e insira a URL do endpoint depois de selecionar ID externo personalizado como o tipo de ID externo da Braze.

Considerações

• Se o seu ID externo não for gerado quando a Braze enviar uma solicitação ao seu endpoint, a integração usará por padrão o ID de cliente do Shopify quando a função changeUser for chamada. Essa etapa é crucial para mesclar o perfil de usuário anônimo com o perfil de usuário identificado. Como resultado, pode haver um período temporário durante o qual diferentes tipos de IDs externos existem no seu espaço de trabalho.
• Quando o ID externo estiver disponível no metafield braze.external_id, a integração priorizará e atribuirá esse ID externo.
  • Se o ID de cliente do Shopify foi definido anteriormente como o ID externo da Braze, ele será substituído pelo valor do metafield braze.external_id.

Etapa 4.4: Colete suas aceitações de e-mail ou SMS da Shopify (opcional)

Você tem a opção de coletar suas aceitações de marketing por e-mail ou SMS da Shopify.

Se você usar os canais de e-mail ou SMS, poderá sincronizar seus estados de aceitação de marketing por e-mail e SMS na Braze. Se você sincronizar as aceitações de e-mail marketing da Shopify, a Braze criará automaticamente um grupo de inscrições para e-mail para todos os usuários associados a essa loja específica. Você precisa criar um nome exclusivo para esse grupo de inscrições.

Nota

Conforme mencionado na visão geral do Shopify, se você quiser usar um formulário de captura de terceiros, seus desenvolvedores precisarão integrar o código do SDK da Braze. Isso permitirá capturar o endereço de e-mail e o status global de inscrição de e-mail a partir dos envios de formulário. Especificamente, você precisa implementar e testar estes métodos no seu arquivo theme.liquid:

• setEmail: Define o endereço de e-mail no perfil de usuário
• setEmailNotificationSubscriptionType: Atualiza o status global de inscrição de e-mail

Etapa 5: Sincronizar produtos (opcional)

Você pode sincronizar todos os produtos da sua loja Shopify em um catálogo da Braze para uma personalização mais aprofundada das mensagens. As atualizações automáticas ocorrem quase em tempo real, para que seu catálogo reflita os detalhes mais recentes dos produtos. Para saber mais, confira Sincronização de produtos do Shopify.

Etapa 6: Ativar canais (opcional)

Para integrações padrão da Shopify, você pode ativar mensagens no app e Banners nas configurações de integração sem desenvolvimento adicional.

• mensagens no app
• banners

Mensagens no app

Na etapa Ativar canais, selecione mensagens no app como parte das suas configurações de integração para ativar casos de uso como formulários de captura de e-mail e SMS, pop-ups promocionais e pesquisas. Para saber como criar uma, consulte In-App Messages.

Nota

A Braze coleta informações de visitantes, como endereços de e-mail e números de telefone, por meio de mensagens no app. Essas informações são enviadas para a Shopify. Esses dados permitem que os comerciantes reconheçam os visitantes de suas lojas e criem uma experiência de compra mais personalizada. Para saber mais, consulte Visitor API.

Banners

Os Banners exibem conteúdo personalizado na vitrine da sua loja Shopify, como promoções, anúncios e ofertas direcionadas.

Importante

Os Banners para a integração padrão do Shopify estão atualmente em acesso antecipado. Entre em contato com seu gerente de conta da Braze se tiver interesse em participar do acesso antecipado.

Importante

Os Banners exigem um tema Shopify Online Store 2.0 e o SDK da Braze versão 6.8.0 ou posterior. Durante a configuração, a Braze verifica se o tema publicado da sua loja é compatível com posicionamentos de banner inline. Temas antigos não oferecem suporte a posicionamentos inline, então Ativar banners e criar posicionamentos de banner está desabilitado em Ativar canais. Para usar Banners, faça upgrade para um tema Online Store 2.0 no administrador da Shopify e depois volte à configuração da integração para ativar os Banners.

Configuração

Selecione Ativar banners e criar posicionamentos de banner em Ativar canais e depois salve.

A Braze cria automaticamente estes posicionamentos de Banner uma vez por espaço de trabalho, compartilhados entre todas as lojas Shopify conectadas:

• Cabeçalho global
• Corpo da página inicial
• Rodapé global
• Banner de informações do produto
• Corpo do produto
• Corpo da coleção
• Corpo do carrinho
• Resumo do carrinho

Nota

Se você conectar várias lojas Shopify e ativar Banners para cada uma, a Braze cria os mesmos oito posicionamentos ao mesmo tempo. Os mesmos IDs de posicionamento podem ser usados em qualquer uma ou em todas as lojas conectadas simultaneamente.

Se os IDs de posicionamento padrão não forem adequados para a sua configuração ou se você quiser usar IDs adicionais, será necessário criar os posicionamentos manualmente. Cada ID de posicionamento deve corresponder ao que está configurado no bloco de app correspondente da Shopify. Se você alterar um ID de posicionamento após o lançamento, atualize o bloco de app para que corresponda, caso contrário o banner deixará de ser renderizado.

Criar um Banner

Crie seu Banner em uma Campaign ou Canvas usando o editor de arrastar e soltar, HTML ou um modelo.

Nota

A prévia do editor da Braze mostra apenas o conteúdo do Banner. Para ver onde o Banner aparece no seu site, faça a prévia no editor de temas da Shopify.

Etapa 1: Adicionar o Banner ao seu tema da Shopify

1. Lance sua Campaign ou Canvas para um público pequeno, como um Segment de teste contendo apenas a sua conta (por exemplo, seu próprio external_id ou device_id), ou um grupo de teste incluído no seu direcionamento. Isso permite verificar o Banner no seu site ativo sem expô-lo aos compradores.
2. No editor de temas da Shopify, abra a página onde você deseja o Banner e selecione Apps > Add Block > Apps > Braze no menu.

3. Nas configurações do bloco de app, insira o placement_id do posicionamento escolhido (por exemplo, global_header) dos seus posicionamentos de Banner.

4. (Opcional) Ajuste a largura do bloco de app (% do contêiner) e adicione uma altura fixa em pixels. Por padrão, a altura máxima se ajusta ao conteúdo do seu banner. Defina uma altura fixa se o seu tema precisar de um espaço limitado, como evitar que um banner alto empurre o conteúdo da página para baixo.

Etapa 2: Testar e lançar

Visite sua loja como um usuário teste para confirmar que o Banner é renderizado no posicionamento correto e aparece conforme esperado. Em seguida, edite o direcionamento da sua Campaign ou Canvas para alcançar seu público completo. Para medir o desempenho, consulte Análise de dados de Banners.

Importante

Atualmente, os Banners não são compatíveis com páginas de agradecimento, status de pedido ou conta do cliente. Se você tiver interesse nesses posicionamentos específicos, faça uma solicitação por meio da sua equipe de conta da Braze.

Content Cards e Feature Flags

Para adicionar Content Cards ou Feature Flags, colabore com seus desenvolvedores para inserir o código necessário do SDK diretamente no arquivo theme.liquid. Para instruções detalhadas, consulte Integração do SDK da Braze.

Notificações web push

Atualmente, web push não é compatível com a integração da Shopify. Se você tem interesse em web push for the Shopify integration, envie feedback de produto.

Etapa 7: Concluir a configuração

1. Após configurar sua instalação, selecione Finish Setup.
2. Ative o app embed da Braze nas configurações do tema do Shopify. Selecione Open Shopify para ser redirecionado à sua conta do Shopify e ativar o app embed nas configurações do tema da sua loja.

3. Após ativar o app embed, sua configuração estará concluída! Confirme que você consegue visualizar as configurações de integração, o status da sincronização inicial de dados e seus eventos ativos do Shopify.