G

M

Fontes de Dados Externos

Trazer dados dinâmicos externos para o html

Visão geral

Integrar fontes de dados externas em modelos de e-mail permite conteúdo altamente personalizado e dinâmico, melhorando o engajamento e a relevância. Este guia irá ajudá-lo a configurar fontes de dados externas e utilizá-las em seus modelos de e-mail.

Fontes de dados externas fornecem conteúdo dinâmico para seus modelos de e-mail ao extrair informações de APIs externas. Isso é útil para:

  • Personalizar conteúdo com base em um feed externo

  • Exibir dados em tempo real, como status de voo de uma API

  • Personalizar links passando parâmetros e recebendo links finais através de uma ferramenta externa

Criar uma fonte de dados externa

  • Navegue até o aplicativo de Marketing e clique em Conteúdo

  • Em Conteúdo, clique em Fontes de dados externas > Criar Fonte de Dados Externa


  • Você pode dar um nome. Isso deve ser uma string contínua sem espaços

  • Dê o link para sua API

  • Defina se deseja que o conteúdo seja atualizado dinamicamente ou se quer atualizar manualmente uma vez adicionado ao e-mail e não deseja que seja atualizado.

  • Você pode optar por não ter autenticação ou definir o tipo de autenticação e também adicionar cabeçalhos


  • Uma vez que você clique em Salvar Configuração, a fonte de dados externa é criada

  • Uma vez criada, você pode testar sua configuração para ver qual saída você obtém clicando em Testar Config conforme mostrado abaixo.

Usando Fontes de Dados Externas em E-mail


Uma vez que sua fonte de dados externa esteja configurada corretamente, você pode usar sua saída no modelo de email usando a linguagem de template liquid.

Usando Fonte de Dados Externa para Alimentação de Conteúdo

Para mostrar uma alimentação de conteúdo, você pode criar uma API que fornece um json com muitos itens da alimentação de conteúdo. Como exemplo, pode parecer como abaixo:

{
  "feed": {
    "version": "1.0",
    "title": "sample-data-feed",
    "items": [
      {
        "title": "Meet the Full Cast",
        "link": "https://bird.com/article",
        "description": "See who's joining previously announced stars Katie Brayben and Christian Borle in the Elton John-Jake Shears-James Graham musical.",
        "thumbnail": "https://assets.bird.com.jpg",
        "date": "2024-08-28T11:21:00",
        "creator": "Joe Black"
      },
      {
        "title": "Stars in ASL American",
        "link": "https://bird.com/article",
        "description": "Center Theatre Group is teaming up with Deaf West Theatre to reopen the Mark Taper Forum with a new production of the Green Day musical after bringing revivals of Big River and Spring Awakening to Broadway.",
        "thumbnail": "https://assets.bird.com.jpg",
        "date": "2024-08-28T11:59:00",
        "creator": "Joe Black"
      }
    ]
  }
}
{
  "feed": {
    "version": "1.0",
    "title": "sample-data-feed",
    "items": [
      {
        "title": "Meet the Full Cast",
        "link": "https://bird.com/article",
        "description": "See who's joining previously announced stars Katie Brayben and Christian Borle in the Elton John-Jake Shears-James Graham musical.",
        "thumbnail": "https://assets.bird.com.jpg",
        "date": "2024-08-28T11:21:00",
        "creator": "Joe Black"
      },
      {
        "title": "Stars in ASL American",
        "link": "https://bird.com/article",
        "description": "Center Theatre Group is teaming up with Deaf West Theatre to reopen the Mark Taper Forum with a new production of the Green Day musical after bringing revivals of Big River and Spring Awakening to Broadway.",
        "thumbnail": "https://assets.bird.com.jpg",
        "date": "2024-08-28T11:59:00",
        "creator": "Joe Black"
      }
    ]
  }
}
{
  "feed": {
    "version": "1.0",
    "title": "sample-data-feed",
    "items": [
      {
        "title": "Meet the Full Cast",
        "link": "https://bird.com/article",
        "description": "See who's joining previously announced stars Katie Brayben and Christian Borle in the Elton John-Jake Shears-James Graham musical.",
        "thumbnail": "https://assets.bird.com.jpg",
        "date": "2024-08-28T11:21:00",
        "creator": "Joe Black"
      },
      {
        "title": "Stars in ASL American",
        "link": "https://bird.com/article",
        "description": "Center Theatre Group is teaming up with Deaf West Theatre to reopen the Mark Taper Forum with a new production of the Green Day musical after bringing revivals of Big River and Spring Awakening to Broadway.",
        "thumbnail": "https://assets.bird.com.jpg",
        "date": "2024-08-28T11:59:00",
        "creator": "Joe Black"
      }
    ]
  }
}

