Jak dodać spersonalizowane zdjęcia do Iterable
Wykorzystaj pola Handlebars, które już wysyłasz do Iterable, żeby narysować imię, szczegóły rezerwacji lub saldo na obrazku dla każdego użytkownika.
Umieść dane przechowywane w Iterable na obrazkach, które widzą twoi użytkownicy.
Szablony Iterable już pobierają dane profilowe i dotyczące wydarzeń za pomocą Handlebars. Sendtric spersonalizowane zdjęcia Pójdź o krok dalej i przenieś te wartości na grafikę, wykorzystując swoje czcionki i układ: grafikę w stylu karty pokładowej z trasą użytkownika albo kartę lojalnościową z aktualnym stanem konta. Grafika pojawia się po otwarciu e-maila.

Edytor „przeciągnij i upuść” firmy Iterable ma Dynamiczny obraz opcja w bloku „Image”, która ładuje obraz z adresu URL zawierającego Handlebars, a w ich własnej dokumentacji wskazano zewnętrzne serwisy do tworzenia takich obrazów. Sendtric to jeden z takich serwisów: projektujesz obraz, a jego adres URL zawiera twoje pola typu Iterable.
Co możesz zrobić ze spersonalizowanymi zdjęciami w Iterable
- Podsumowanie podróży i rezerwacji: miasto wylotu, miasto przylotu i data z rezerwacji, przedstawione na jednej grafice podróży. Zobacz spersonalizowany tekst na zdjęciach na przykład.
- Najważniejsze etapy rozwoju aplikacji: „Ukończyłeś 30 treningów” albo „12 lekcji za tobą” – z niestandardowego pola profilu, w e-mailu z gratulacjami.
- Oświadczenia dotyczące lojalności: punkty, poziom i nazwa członka na zdjęciu karty w comiesięcznym e-mailu z podsumowaniem podróży.
- Podsumowania na koniec roku: kilka statystyk z profilu użytkownika na jednym tle – to częste zastosowanie dla maile podsumowujące rok.
| Funkcja obrazu | Free | Micro | Standard | Energia i Przedsiębiorstwa |
|---|---|---|---|---|
| Spersonalizowane warstwy tekstowe dla każdego obrazu | 1 | 2 | 4 | 20 |
| Twoje własne warstwy graficzne (logo, Produkt) | No | No | Yes | Yes |
| Jednolite tło | No | No | Yes | Yes |
| Przezroczyste tło | No | No | No | Yes |
Jak dodać własne spersonalizowane zdjęcia do Iterable
Krok 1: Zaprojektuj obrazek
W Sendtric przejdź do Personalizacja obrazów i kliknij Utwórz nowy. Wybierz tło z biblioteki multimediów albo jednolite lub przezroczyste płótno, a potem dodaj Tekst dynamiczny warstwy dla każdej wartości. Dostosuj rozmiar każdego pola tekstowego do najdłuższej wartości, jakiej się spodziewasz, bo tekst się zawija, ale nie zmniejsza.
Krok 2: Wpisz wartość w polu „Iterable” dla każdej warstwy
Dla każdej warstwy z tekstem dynamicznym nadaj zmiennej nazwę pisane małymi literami Nazwa zmiennej i umieść wyrażenie Iterable Handlebars w Tag scalający ESP, na przykład {{firstName}}. Pola są specyficzne dla twojego projektu, więc używaj dokładnie tych nazw, które widzisz w profilu użytkownika, łącznie z notacją kropkową dla pól zagnieżdżonych, na przykład {{address.city}} jeśli twoje miasto znajduje się w obiekcie adresu. Dodaj Tekst rozwiązania awaryjnego dla użytkowników bez wartości.

Krok 3: Zapisz i skopiuj kod
Zapisz obrazek. Okienko z kodem pojawi się po pierwszym zapisaniu – każda zmienna zostanie dodana do adresu URL obrazka i wypełniona twoim wyrażeniem typu Iterable. Wybierz wyrównanie i kliknij Skopiuj kod.

Krok 4: Wklej to do bloku HTML
Otwórz szablon Iterable i kliknij Edytuj projekt. W edytorze typu „przeciągnij i upuść” przeciągnij element HTML blok z Treść Przejdź do odpowiedniego miejsca, zaznacz je i wklej kod do edytora HTML. W edytorze WYSIWYG lub edytorze „Side by Side” wklej kod do kodu źródłowego.

