Como adicionar uma imagem dinâmica a uma notificação por push

Estimado 3 minuto de leitura
|
Atualizado 10 de out. de 2024, 12:22 EST
O que você vai aprender

O que você vai aprender

Saiba como adicionar uma imagem dinâmica a uma notificação por push. 

As imagens dinâmicas são uma ótima maneira de personalizar suas notificações push. Por exemplo, o senhor pode mostrar a alguém o produto exato que ele favoritou, com o qual iniciou um checkout ou comprou.

Antes de começar

Antes de começar

O senhor pode usar imagens dinâmicas em:

  • Fluxos acionados por métricas, usando dados de eventos (por exemplo, itens de um checkout ou pedido feito) ou tags de catálogo para um evento. 
  • Campanhas e fluxos acionados por listas e segmentos, mas somente quando o URL da imagem existir como uma propriedade personalizada no perfil do destinatário.

Além disso, observe o seguinte com relação às imagens dinâmicas de envio: 

  • É permitida apenas uma imagem dinâmica por notificação push.
  • As imagens devem ter menos de 1 MB.
  • O senhor pode usar instruções condicionais com imagens dinâmicas.

Deseja solicitar um recurso para as notificações push do Klaviyo? Preencha este formulário do Google para nos contar sobre isso! 

Adicionar uma imagem dinâmica a uma notificação por push

Adicionar uma imagem dinâmica a uma notificação por push

  1. Selecione a mensagem na qual deseja incluir a imagem dinâmica.
  2. Na barra lateral esquerda, clique em Configure Content (Configurar conteúdo ) ou Edit (Editar).
  3. Adicione ou selecione a notificação por push no fluxo. 
  4. Clique no ícone Exibir detalhes no canto superior direito.

    Ícone View Details na janela de visualização do push

  5. Encontre a fonte de dados da imagem que o senhor deseja incluir.
  6. Clique na fonte de dados da primeira variável de uma imagem, que normalmente termina em 0.

    Exemplo de como a fonte de dados se parece com uma imagem

  7. À esquerda, clique no ícone Inserir mídia na caixa Corpo.

    Adicionar mídia ao push.jpg

  8. Vá para a guia Dynamic Image (Imagem dinâmica ).
  9. Cole a variável dinâmica ou o URL dinâmico da imagem.

    Guia Dynamic Image após colar em uma variável de exemplo

  10. Clique em Salvar.
  11. Verifique se a imagem dinâmica foi adicionada corretamente, certificando-se de que ela apareça na tela de visualização.
Exemplo de uso de tags de catálogo 

O senhor também pode usar tags de catálogo para adicionar imagens dinâmicas em uma notificação push avançada. Para isso: 

  1. Acesse Analytics > Metrics
  2. Selecione a métrica que deseja usar (por exemplo, Ordered Product). 
  3. Clique em Details (Detalhes ) para um evento específico.
  4. Encontre a SKU ou a etiqueta de identificação do produto.
  5. Copie o rótulo da tag (exceto qualquer parêntese ou dois pontos) para que o senhor tenha a ortografia e a capitalização exatas.
    No exemplo abaixo, copiamos "ProductID."

    image5.png

  6. Cole isso em algum lugar que o senhor não possa perder. 
  7. Navegue até um fluxo acionado pela mesma métrica que o senhor acabou de selecionar. 
  8. Selecione a notificação por push na qual deseja incluir sua imagem dinâmica.
  9. Na barra lateral esquerda, clique em Configure Content (Configurar conteúdo ) ou Edit (Editar).
  10. À esquerda, clique no ícone Inserir mídia na caixa Corpo.

    Adicionar mídia ao push.jpg

  11. Vá para a guia Dynamic Image (Imagem dinâmica ).
  12. Cole a seguinte tag de catálogo:
    {% catalog event.id %} {{catalog_item.featured_image.thumbnail.src}} {% endcatalog %}
  13. Substitua id em {% catalog event.id %} pelo rótulo que o senhor copiou anteriormente.
    Exemplo: {% catalog event.ProductID %} {{catalog_item.featured_image.thumbnail.src}} {% endcatalog %}
  14. Clique em Salvar
Exemplo de uso de instruções condicionais para imagens dinâmicas

As imagens dinâmicas podem usar instruções condicionais. 

Abaixo está um exemplo de uma instrução if/else para dizer que, se houver uma imagem variante, mostre-a aos destinatários; caso contrário, use a imagem padrão:

{% if event.extra.line_items.0.product.variant.images.0.src %}{{ event.extra.line_items.0.product.variant.images.0.src }}{% else %}{{ event.extra.line_items.0.product.images.0.src }}{% endif %}

Observe que o formato exato dessas declarações depende da sua integração, e o senhor não deve copiá-las de modelos de e-mail.

Recursos adicionais

Recursos adicionais

Esse artigo foi útil?
Use esse formulário somente para fazer comentários sobre artigos. Saiba como entrar em contato com o suporte.

Saiba mais sobre a Klaviyo

Comunidade
Conecte-se com colegas, parceiros e especialistas da Klaviyo para encontrar inspiração, compartilhar percepções e obter respostas para todas as suas perguntas.
Treinamentos ao vivo
Participe de uma sessão ao vivo com especialistas da Klaviyo para aprender sobre as práticas recomendadas, como configurar os principais recursos e muito mais.
Suporte

Acesse o suporte por meio da sua conta.

Suporte por e-mail (teste gratuito e contas pagas) Disponível 24 horas

Chat/assistência virtual
A disponibilidade varia conforme o local e o tipo de plano