A alimentação json acima pode ser usada como uma URL da API ao criar uma fonte de dados externa.

Uma vez criada, você pode referenciá-la em um modelo de email da seguinte forma:

  1. Primeiro adicione um elemento html e adicione o código abaixo para buscar a fonte de dados externa pelo nome, ou seja, {% datafetch "external-data-source-name" %}

  2. Use a função for em liquid para obter todos os itens em sua alimentação junto com o caminho, ou seja, {% for <your-item> in dataFetchResponse.<your-json-path> %}.

Se você tiver apenas um item, isso pode não ser necessário

Assumindo que sample-data-feed é o nome da fonte de dados externa e feed.items é o caminho no json feed para obter os itens, ficará assim:

{% datafetch "sample-data-feed" %}
{% for item in dataFetchResponse.feed.items %}
{% datafetch "sample-data-feed" %}
{% for item in dataFetchResponse.feed.items %}
{% datafetch "sample-data-feed" %}
{% for item in dataFetchResponse.feed.items %}



  • Depois que isso for adicionado, você pode então adicionar qualquer imagem, texto, elementos de botão e referir-se à fonte de dados externa como abaixo, assumindo a estrutura de sample-data-feed :

{{item.title}} - Para mostrar o título em um elemento de texto

{{item.description}} - Para mostrar a descrição em um elemento de texto

{{item.link}} - Para adicionar um link em um elemento de botão

{{item.thumbnail}} - Para adicionar uma fonte de URL de imagem em um elemento de imagem

  • Agora adicione outro bloco html para encerrar a busca da fonte de dados externa e a função for conforme mostrado abaixo

{% endfor %}
{% enddatafetch %}
{% endfor %}
{% enddatafetch %}
{% endfor %}
{% enddatafetch %}

Para visualizar seu email, você pode mudar para visualização e ver como sua alimentação de conteúdo se parece

Nota: Se você tiver uma alimentação estática, pode atualizá-la aqui manualmente selecionando a fonte de dados externa no dropdown Atualizar Fonte de Dados Externa.

Usando Fonte de Dados Externa para Personalizar URLs

Você também pode usar fontes de dados externas junto com variáveis na URL da API. Isso ajuda a passar quaisquer parâmetros para uma API externa e retornar a resposta a ser adicionada a um template de e-mail

Por exemplo, você pode usar uma URL da API como abaixo passando variáveis como mostrado abaixo

https://api.bird.com/workspaces/?email={{email}}&referenceId={{referenceId}}&locale={{locale}}&name={{name}}

Para usar esta fonte de dados externa em um template de e-mail, você também precisa fornecer os valores das variáveis dentro da tag liquid:

  • Adicione o primeiro elemento html como {% datafetch "name", "variable1", "variable1 value", "variable2", "variable2 value" %}

No exemplo abaixo, a primeira linha evita causar problemas quando o endereço de e-mail tem um sinal de +. A segunda linha efetivamente inicia o fluxo de dados externo com as variáveis. Você pode dar valores estáticos como "value" ou pode fornecer referências de variáveis como contact.attributes.userId.

{%- assign email_for_datafetch = contact.attributes.email_address | url_encode -%}
{% datafetch "GenerateLink","email", email_for_datafetch,"referenceId", contact.attributes.userId, "locale", contact.attributes.locales[0],"name", contact.attributes.name %}
{%- assign email_for_datafetch = contact.attributes.email_address | url_encode -%}
{% datafetch "GenerateLink","email", email_for_datafetch,"referenceId", contact.attributes.userId, "locale", contact.attributes.locales[0],"name", contact.attributes.name %}
{%- assign email_for_datafetch = contact.attributes.email_address | url_encode -%}
{% datafetch "GenerateLink","email", email_for_datafetch,"referenceId", contact.attributes.userId, "locale", contact.attributes.locales[0],"name", contact.attributes.name %}

GenerateLink é o nome da fonte de dados externa acima.

  • Para renderizar um link personalizado, você pode usar um elemento de botão com o link definido como {{dataFetchResponse.url}} onde a url contém a resposta da sua API


Após isso, adicione o elemento html de fechamento como abaixo:

{% enddatafetch %}
{% enddatafetch %}
{% enddatafetch %}
A person is standing at a desk while typing on a laptop.

A plataforma completa nativa de IA que escalará com o seu negócio.

© 2026 Pássaro

A person is standing at a desk while typing on a laptop.

A plataforma completa nativa de IA que escalará com o seu negócio.

© 2026 Pássaro