Hosting obrazów z wyeksportowanych e-maili

Wyeksportowane pliki obrazów możesz hostować samodzielnie albo pozwolić, aby Emailify automatycznie przesłał je do naszego CDN.

Korzystanie z CDN Emailify do hostingu obrazów (domyślnie) ​

Przy eksporcie HTML Emailify domyślnie zapisuje obrazy obok plików .html, dzięki czemu możesz je przesłać, gdzie chcesz.

Jeśli jednak chcesz, aby Twoje obrazy hostował CDN Emailify (sieć dostarczania treści), włącz przełącznik Upload Hosted Image URLs. Obrazy zostaną przesłane, a adresy URL w e-mailu HTML automatycznie podmienione tak, aby wskazywały na przesłane pliki.

Jeśli korzystasz z którejkolwiek z wbudowanych integracji z platformami do e-mail marketingu, Twoje obrazy zostaną automatycznie przesłane do CDN Emailify.

Dlaczego hostowany obraz może być większy niż plik źródłowy ​

Emailify renderuje dane obrazu używane przez wyeksportowany e-mail i optymalizuje wygenerowany plik PNG lub JPG, zanim doda ten sam plik do eksportu i – jeśli ta opcja jest włączona – prześle go na serwer. Hosting zmienia adres URL; nie stosuje osobnej kompresji.

Ponieważ Figma dostarcza wyrenderowane dane eksportu, a nie oryginalny przesłany plik, hostowany plik nie jest bajt w bajt kopią źródłowego pliku JPG lub PNG. Jego rozmiar może się różnić – plik może być nawet większy. Aby zmniejszyć wynik, przed eksportem użyj warstwy źródłowej o odpowiednim rozmiarze i odpowiedniego formatu obrazu. W tym przepływie pracy Emailify nie może zachować dokładnej kompresji oryginalnego pliku.

Przesyłanie zasobów graficznych do własnego bucketu w chmurze ​

Domyślnie Emailify hostuje Twoje obrazy w CDN Emailify (sieci dostarczania treści), ale opcjonalnie możesz zamiast tego użyć własnego bucketu w usłudze przechowywania w chmurze (na przykład AWS S3 lub Backblaze B2).

