Poradnik wideo: przesyłanie e-maili do Customer.io

Ten film pokazuje, jak ręcznie przesłać e-maile HTML z wtyczki Emailify w Figmie do Customer.io.

Emailify ma dwie opcje eksportu dla Customer.io:

• Customer.io (API) przesyła e-maile bezpośrednio do Design Studio w Customer.io jako e-maile lub szablony e-maili wielokrotnego użytku.
• Customer.io (Zip) eksportuje plik ZIP, którego zawartość możesz ręcznie skopiować do Customer.io.

Przesyłanie bezpośrednio do Design Studio w Customer.io

W panelu eksportu Emailify wybierz z listy rozwijanej opcję Customer.io (API), a następnie wklej prawidłowy App API Key Customer.io i wybierz region Customer.io odpowiadający Twojemu obszarowi roboczemu.

Jeśli Twój obszar roboczy Customer.io jest hostowany w UE, wybierz w Emailify region EU. W przeciwnym razie pozostaw domyślny region US.

W ustawieniu Upload As wybierz, czy Emailify ma tworzyć w Customer.io szablony e-maili wielokrotnego użytku, czy zwykłe e-maile Design Studio. Dla zgodności wstecznej domyślna wartość to Template. Gdy wszystko będzie gotowe, kliknij przycisk Upload To Customer.io, aby wyeksportować zaznaczone w Figmie e-maile do HTML i automatycznie przesłać je do Design Studio w Customer.io.

Potrzebujesz klucza App API Customer.io, który może tworzyć e-maile Design Studio w Twoim obszarze roboczym Customer.io.

Przy przesyłaniu przez API Customer.io Emailify domyślnie przesyła obsługiwane obrazy z e-maili do Customer.io Assets. Korzysta z folderu emailify w Customer.io Assets i tworzy go automatycznie, jeśli jeszcze nie istnieje. Obrazy, których Customer.io Assets nie przyjmuje, w tym obrazy przekraczające limit 2 MB w Customer.io, są awaryjnie przesyłane do Hypermatic, aby e-mail lub szablon Design Studio nadal mógł odwoływać się do hostowanego adresu URL obrazu.

Aktualizowanie e-maili i szablonów Customer.io przesłanych z Emailify

Jeśli chcesz, aby e-maile lub szablony w Customer.io były automatycznie aktualizowane, zamiast za każdym razem tworzyć nowe, możesz włączyć przełącznik Enable Updatable Templates w ustawieniach eksportu wtyczki (lub Enable Updatable Emails, gdy ustawienie Upload As ma wartość Email).

Wtyczka automatycznie dopisze wartość customerioEmailId lub customerioTemplateId do nazwy warstwy przesłanej ramki w Figmie, a przy kolejnym eksporcie użyje tego ID ponownie, gdy ta sama ramka zostanie przesłana do Customer.io przez API.

Uwaga: przełącznik Enable Updatable Templates lub Enable Updatable Emails musi być włączony przed przesłaniem pierwszego e-maila lub szablonu, bo wtedy do nazwy ramki w Figmie zostanie dopisane ID oryginalnego e-maila lub szablonu w Customer.io. To ID posłuży przy każdym kolejnym przesłaniu do aktualizacji tego samego elementu na Twoim koncie Customer.io (zamiast tworzenia nowego za każdym razem), o ile przełącznik aktualizacji pozostanie włączony.

Aby aktualizować e-maile lub szablony w Customer.io, musisz użyć klucza App API dla tego samego obszaru roboczego i regionu Customer.io, do którego trafiło pierwotne przesłanie.

Ręczne przesyłanie eksportu ZIP do Customer.io

W panelu eksportu Emailify wybierz z listy rozwijanej opcję Customer.io (Zip). Gdy wszystko będzie gotowe, kliknij przycisk Export For Customer.io, aby wyeksportować zaznaczone w Figmie e-maile do HTML.

Po zakończeniu eksportu pobierz plik .zip na komputer i go rozpakuj. Otwórz plik index.html z folderu o nazwie Twojego e-maila w edytorze kodu lub tekstu, skopiuj cały HTML z pliku, a następnie:

• Zaloguj się do konta Customer.io.
• Rozwiń pozycję Content w nawigacji panelu administracyjnego.
• Kliknij pozycję menu Email Layouts.
• Kliknij przycisk Create Layout.
• Kliknij opcję Start from scratch.
• Nazwij układ i kliknij Create Layout.
• Wklej skopiowany HTML z wyeksportowanego pliku index.html do edytora na karcie Edit.
• Kliknij przycisk Save changes.

Tworzenie całkowicie pustego układu w Customer.io

Upewnij się, że używasz całkowicie pustego układu! Customer.io domyślnie dodaje do każdego nowego układu własne znaczniki HTML (na przykład head, body itp.). Musisz usunąć ten kod, inaczej szablon HTML będzie wyglądał na zepsuty po wysyłce.

Gdy zaczynasz tworzyć e-mail w Customer.io, musisz wybrać układ (Layout). Musi on być całkowicie pusty, aby renderował się wyłącznie Twój własny szablon HTML.

Jak widać na zrzucie ekranu poniżej, Layout, który wygląda na pusty, wcale nie jest pusty (zawiera automatycznie dodane znaczniki <html>, które otaczają treść Twojego szablonu HTML).

Aby to naprawić, ręcznie usuń cały HTML, który Customer.io dodaje do pustego układu, i zostaw tylko znacznik content (poniżej).

Gdy zapiszesz Layout zawierający tylko znacznik content, Twój własny szablon HTML powinien renderować się zgodnie z oczekiwaniami.