G

M

Zewnętrzne źródła danych

Wprowadź zewnętrzne dane dynamiczne do HTML

Przegląd

Integracja zewnętrznych źródeł danych w szablonach e-mailowych pozwala na tworzenie wysoko spersonalizowanej i dynamicznej treści, co poprawia zaangażowanie i trafność. Ten przewodnik przeprowadzi Cię przez proces ustawiania zewnętrznych źródeł danych i ich wykorzystania w szablonach e-mailowych.

Zewnętrzne źródła danych dostarczają dynamiczną treść do Twoich szablonów e-mailowych, pobierając informacje z zewnętrznych interfejsów API. Jest to przydatne w przypadku:

  • Personalizacji treści na podstawie zewnętrznego kanału

  • Wyświetlania danych w czasie rzeczywistym, takich jak status lotu z interfejsu API

  • Dostosowywania linków poprzez przekazywanie parametrów i uzyskiwanie finalnych linków poprzez zewnętrzne narzędzie

Utwórz zewnętrzne źródło danych

  • Przejdź do aplikacji Marketing i kliknij na Zawartość

  • W sekcji Zawartość, kliknij na Źródła danych zewnętrznych > Utwórz Źródło Danych Zewnętrznych


  • Możesz nadać mu nazwę. To powinien być ciąg znaków bez spacji

  • Podaj link do swojego API

  • Zdefiniuj, czy chcesz, aby zawartość była aktualizowana dynamicznie, czy chcesz ją odświeżać ręcznie po dodaniu do e-maila, a następnie nie chcesz, aby się aktualizowała.

  • Możesz wybrać brak uwierzytelnienia lub zdefiniować typ uwierzytelnienia oraz dodać wszelkie nagłówki


  • Kiedy klikniesz na Zapisz konfigurację, źródło danych zewnętrznych zostanie utworzone

  • Po utworzeniu, możesz przetestować swoją konfigurację, aby zobaczyć, jaki otrzymujesz wynik, klikając na Testuj konfigurację, jak pokazano poniżej.

Używanie zewnętrznych źródeł danych w wiadomościach e-mail


Po poprawnym skonfigurowaniu zewnętrznego źródła danych możesz użyć jego wyjścia w szablonie e-maila, używając języka templatingowego liquid.

Używanie zewnętrznego źródła danych do zasilania treści

Aby pokazać zasilanie treści, możesz stworzyć API, które zwraca JSON z wieloma elementami zasilania treści. Na przykład może wyglądać to tak:

{
  "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"
      }
    ]
  }
}

Powyższy JSON feed może być użyty jako adres URL API podczas tworzenia zewnętrznego źródła danych.

Po utworzeniu możesz się do niego odwołać w szablonie e-maila w następujący sposób:

  1. Najpierw dodaj element HTML i dodaj poniższy kod, aby pobrać zewnętrzne źródło danych według nazwy tzn. {% datafetch "external-data-source-name" %}

  2. Użyj funkcji for w liquid, aby uzyskać wszystkie elementy w swoim feedzie wraz z ścieżką tzn. {% for <your-item> in dataFetchResponse.<your-json-path> %}.

Jeśli masz tylko jeden element, to może nie być konieczne

Zakładając, że sample-data-feed to nazwa zewnętrznego źródła danych, a feed.items to ścieżka w JSON feedzie do uzyskania elementów, będzie to wyglądać jak poniżej:

{% 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 %}



  • Po dodaniu tego możesz dodać dowolny element obrazu, tekstu, przycisków i odwołać się do zewnętrznego źródła danych, jak poniżej, zakładając strukturę sample-data-feed :

{{item.title}} - Aby pokazać tytuł w elemencie tekstowym

{{item.description}} - Aby pokazać opis w elemencie tekstowym

{{item.link}} - Aby dodać link w elemencie przycisku

{{item.thumbnail}} - Aby dodać adres URL obrazu w elemencie obrazu

  • Teraz dodaj kolejny blok HTML, aby zakończyć pobieranie zewnętrznego źródła danych i funkcji for jak pokazano poniżej

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

Aby zobaczyć podgląd swojego e-maila, możesz przełączyć się na podgląd i zobaczyć, jak wygląda zasilanie treści

Uwaga: Jeśli masz statyczny feed, możesz odświeżyć go ręcznie, wybierając zewnętrzne źródło danych w rozwijanym menu Odśwież zewnętrzne źródło danych.

Używanie zewnętrznego źródła danych do dostosowywania adresów URL

Możesz również używać zewnętrznych źródeł danych razem z zmiennymi w adresie URL API. Pomaga to przekazać dowolne parametry do zewnętrznego API i otrzymać odpowiedź, która ma zostać dodana do szablonu wiadomości e-mail.

Na przykład, możesz użyć adresu URL API jak poniżej, przekazując zmienne, jak pokazano poniżej.

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

Aby użyć tego zewnętrznego źródła danych w szablonie wiadomości e-mail, musisz również podać wartości zmiennych w tagu liquid:

  • Dodaj pierwszy element html jako {% datafetch "name", "variable1", "wartość zmiennej1", "variable2, "wartość zmiennej2" %}

W poniższym przykładzie, pierwsza linia unika powodowania problemów, gdy adres e-mail zawiera znak +. Druga linia faktycznie inicjuje zewnętrzny przepływ danych z zmiennymi. Możesz podać stałe wartości jako "value" lub możesz dostarczyć odniesienia do zmiennych, jak 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 to nazwa zewnętrznego źródła danych powyżej.

  • Aby wygenerować spersonalizowany link, możesz użyć elementu przycisku z linkiem zdefiniowanym jako {{dataFetchResponse.url}}, gdzie url zawiera odpowiedź z twojego API.


Po tym dodaj zamykający element html jak poniżej:

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

Kompletna platforma oparta na sztucznej inteligencji, która rośnie wraz z Twoim biznesem.

Skontaktuj się z działem sprzedaży

Zacznij za darmo

© 2026 Ptak

Skontaktuj się z pomocą techniczną

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

Kompletna platforma oparta na sztucznej inteligencji, która rośnie wraz z Twoim biznesem.

Skontaktuj się z działem sprzedaży

Zacznij za darmo

© 2026 Ptak

Skontaktuj się z pomocą techniczną

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

Kompletna platforma oparta na sztucznej inteligencji, która rośnie wraz z Twoim biznesem.

Skontaktuj się z działem sprzedaży

Zacznij za darmo

© 2026 Ptak

Skontaktuj się z pomocą techniczną