Jak użyć bloku tabeli w e-mailu
Czego się dowiesz?
Dowiedz się, jak używać bloku tabeli w wiadomości e-mail. Te bloki mogą wyświetlać obrazy i tekst obok siebie. Bloki tabeli mogą też być dynamiczne, iterując po danych, aby spersonalizować wiadomość e-mail dla każdego odbiorcy.
Omówienie bloków tabel
Istnieją 2 typy bloków tabel:
- Statyczna
Ten typ bloku tabeli wyświetla dokładnie taką liczbę wierszy i kolumn, jaką wybierzesz. Każdy odbiorca widzi ten sam układ tabeli, ale treść może się różnić, jeśli użyjesz znaczników personalizacji, zdarzeń, katalogu lub innych znaczników. - Dynamiczne
Te bloki tabel umożliwiają iterowanie po liście danych (np. liście produktów w sekwencji porzuconego koszyka zakupowego lub sekwencji potwierdzenia zamówienia). Liczba wierszy jest określana przez liczbę pozycji na liście: jeśli ktoś zamówi 1 produkt, będzie mieć 1 wiersz; jeśli zamówi 5 produktów, będzie mieć 5 wierszy.
Najczęstszym zastosowaniem dynamicznego bloku tabeli jest wyróżnianie produktów w wiadomości dotyczącej porzuconego koszyka zakupowego. W tym celu używany jest dynamiczny blok do wyświetlania wielu wierszy z obrazami, nazwami produktów i cenami każdego porzuconego elementu.
Kiedy używać bloków tabeli
Blok tabeli to jeden z kilku sposobów umieszczenia obok siebie 2 lub większej liczby elementów treści. Alternatywą są bloki podziału i kolumny.
Dowiedz się więcej o różnych opcjach umieszczania treści obok siebie w poniższej tabeli.
Układ treści | Liczba kolumn | Opcje szerokości | Dozwolone typy treści | Czy kolumny mogą układać się jedna pod drugą w widoku mobilnym? |
Blok podziału | 2 | Precyzyjna kontrola (Użyj Ustawienia podziału > Szerokości kolumn) | Tylko obraz lub tylko tekst | Tak |
Kolumny | 1–4 | Ograniczony wybór | Dowolny typ bloku treści (np. blok tekstowy, blok obrazu, blok cytatu z recenzji) | Tak |
Blok tabeli | Dowolna liczba | Precyzyjna kontrola (Użyj Szerokość kolumny > Ręcznie) | Tylko obraz lub tylko tekst | Nie |
Tabele mogą stanowić wyzwanie pod kątem dostępności, ponieważ czytniki ekranu mają trudności z ich interpretacją.
Statyczne bloki tabeli
Słowo „statyczny” oznacza tutaj po prostu, że treść i liczba wierszy w tabeli pozostają takie same dla każdego odbiorcy. Jedyna sytuacja, w której treść się zmienia, to taka, gdy dodasz dynamiczną treść, np. personalizację, datę i znaczniki katalogu, w statycznym bloku tabeli.
Przypadki użycia statycznych bloków tabeli
Użyj statycznego bloku tabeli, aby:
- Wyświetl konkretny element, np. na potrzeby sprzedaży błyskawicznej lub premiery produktu.
- Zawsze uwzględniaj tę samą liczbę elementów (np. pokaż ostatnio oglądany element w wiadomości sekwencji porzuconego przeglądania).
- Utwórz wiadomość sekwencji, w której dane zdarzenia zawierają tylko 1 element, który obejmuje:
- Sekwencje porzuconego koszyka zakupowego (wyzwalacz dodania do koszyka)
- Sekwencje porzuconego przeglądania
- Sekwencje „Znów dostępne” i „Spadek ceny”
- Chcesz umieścić tekst statyczny i obrazy obok siebie
Jak utworzyć statyczny blok tabeli
- Przejdź do e-maila (np. e-maila z kampanii, szablonu lub e-maila sekwencji).
- W menu Bloki przeciągnij blok Tabela na obszar roboczy.
- Otwórz menu Style dla bloku. Zwróć uwagę, że opcja Statyczny jest już wybrana, ponieważ jest to ustawienie domyślne dla bloków tabeli.
- W sekcji Kolumny kliknij Dodaj kolumnę, aby dodać kolejne kolumny.
- W sekcji Wiersze kliknij Dodaj wiersz, aby dodać dodatkowe wiersze.
- Wróć do karty Treści bloku.
- W obszarze Selektor komórek wybierz komórkę, którą chcesz edytować.
- Wybierz, czy ta komórka ma być tekstem czy obrazem, korzystając z menu Zawartość komórki. Powtórz dla każdej komórki.
- Dodaj treść (np. tekst lub obraz) poniżej menu Zawartość komórki.
- Gdy dodasz treść do każdej komórki, kliknij strzałkę wstecz, aby wrócić do głównego menu Treść i kontynuować tworzenie e-maila.
Dynamiczne bloki tabeli
Jeśli Twoja platforma e-commerce ma standardowe integracje z Klaviyo, nie musisz tworzyć dynamicznego bloku tabeli. Zamiast tego użyj bloków tabel dostępnych w domyślnych sekwencjach porzuconego koszyka zakupowego lub złożenia zamówienia, które znajdziesz w bibliotece sekwencji.
Dynamiczne bloki tabel iterują po zbiorze danych, aby powtarzać treści na podstawie liczby wpisów w tym zbiorze. Blok iteruje, dopóki nie dotrze do końca listy. Na przykład można wyświetlić dokładną liczbę produktów w czyimś koszyku.
Aby użyć bloku dynamicznego, musisz odwołać się do danych sformatowanych jako lista zagnieżdżona, w której każdy wpis na liście ma ten sam format. Najczęstszy przypadek użycia to informacje o produkcie znalezione w zdarzeniu wyzwalającym sekwencji (np. rozpoczęcie realizacji zakupu, złożenie zamówienia), ale możesz też użyć kanału internetowego, aby wyświetlić wpisy na blogu, lub odwołać się do danych profilu sformatowanych jako lista.
Elementy bloku tabeli dynamicznej
Utworzenie dynamicznego bloku treści wymaga 3 elementów:
- Kolekcja wierszy
Lokalizacja danych, po których należy iterować. Podczas przeglądania danych źródłowych (np. elementów w metadanych zdarzenia Started Checkout) jest to część odpowiednich znaczników szablonu, która jest taka sama dla każdego znacznika. - Alias wiersza
Skrócony sposób odwoływania się do kolekcji wierszy, gdy tabela iteruje przez zestaw danych. Alias wiersza to zwykle item, ale możesz użyć dowolnego tekstu. - Treści dynamiczne
Treści, które będą wyświetlane w każdym wierszu. Na przykład możesz chcieć wyświetlać obraz, nazwę produktu, cenę i informacje o wariancie dla każdego elementu pozostawionego w koszyku.
Przykłady zastosowań bloków tabel dynamicznych
Użyj bloku tabeli dynamicznej, jeśli dynamicznie odwołujesz się do listy danych i każdy wpis na liście jest sformatowany w ten sam sposób. Obejmuje to:
- Sekwencje porzuconego koszyka zakupowego (wyzwalacz rozpoczęcia realizacji zakupu)
- Sekwencje potwierdzenia zamówienia
- Sekwencje up-sellingu lub cross-sellingu (sprzedaż krzyżowa)
Jak utworzyć blok tabeli dynamicznej
Wszystkie znaczniki użyte w tych instrukcjach są przykładami i prawdopodobnie różnią się od prawidłowych znaczników dla Twojego konta. Właściwe znaczniki dla Twojej wiadomości zależą od źródła i struktury Twoich danych (często jest to platforma e-commerce), co w przypadku wielu kont Klaviyo wygląda inaczej.
Ta sekcja omawia ogólnie dynamiczne bloki tabel. Aby uzyskać bardziej szczegółowe instrukcje dotyczące tego procesu, dowiedz się jak tworzyć dynamiczne bloki w e-mailu sekwencji.
- Przejdź do edytora wiadomości e-mail. Jeśli używasz danych zdarzeń (np. szczegółów porzuconego koszyka zakupowego), przejdź do wiadomości e-mail w sekwencji wyzwalanej przez odpowiednie zdarzenie.
- W menu Bloki przeciągnij blok Tabela na obszar roboczy.
- Otwórz menu Style dla bloku i wybierz Dynamiczny.
- Ustaw kolekcję wierszy: użyj tej części znacznika personalizacji, która jest spójna dla każdego elementu, który chcesz wyświetlić.
- Na przykład, jeśli {{ event.products.0.imageURL }} to znacznik obrazu pierwszego elementu, a {{ event.products.1.name }} to znacznik nazwy drugiego elementu, to kolekcją wierszy powinna być event.products.
- Kolekcja wierszy prawie zawsze będzie częścią znacznika poprzedzającą pierwszą liczbę (np. event.extra.line_items jeśli pełny znacznik to {{ event.extra.line_items.0.product.name }}).
- Ustaw alias wiersza jako item.
- Wróć do karty Treści bloku.
- Dodaj treść do każdej komórki tabeli. Zwykle komórka po lewej stronie zawiera obraz, a komórka po prawej stronie — tekst zawierający dynamiczne znaczniki z informacjami o produkcie.
- Zastąp w tabeli wszystko, co poprzedza pierwszą liczbę w każdym znaczniku, aliasem wiersza (np. „item”). Na przykład:
- {{ event.extra.line_items.0.imageURL }} zmienia się w {{ item.imageURL }}
- {{ event.items.0.product.name }} zmienia się na {{ item.product.name }}
- Kliknij Wyświetl podgląd i testuj, aby wyświetlić podgląd e-maila.
- Upewnij się, że podgląd korzysta z właściwych danych (np. jeśli to wiadomość o porzuconym koszyku zakupowym, użyj w podglądzie zdarzenia Rozpoczęto realizację zakupu), w przeciwnym razie tabela nic nie wyświetli.
Ten proces pozwala programistom i marketerom obeznanym z kodem tworzyć wysoce spersonalizowane treści. Jeśli nie masz w zespole programisty i nie czujesz się komfortowo, tworząc ten blok samodzielnie, rozważ skontaktowanie się z partnerem Klaviyo w celu uzyskania pomocy.
Dowiedz się więcej o tworzeniu sekwencji porzuconego koszyka zakupowego lub wykorzystaniu danych zdarzeń do personalizacji sekwencji e-mailowych i sekwencji SMS.
Jak działają dynamiczne bloki tabeli
Dynamiczne bloki tabel działają dokładnie tak samo jak pętla for w większości języków programowania.
- Kolekcja wierszy identyfikuje część danych do przejścia w pętli.
- Alias wiersza to alias, który pozwala zidentyfikować, gdzie pojawia się treść dynamiczna.
- Każdy znacznik, który używa aliasu wiersza, będzie odwoływać się do właściwej linii w danych zdarzenia, w zależności od tego, w którym wierszu się znajduje.
Podczas renderowania e-maila Klaviyo przechodzi w pętli przez każdy element w zestawie danych. Za pierwszym razem alias wiersza jest zastępowany przez [row collection].0., co odnosi się do pierwszego elementu w zestawie danych. Za drugim razem alias wiersza jest zastępowany przez [row collection].1., co wskazuje na drugi element w zestawie danych. Ten proces jest następnie kontynuowany, aż nie pozostaną żadne elementy, i istnieje jeden wiersz dla każdego elementu w zestawie danych.
Dodatkowe źródła
- Jak wyświetlać produkty pionowo w wiadomościach e-mail
Dowiedz się, jak wyświetlać produkty w sekwencjach porzuconego koszyka zakupowego oraz potwierdzenia zamówienia pionowo (tj. z obrazem nad informacjami o produkcie, a nie obok).
- Customize and personalize emails using Django