E-mail készítő
Vizuális e-mail készítő HTML e-mailekhez, AI generálással és dinamikus tartalomváltozókkal.
E-mail formátum
Minden itt készített e-mail HTML formátumban jön létre:
- Hagyományos HTML tábla elrendezéseket használ az e-mail kompatibilitáshoz
- Manuális reszponzív dizájn megfontolásokat igényel
- Rugalmasabb az egyedi stílusokhoz és elrendezésekhez
Szerkesztő funkciók
Vizuális építőelemek
A szerkesztő fogd-és-vidd építőelemeket biztosít:
- Struktúra komponensek: Szekciók, oszlopok és konténerek
- Tartalom elemek: Szöveg, képek, gombok és hivatkozások
- Stílus opciók: Színek, betűtípusok, térközök és reszponzív viselkedés
A munkád mentése
Ha mentetlen változtatásokkal hagyod el az oldalt, a szerkesztő megkérdezi, hogy mented vagy elveted őket.
Teszt e-mail küldés
Kattints a „Teszt email küldése” gombra egy ablak megnyitásához, ahol:
- Kiválaszthatod a címzett e-mail-címeket (több teszt címzettet is hozzáadhatsz)
- Választhatsz egy ellenőrzött feladói e-mailt a szervezetedből
- Elküldheted az aktuális e-mail sablont az egyedi tárgyaddal, előfejléceddel és feladó neveddel
Ez lehetővé teszi, hogy megtekinthesd, hogyan jelenik meg az e-mailed valós e-mail kliensekben, és biztosítsd, hogy minden dinamikus tartalom és stílus helyesen renderelődik a teljes közönségnek való kiküldés előtt.
Szegély láthatóság kapcsoló
Használd a „View components” parancsot a komponens határok és térközök vizualizálásához tervezés közben.
Az eszköztár
A vászon feletti műveletek aszerint vannak csoportosítva, hogy mit csinálnak:
- Tartalom — Tartalom betöltése (sablon vagy korábbi levél behozása) és Mentés sablonként.
- Kód — Kód importálása és Kód szerkesztése.
- Teszt email küldése — a papírrepülő ikonos gomb.
- Sablon megtartása — a kapcsoló, amely eldönti, mihez nyúlhat az AI (lásd lentebb). Csak akkor jelenik meg, ha a levélnek van Tartalomterülete.
- Generálás AI-val — megnyitja az AI ablakot.
Keskeny képernyőn az első három egyetlen menübe kerül össze.
Kódkezelés
Kód importálása
Meglévő HTML kód importálása közvetlenül a szerkesztőbe:
- Nyisd meg a Kód → Kód importálása menüpontot külső sablonok betöltéséhez
- HTML formátumot fogad
- Automatikusan elemzi és szerkeszthető komponensekké alakítja a kódot
Kód szerkesztése
Hozzáférés a nyers kód nézethez haladó szerkesztéshez:
- Nyisd meg a Kód → Kód szerkesztése menüpontot a Monaco szerkesztő megnyitásához (ugyanaz a szerkesztő, amely a VS Code-ot is működteti)
- HTML szintaxiskiemelés, automatikus behúzás, zárójel-illesztés és sortörés
- Automatikus kódformázás a szerkesztő megnyitásakor
- Az „Alkalmaz” gomb visszaviszi a módosításokat a vizuális szerkesztőbe, a „Mégse” elveti őket
AI-alapú generálás
Az eszköztár Generálás AI-val gombja az AI ablakot nyitja meg a szerkesztett levélhez. Sablonokra épül: a sablon egy teljes levél egy Tartalomterülettel, és a Tartalomterületen kívül minden pontosan úgy marad, ahogy megtervezted.
Azt, hogy mihez nyúlhat az AI, a gomb melletti Sablon megtartása kapcsoló dönti el, nem az ablak:
- Bekapcsolva (alapértelmezett) — az AI csak a Tartalomterületre ír. A fejléc, a lábléc, a színek és az elrendezés pontosan úgy maradnak, ahogy vannak.
- Kikapcsolva — az AI újratervezheti a teljes levelet, a fejléccel és a lábléccel együtt.
A sablonszerkesztőben ugyanez a kapcsoló Keret megtartása néven szerepel. Ha bekapcsolt állapotban kérsz fejléc- vagy láblécmódosítást, az AI a kérés többi részét elvégzi, majd szól, mit hagyott ki.
Az ablakban leírod a levelet. Ha a szerkesztőben már van tartalom, előbb választasz: Ennek a levélnek a módosítása (hivatkozz arra, ami már ott van: „rövidítsd a bevezetőt”, „legyen zöld a gomb”) vagy Új levél írása (a tartalom cserélődik). A módosítás mindent újraír, amihez az AI hozzányúlhat — a Tartalomterületet, kikapcsolt kapcsolónál pedig az egész levelet —, nem csak egyes sorokat javít, így az általad nem említett megfogalmazások is kissé átfogalmazva térhetnek vissza. Emellett legfeljebb három korábbi levél szövegét újrahasznosíthatod, engedélyezheted a {{variable}} helyőrzőket, és 1–3 AI-képet adhatsz hozzá külön stílusutasításokkal.
Az eredmény egyből a szerkesztőbe kerül; az értesítés Visszavonás gombja visszaállítja az előző tartalmat, és ha újra megnyitod az AI-t az Ennek a levélnek a módosítása lehetőséggel, finomíthatod.
Egyetlen kép generálása
Kattints duplán bármelyik képre a vásznon, és a képtár a Kép generálása AI-val panellel nyílik meg: írd le a képet, válassz Széles, Fekvő vagy Négyzet alakot, és kattints a Generálás gombra. Úgy kerül a képeid közé, mint egy feltöltés, és rákerül arra a képre, amelyiket szerkesztetted. A generált képek képenként kerülnek elszámolásra az AI-kreditedből.
A sablon kerete
- Keret a sablonból — a sablonból indított levél megtartja a sablon fejlécét és láblécét a Tartalomterület körül; az eszköztár a sablon nevét mutatja. Minden szerkeszthető, a keret is — a módosítások csak erre a levélre vonatkoznak, a mentett sablon nem változik.
- Az AI is így működik — bekapcsolt Sablon megtartása mellett a Tartalomterületen kívül minden pontosan úgy marad, ahogy van, és ha a kérésed a fejlécet vagy a láblécet érintené, az AI visszajelzi, hogy ezt nem tudta megtenni. Kikapcsolva a fejléchez és a lábléchez is hozzányúlhat.
- Tartalomterület — a szaggatott zóna a vásznon. Húzz bele blokkokat; mozgatható, de nem törölhető.
- Stílusos blokkok — a blokkpanel teteje: címsorok, bekezdések, gombok, kártyák és továbbiak, már a levél színeiben és betűtípusaival; a szerkesztő saját blokkjai alatta, az Alap blokkok között vannak.
- Tartalom → Tartalom betöltése — behoz egy sablont vagy egy korábbi levelet. Mindig mindent lecserél, ami most a szerkesztőben van — a tartalmat, a fejlécet és a láblécet is —, és előbb megerősítést kér, mert a nem mentett munkád elvész.
- Tartalom → Mentés sablonként — a teljes levélből új sablon lesz, a tartalma kezdő tartalomként marad a Tartalomterületen.
Dinamikus tartalom és változók
Alap mezők
Előre definiált változók az általános kapcsolattartási adatokhoz:
{{email}}
{{name}}
{{created_at}}
{{state}}
Egyedi mezők
Szervezet-specifikus változók a kapcsolat adatbázisodból:
{{customFieldName}}
Fenntartott változók
Rendszer által generált URL-ek az e-mail kezeléshez:
{{subscribeURL}}
{{unsubscribeURL}}
{{unsubscribeURL}}-t egy szokásos e-mailbe — vagy a {{subscribeURL}}-t egy ellenőrző e-mailbe —, az automatikusan a lábléchez adódik.Tartalék értékek
Ha egy kontakthoz nincs tárolt érték egy változóhoz, a nyers tag látható marad az elküldött e-mailben. A tagen belül egy függőleges vonal után tartalék értéket adhatsz meg, amely ilyenkor a helyére kerül:
{{name|kedves olvasó}}— a „kedves olvasó” szöveget küldi, ha a kontakt neve hiányzik vagy üres{{name|}}— az üres tartalék egyszerűen üresen hagyja a helyet{{name}}— tartalék nélkül a tag látható marad, így a hibák könnyen kiszúrhatók a teszt küldéseknél
Tárgy és előnézeti szöveg személyre szabása
A változók és tartalék értékek a tárgysorban és az előnézeti szövegben (preheader) is működnek — gépeld be őket ugyanúgy, mint az e-mail törzsébe. A kampánylisták és előnézetek továbbra is a nyers taget mutatják; a valódi érték küldéskor kerül be minden címzettnél.
Használati útmutató
E-mail felépítése
- Húzd és ejtsd az építőelemeket az oldalsávból
- Szabd testre a tartalmat, stílust és elrendezést
- Használd az AI generátort a kezdeti tartalom létrehozásához
- Finomítsd közvetlen kód szerkesztéssel, ha szükséges
Dinamikus adat integráció
Illeszd be a változókat a {{variableName}} mintával:
- Kattints a szöveg elemekre a tartalom szerkesztéséhez
- Írd be vagy illeszd be a változó helyőrzőket
- A változók a tényleges adatokra cserélődnek az e-mailek kiküldésekor
Gomb műveletek
Állítsd be a gomb hivatkozásokat fenntartott változókra a felhasználókezeléshez:
- Használd a
{{subscribeURL}}-t a feliratkozás megerősítéséhez - Használd az
{{unsubscribeURL}}-t a könnyű leiratkozáshoz - A hivatkozások automatikusan kezelik a felhasználói preferenciákat
Lábléc tartalék
Ha nem teszed bele az {{unsubscribeURL}}-t egy szokásos e-mailbe, vagy a {{subscribeURL}}-t egy ellenőrző e-mailbe, az automatikusan a lábléchez adódik a megfelelőség biztosítása érdekében.