Krok 5: Sprawdź, jak to wygląda u prawdziwych użytkowników
Kliknij Podgląd, wpisz adres e-mail użytkownika (lub identyfikator użytkownika) i kliknij Załaduj dane użytkownika żeby zobaczyć obrazek z ich wartościami. Wypróbuj użytkownika z długą nazwą i takiego z pustym polem. Potem wyślij potwierdzenie Do siebie, która wypełnia pola na podstawie twojego profilu.
Używanie bloku „Obraz” zamiast kodu HTML
Jeśli wolisz zachować blok „Image”, skopiuj tylko adres znajdujący się wewnątrz src z kodu Sendtric, przeciągnij do niego Zdjęcie zablokuj, włącz Dynamiczny obraz i wklej adres do Dynamiczny adres URL. Jeśli podczas projektowania blok wygląda na pusty, zapisz go Podgląd z załadowanymi danymi użytkownika.
Rozwiązania awaryjne w Iterable lub Sendtric
Możesz pozwolić, by funkcja „Rozwiązanie awaryjne” w Sendtric radziła sobie z pustymi wartościami, albo użyć funkcji pomocniczej klasy `Iterable` wewnątrz tagu, na przykład: {{defaultIfEmpty firstName 'there'}}. Użyj pojedynczych cudzysłowów dla wartości domyślnej, bo wyrażenie znajduje się w adresie obrazka ujętym w podwójne cudzysłowy. Jeśli Iterable podaje wartość domyślną, Rozwiązanie awaryjne Sendtric nigdy się nie wyświetla.
Często zadawane pytania dotyczące spersonalizowanych zdjęć w Iterable
Czy mogę korzystać z danych zdarzeń, a nie tylko z pól profilu?
Tak. Każda wartość Handlebars, którą Iterable może rozpoznać podczas renderowania wiadomości e-mail, może trafić do warstwy – w tym pola z wydarzenia, które uruchomiło ścieżkę lub kampanię. W dokumentacji Iterable zaznaczono, że pole wydarzenia o tej samej nazwie co pole profilu ma pierwszeństwo, a {{profile.fieldName}} wyraźnie odczytuje wartość profilu.
A co, jeśli wartość zawiera spacje lub znaki specjalne?
Jeśli pole może zawierać spacje lub znaki takie jak & lub #, zawiń to w Iterable's urlEncode na przykład pomocnik blokowy {{#urlEncode}}{{city}}{{/urlEncode}}, dzięki czemu adres obrazka pozostaje bez zmian. Następnie sprawdź wynik w podglądzie.
Co widzą użytkownicy, gdy pole jest puste?
Jeśli ustawiono tekst rozwiązania awaryjnego, widzą tylko ten tekst, więc wpisz go jako pełne zdanie. Bez niego cała warstwa jest ukryta, łącznie ze słowami wokół zmiennej.
Czy mogę zaktualizować zdjęcie po wysłaniu?
Tak. Zapisanie zmian w Sendtric powoduje, że obraz w każdej wysłanej wiadomości e-mail zmienia się od następnego otwarcia. Wersje renderowane są buforowane przez około godzinę dla każdej kombinacji wartości, a zapisanie zmian powoduje wyczyszczenie tej pamięci.
Czy podglądy wliczają się do liczby wyświetleń?
Podglądy w edytorze Sendtric tego nie robią. Dzieje się tak przy każdym rzeczywistym załadowaniu obrazu, w tym przy otwieraniu proofów typu Iterable i wielokrotnym otwieraniu.
Ten przewodnik dotyczy jednej z funkcji Sendtric Personalizacja wiadomości e-mail platforma. Dla każdego spersonalizowane zdjęcia Opcje i przykłady znajdziesz na stronie głównej.
Więcej poradników Iterable
- Licznik odliczający - Jak dodać liczniki odliczające do Iterable
- Licznik odliczający - Dodaj dynamiczne liczniki czasu w Iterable
- Ankiety na żywo - Jak dodać ankiety na żywo do Iterable
- Obrazy oparte na regułach - Jak dodać obrazy oparte na regułach do serwisu Iterable
- Dynamiczna pogoda - Jak dodać dynamiczną pogodę do Iterable
- Powiadomienia krytyczne - Jak dodać Powiadomienia krytyczne do Iterable
- Liczniki dowodów społecznych - Jak dodać liczniki dowodów społecznych do Iterable
Korzystasz z innej platformy? Zobacz wszystkie Integracje Sendtric.

