Jak dodać kolumny do e-maila?
Czego się dowiesz?
Dowiedz się, jak ułożyć treści obok siebie w edytorze e-maili Klaviyo typu „przeciągnij i upuść”, korzystając z bloków podziału, układów kolumn lub bloków tabeli, oraz jak dostosować wygląd projektu na komputerze i urządzeniach mobilnych.
Kiedy użyć bloku podziału, kolumn lub tabeli
Istnieją 3 sposoby na ułożenie treści obok siebie w edytorze e-maili Klaviyo: blok podziału, kolumny i blok tabeli. Każda opcja oferuje określone korzyści i kompromisy.
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 Style > Układ) | 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ą.
Aby użyć układu mobilnego i podglądu Mobilne, włącz opcję Optymalizuj pod kątem urządzeń mobilnych w sekcji Optymalizacja mobilna w głównych ustawieniach Style szablonu.
Dodaj blok podziału do e-maila
Aby dodać blok podziału do e-maila:
- Przeciągnij blok podziału do swojego szablonu, a następnie wybierz go, aby otworzyć jego ustawienia.
- Otwórz kartę Style bloku i dostosuj wartości procentowe w sekcji Układ, aby dopasować szerokość dwóch kolumn.
- Otwórz kartę Treść i użyj selektora kolumn, aby wybrać kolumnę.
- W sekcji Zawartość kolumny wybierz Tekst lub Obraz dla wybranej kolumny.
- Dodaj swoje treści: kliknij dwukrotnie tekst w edytorze wiadomości e-mail, aby go edytować, lub wybierz obraz za pomocą narzędzi sterowania obrazem. Powtórz te kroki w przypadku drugiej kolumny.
- Opcjonalnie: otwórz Style > Układanie na urządzeniach mobilnych, aby wybrać kolejność układania, lub wybierz Bez układania, aby zachować kolumny obok siebie na urządzeniach mobilnych.
- Kliknij strzałkę wstecz, aby wrócić do głównego menu treści i zapisać zmiany w bloku.
Dodaj kolumny do wiadomości e-mail
Aby dodać kolumny do wiadomości e-mail:
- Przeciągnij kolumny z sekcji Układ do swojego e-maila.
- W oknie dialogowym wybierz liczbę kolumn i preferowany układ, a następnie kliknij Dodaj układ kolumn.
- Przeciągnij bloki dowolnego typu do swoich kolumn.
W odróżnieniu od bloku podziału możesz użyć dowolnego bloku, umieścić wiele bloków w tej samej kolumnie i wybrać więcej niż 2 kolumny. Na przykład jest to e-mail z obrazem po jednej stronie oraz tekstem i przyciskiem po drugiej.
Gdy włączysz optymalizację mobilną, kolumny domyślnie układają się od lewej do prawej. W ustawieniach sekcji możesz zmienić kolejność układania lub zostawić kolumny obok siebie. W przypadku tekstu i obrazów możesz też użyć bloku tabeli.
Aby zmienić układ warstw na urządzeniach mobilnych w sekcji zawierającej Twoje kolumny:
- Kliknij obszar po lewej lub prawej stronie zawartości sekcji, aby otworzyć ustawienia sekcji.
- Otwórz Style > Układanie na urządzeniach mobilnych i wybierz kolejność układania lub wybierz Bez układania, aby zachować kolumny obok siebie.
- Kliknij strzałkę wstecz, aby wrócić do głównego menu treści i zapisać zmiany w sekcji.
Dodaj blok tabeli do e-maila
Użyj bloku tabeli, aby ułożyć tekst i obrazy w kolumnach, które na urządzeniach mobilnych pozostaną obok siebie. Aby dodać tabelę i ją wypełnić:
- Przeciągnij blok Table do wiadomości e-mail, a następnie go wybierz, aby otworzyć jego ustawienia.
- Otwórz Style i w sekcji Kolumny kliknij Dodaj kolumnę dla każdej dodatkowej kolumny, której potrzebujesz. Aby ustawić szerokość kolumny, rozwiń tę kolumnę i wybierz Szerokość kolumny > Ręcznie, a następnie wprowadź szerokość.
- Otwórz Content i użyj Cell selector, aby wybrać komórkę. W sekcji Cell content wybierz Text lub Image. Kliknij dwukrotnie tekst na obszarze roboczym e-maila, aby go edytować, lub wybierz obraz za pomocą elementów sterujących obrazem. Powtórz te czynności dla każdej komórki.
- Kliknij strzałkę wstecz, aby wrócić do menu głównej zawartości i zapisać zmiany w tabeli.
Aby dostosować dopełnienie tabeli (odstęp wokół jej zawartości), kolory obramowania i czcionki, zaznacz tabelę i otwórz Style.
Sprawdź tabelę w podglądzie Urządzenia mobilne. Tabele z wieloma kolumnami mogą być trudne do odczytania na małym ekranie. Aby ukryć kolumnę na urządzeniach mobilnych, otwórz kartę Style tabeli, rozwiń kolumnę w sekcji Kolumny i ustaw opcję Pokaż kolumnę na na Tylko na komputerze.
Aby dowiedzieć się więcej o projektowaniu e-maili, sprawdź nasz przewodnik po edytorze szablonów e-mailowych
Dodatkowe źródła
- How to add a first name to an email, SMS, or push message
Learn how to add a variable that dynamically populates a recipient’s first name in an email, SMS, or push message. These are supported in campaigns and flows, the body of any message, and an email’s subject line.
- Accessibility in emails and forms best practice reference
Learn how to make your emails and sign-up forms more accessible. When designing your emails and signup forms, you’ll want to make sure your designs are accessible to all of your recipients.