Po wybraniu usługi hostingu obrazów wpisz poniżej dane uwierzytelniające i szczegóły bucketu. Podczas eksportu Twoje zasoby graficzne zostaną automatycznie przesłane do Twojego bucketu (a ścieżka obrazów w buckecie zostanie użyta w atrybutach src znaczników <img> w HTML):

  • Region (na przykład us-east-1)
  • Access Key (na przykład 003g8...)
  • Secret Access Key (na przykład K454q...)
  • Bucket Name (na przykład my-emailify-bucket)
  • Bucket URL (na przykład https://my-emailify-bucket.s3.us-east-1.amazonaws.com/)

Upewnij się, że każdy utworzony bucket ma uprawnienia dostępu Public do odczytu – w przeciwnym razie adresy URL przesłanych obrazów nie będą dostępne po wysłaniu e-maila HTML

Adresy Cloudflare R2 ​

R2 używa dwóch osobnych adresów. Wpisz oba w ustawieniach hostingu obrazów:

  • S3 API endpoint: skopiuj endpoint ze swojego konta Cloudflare, na przykład https://accountid.r2.cloudflarestorage.com. Zachowaj segment jurysdykcji pokazany przez Cloudflare, na przykład .eu. Nazwę bucketu wpisz w polu R2 Bucket Name.
  • Public image URL: użyj własnej domeny połączonej z bucketem, na przykład https://images.example.com/, albo włączonego publicznego adresu URL r2.dev. S3 API endpoint wymaga uwierzytelnienia i nie może służyć jako publiczny adres URL obrazów w e-mailu.

Jeśli w polu adresu URL był wcześniej zapisany S3 API endpoint, Emailify przeniesie go do pola S3 API endpoint. Przed kolejnym eksportem dodaj publiczny adres URL obrazów. Jeśli masz już zapisaną publiczną domenę, zostanie ona zachowana – dodaj osobny endpoint API, jeśli go brakuje. Twoje klucze dostępu i nazwa bucketu zostaną zachowane.

Zobacz przewodniki Cloudflare: S3 API endpoint i publiczny dostęp do bucketu.

Błędy hostingu obrazów w Mailchimp ​

Przy eksporcie bezpośrednio do Mailchimp Emailify sprawdza folder obrazów, istniejące pliki i adresy URL przesłanych obrazów. Jeśli Mailchimp odrzuci żądanie dotyczące obrazu, eksport zgłosi błąd i nie utworzy szablonu z niepotwierdzonymi adresami URL obrazów. Sprawdź połączenie z Mailchimp i klucz API, a następnie wyeksportuj ponownie.

Usługi przechowywania w chmurze obsługiwane przez Emailify ​

Obrazy wyeksportowane z Emailify możesz hostować samodzielnie w dowolnej z poniższych usług przechowywania obiektów zgodnych z S3:

Ustawianie własnego bazowego adresu URL dla obrazów hostowanych na własnym serwerze lub CDN ​

Domyślnie atrybut src wszystkich obrazów w HTML eksportowanym przez Emailify to względna ścieżka img/ (na przykład img/ceb3f891b78815897e04299f93eef255.jpg). Pozwala to przejrzeć e-mail i przesłać plik zip na niektóre platformy, takie jak MailChimp, które automatycznie przesyłają obrazy i aktualizują adresy URL w src.

Jeśli jednak korzystasz z platformy, która tego nie obsługuje, albo po prostu hostujesz obrazy na własnym serwerze, możesz ustawić własny bazowy adres URL.

Własny bazowy adres URL dla pojedynczego e-maila ​

Możesz ustawić własny bazowy adres URL dla pojedynczych e-maili: zaznacz główną ramkę e-maila w Figmie, kliknij przycisk Settings w nagłówku wtyczki, włącz przełącznik Override "img/" Base Path i wklej bazową ścieżkę URL, pod którą będą hostowane obrazy. Po włączeniu własnego bazowego adresu URL zostanie on automatycznie dodany na początku atrybutów src wszystkich obrazów (na przykład img/ zostanie zastąpione przez https://your-custom-server.com/image/path/here/ w wyeksportowanym pliku HTML).

To ustawienie dla pojedynczego e-maila sprawdza się, gdy potrzebujesz różnych bazowych adresów URL dla konkretnych kampanii albo chcesz nadpisać globalne ustawienie CDN dla wybranych e-maili.

Globalny własny bazowy adres URL CDN ​

Jeśli we wszystkich e-mailach hostujesz obrazy na tym samym własnym CDN lub serwerze, możesz ustawić globalny bazowy adres URL zamiast konfigurować go osobno dla każdego e-maila:

  1. W panelu ustawień eksportu znajdź listę CDN.
  2. Wybierz z listy opcji CDN pozycję Custom Base Image Path URL.
  3. W polu, które się pojawi, wpisz swój bazowy adres URL (np. https://cdn.example.com/images/).
  4. Od teraz wszystkie eksportowane e-maile będą domyślnie używać tego bazowego adresu URL w ścieżkach obrazów.

Globalne ustawienie własnego CDN to wygodny sposób na ujednolicenie hostingu obrazów we wszystkich kampaniach e-mailowych. Jeśli skonfigurowany jest zarówno globalny, jak i indywidualny bazowy adres URL, pierwszeństwo ma ustawienie dla pojedynczego e-maila – dzięki temu w razie potrzeby możesz nadpisać globalny CDN dla konkretnych kampanii.

Niezależnie od tego, czy używasz ustawienia globalnego, czy indywidualnego, upewnij się, że Twój bazowy adres URL jest publicznie dostępny i – jeśli to wymagane – ma poprawnie skonfigurowane ustawienia CORS. Adres URL może kończyć się ukośnikiem lub nie – Emailify poprawnie obsłuży oba formaty.

Dlaczego obrazy nie wyświetlają się w wyeksportowanym e-mailu HTML? ​

Obrazy w e-mailach zwykle nie wyświetlają się po wysyłce, gdy pliki obrazów nie są hostowane pod publicznymi adresami URL w internecie, e-mail został wysłany z narzędzia, które zmieniło kod HTML, albo klient poczty odbiorcy zablokował zdalne obrazy.

Jeśli eksportujesz HTML z lokalnymi ścieżkami img/, obrazy są zapisywane obok pliku .html i trzeba je przesłać razem z szablonem e-maila albo hostować osobno. Jeśli włączysz Upload Hosted Image URLs, Emailify prześle obrazy i automatycznie podmieni adresy URL obrazów w HTML na hostowane linki.

Dlaczego obrazy działają lokalnie, ale nie po wysłaniu? ​

Lokalny podgląd HTML może wczytywać obrazy z wyeksportowanego folderu img/ na Twoim komputerze. Po wysłaniu e-maila odbiorcy nie mają dostępu do plików na Twoim komputerze, więc obrazy muszą być hostowane w internecie albo przesłane przez Twoją platformę do wysyłki (ESP).

Gmail i Outlook nie nadają się do niezawodnego wysyłania wyeksportowanego własnego HTML, ponieważ mogą zmieniać kod i nie obsługują hostingu obrazów przy masowej wysyłce e-maili HTML. Zamiast tego użyj platformy ESP lub jednej z wbudowanych integracji Emailify.

Co sprawdzić najpierw, gdy wyeksportowane obrazy są uszkodzone? ​

  • Upewnij się, że obrazy są hostowane pod publicznymi adresami URL https://, albo prześlij wyeksportowany folder img/ przez swoją platformę ESP.
  • Włącz Upload Hosted Image URLs, jeśli chcesz, aby Emailify przesłał zasoby graficzne za Ciebie.
  • Jeśli używasz własnego bucketu lub CDN, upewnij się, że bucket pozwala na publiczny odczyt adresów URL przesłanych obrazów.
  • Jeśli przesyłanie się nie powiedzie, sprawdź, czy żądania nie blokuje VPN, zapora (firewall), proxy lub sieć firmowa.
  • Przed eksportem poczekaj, aż obrazy w pliku Figmy się w pełni załadują.
  • Pamiętaj, że niektóre klienty poczty blokują zdalne obrazy, dopóki odbiorca nie zdecyduje się ich wyświetlić.

Błędy połączenia z własnym hostingiem ​

W przypadku Amazon S3 Emailify tworzy endpoint przesyłania na podstawie wybranych wartości Region i Bucket Name. Bucket URL to publiczny bazowy adres URL obrazów w wyeksportowanym e-mailu – jego zmiana nie zmienia endpointu przesyłania.

Wpisz pełną nazwę bucketu, łącznie z identyfikatorem konta i sufiksem regionu, jeśli występują. Na przykład regionalny bucket konta o nazwie my-email-images-123456789012-ap-southeast-2-an używa regionu ap-southeast-2 i adresu bucketu https://my-email-images-123456789012-ap-southeast-2-an.s3.ap-southeast-2.amazonaws.com/. AWS obsługuje zarówno globalne, jak i regionalne nazwy bucketów konta.

Tożsamość IAM powiązana z Twoim kluczem dostępu potrzebuje uprawnienia s3:PutObject do arn:aws:s3:::YOUR-BUCKET-NAME/*, aby przesyłać obrazy. Emailify nie potrzebuje publicznego dostępu do zapisu ani uprawnień do tworzenia lub usuwania bucketów. Dodatkowe ograniczenia w politykach AWS lub ustawieniach szyfrowania mogą jednak nadal blokować przesyłanie – zobacz wskazówki AWS dotyczące uprawnień.

Wyeksportowane adresy URL obrazów muszą też być dostępne do odczytu bez logowania. Użyj publicznego bucketu na obrazy lub publicznego CDN opartego na Twoim buckecie i sprawdź adres URL pojedynczego przesłanego obrazu w oknie prywatnym przeglądarki. Niezwiązane z tym prywatne pliki trzymaj w osobnym miejscu – nie upubliczniaj ich tylko po to, aby obrazy w e-mailach działały.

Jeśli eksport zgłosi Image hosting failed, popraw połączenie lub uprawnienia i ponów eksport. Pomyślne przesłanie szablonu e-maila nie oznacza, że jego obrazy również zostały przesłane. Jeśli błąd się powtarza, wyślij treść błędu lub zrzut ekranu do wsparcia, nie dołączając klucza dostępu ani klucza tajnego.