Projektowanie w edytorze Drag-and-Drop

Kreator e-mail Drag-and-Drop w MessageFlow to intuicyjne narzędzie typu no-code. Pozwala on na błyskawiczne projektowanie atrakcyjnych wizualnie i wysoko konwertujących wiadomości. Dzięki funkcji przeciągnij i upuść przygotujesz swój wymarzony szablon bez konieczności pisania ani jednej linijki kodu HTML.

Narzędzie daje Ci pełną swobodę twórczą i zapewnia innowacyjny tryb projektowania mobilnego. Dzięki niemu masz 100% kontroli nad tym, jak Twoja kreacja wygląda na ekranach smartfonów.

Jak poruszać się po edytorze?

Interfejs edytora został zaprojektowany wokół trzech kluczowych zakładek, które znajdziesz w panelu po prawej stronie ekranu:

• Wiersze: Stanowią szkielet Twojego projektu. To poziome kontenery, w których organizujesz przestrzeń. Możesz wybrać wiersz jednokolumnowy dla szerokiego zdjęcia głównego (Hero Image) lub układy dwu- i trójkolumnowe do prezentacji produktów.

• Zawartość: To właściwe elementy Twojej wiadomości. Znajdziesz tu bloki takie jak Tekst, Obraz, Przycisk CTA, Separator czy ikony mediów społecznościowych. To te bloki przeciągasz i umieszczasz wewnątrz wcześniej przygotowanych Wierszy.

• Ustawienia: Centrum zarządzania globalnym wyglądem kreacji. Ustalasz tutaj domyślną szerokość obszaru treści, kolor tła całej wiadomości oraz domyślną typografię dla linków i tekstów.

Tworzenie krok po kroku

Budowa wiadomości w edytorze to prosty i logiczny proces. Pamiętaj, aby zawsze zaczynać od struktury.

1. Zbuduj szkielet: Przejdź do zakładki Wiersze, wybierz odpowiedni układ kolumn i przeciągnij go na pusty obszar roboczy.

2. Dodaj treść: Przełącz się na zakładkę Zawartość. Chwyć wybrany blok (na przykład Obraz) i upuść go wewnątrz przygotowanego wiersza. Jeśli posiadasz własny fragment kodu, użyj bloku HTML.

3. Modyfikuj i personalizuj: Kliknij dowolny element w obszarze roboczym, aby otworzyć jego szczegółowe właściwości.

   • Dla Przycisków zmienisz kolor tła, zaokrąglenie rogów i dodasz podlinkowanie.

   • Dla Tekstów uruchomi się zaawansowany edytor przypominający edytory tekstowe, w którym pogrubisz słowa, wstawisz linki i dodasz znaczniki personalizacji.

Personalizacja treści (Tagi systemowe i Pola dodatkowe):

Możesz dynamicznie podmieniać zawartość swojej wiadomości, opierając się na danych z Twojej bazy kontaktów.

• Podstawowa personalizacja: W edytorze tekstu rozwiń menu i wybierz znacznik (na przykład Imię). System wstawi tag ##FirstName##, który przy wysyłce zamieni się na prawdziwe imię odbiorcy (pod warunkiem że znajduje się ono w zaimportowanej bazie kontaktów).

• Zaawansowane Pola dodatkowe: MessageFlow pozwala na personalizację o dowolne zmienne (na przykład miasto, indywidualny kod rabatowy). Najpierw utwórz odpowiednie pole w zakładce Kontakty -> Pola dodatkowe, a następnie wgraj bazę odbiorców, mapując odpowiednią kolumnę pliku do nowo utworzonego pola. Zmienną tę możesz wykorzystać w każdej kampanii masowej.

Ważne: Nie zapomnij o dodaniu bloku Tekst i umieszczeniu w nim Linku Rezygnacji. Jest to kluczowe dla zachowania zgodności z RODO i utrzymania higieny Twojej bazy odbiorców.

Tryb projektowania mobilnego

Zamiast zwykłego podglądu, edytor oferuje Ci w pełni interaktywny tryb edycji mobilnej. Kliknij ikonę telefonu widoczną w lewym górnym rogu obszaru roboczego, aby przełączyć widok. W tym trybie każda zmiana, jaką wprowadzisz we właściwościach bloków, dotyczy wyłącznie ekranów urządzeń mobilnych. Co możesz zrobić?

• Zmniejszyć rozmiar czcionki nagłówków, aby nie łamały się na małym ekranie.

• Zmienić wyrównanie tekstu z lewej strony na środek.

• Zmniejszyć wewnętrzne marginesy (paddingi) wierszy.

• Ukryć wybrane elementy: Możesz zdecydować, że dany blok (na przykład duży, ozdobny obraz) nie będzie w ogóle wyświetlany na telefonach. Upraszcza to przekaz i przyspiesza ładowanie wiadomości na łączach komórkowych.

Zapis i podgląd pracy

Zanim ruszysz dalej, zawsze sprawdzaj ostateczny wygląd kampanii. Użyj przycisku Podgląd, aby zobaczyć kreację bez paneli bocznych edytora.

Zapisywanie i pobieranie gotowych szablonów

Gotowy projekt nie musi być jednorazowy. Możesz go łatwo zapisać i wykorzystać ponownie:

• Zapisz jako nowy szablon: W górnym pasku edytora kliknij ten przycisk, aby zachować układ na przyszłość. Podaj nazwę, a projekt trafi do zakładki Twoje szablony widocznej przy tworzeniu nowej kampanii.

• Pobieranie pliku HTML: Jeśli chcesz wykorzystać swoją kreację poza panelem kampanii (na przykład do wdrożenia jej na serwerach wysyłkowych API), przejdź do kroku 1 kreatora (Kreacja e-mail) i otwórz zakładkę Twoje szablony. Najedź kursorem na wybrany projekt i kliknij Pobierz. Plik zostanie zapisany na Twoim dysku pod nazwą index.html.

Ważne: Jeśli z szablonu nie usuniesz systemowego linku wypisu, po pobraniu kodu HTML i użyciu go w kanale API, link ten będzie nieklikalny i nie zadziała poprawnie.

Gdy Twoja kreacja jest w 100% gotowa i satysfakcjonująca, po prostu kliknij Dalej w kreatorze kampanii.