[{"data":1,"prerenderedAt":730},["ShallowReactive",2],{"search-de":3,"content-de-guide\u002Femail-editor":4,"surround-de-\u002Fguide\u002Femail-editor":721},[],{"id":5,"title":6,"body":7,"description":713,"extension":714,"meta":715,"navigation":716,"path":717,"seo":718,"stem":719,"__hash__":720},"content_de\u002F1.guide\u002F3.email-editor.md","E-Mail-Editor",{"type":8,"value":9,"toc":687},"minimark",[10,14,19,32,37,150,154,216,220,292,296,311,332,336,339,367,370,374,377,403,406,410,413,431,436,439,446,462,465,469,472,475,479,486,490,493,514,518,521,525,536,540,565,569,580,584,587,615,620,624,638,642,650,654],[11,12,13],"p",{},"Der E-Mail-Editor von Owlat ist ein blockbasierter visueller Editor für responsive, professionelle E-Mails. Jeder Block, den Sie hinzufügen, wird in allen E-Mail-Clients einheitlich dargestellt — Desktop, Mobilgeräte, Outlook, Gmail und Apple Mail.",[15,16,18],"h2",{"id":17},"blöcke-hinzufügen","Blöcke hinzufügen",[11,20,21,22,26,27,31],{},"Der wichtigste Weg, Inhalte hinzuzufügen, sind ",[23,24,25],"strong",{},"Slash-Befehle",". Klicken Sie in die Editor-Fläche und tippen Sie ",[28,29,30],"code",{},"\u002F"," gefolgt vom Blocktyp, um ihn einzufügen.",[33,34,36],"h3",{"id":35},"inhaltsblöcke","Inhaltsblöcke",[38,39,40,53],"table",{},[41,42,43],"thead",{},[44,45,46,50],"tr",{},[47,48,49],"th",{},"Befehl",[47,51,52],{},"Was er erzeugt",[54,55,56,67,84,100,110,120,130],"tbody",{},[44,57,58,64],{},[59,60,61],"td",{},[28,62,63],{},"\u002Ftext",[59,65,66],{},"Einen Absatz Fließtext",[44,68,69,81],{},[59,70,71,74,75,74,78],{},[28,72,73],{},"\u002Fh1",", ",[28,76,77],{},"\u002Fh2",[28,79,80],{},"\u002Fh3",[59,82,83],{},"Überschriften in drei Größen",[44,85,86,91],{},[59,87,88],{},[28,89,90],{},"\u002Fimage",[59,92,93,94,99],{},"Einen Bildblock mit Alt-Text und optionalem Link (unterstützt die Auswahl aus der ",[95,96,98],"a",{"href":97},"\u002Fguide\u002Fmedia-library","Medienbibliothek",")",[44,101,102,107],{},[59,103,104],{},[28,105,106],{},"\u002Fbutton",[59,108,109],{},"Eine Call-to-Action-Schaltfläche",[44,111,112,117],{},[59,113,114],{},[28,115,116],{},"\u002Fvideo",[59,118,119],{},"Ein Video-Vorschaubild mit überlagerter Play-Schaltfläche",[44,121,122,127],{},[59,123,124],{},[28,125,126],{},"\u002Fsocial",[59,128,129],{},"Icon-Links zu sozialen Netzwerken (17 Plattformen, darunter Twitter\u002FX, Facebook, Instagram, LinkedIn, YouTube, TikTok, GitHub, WhatsApp, Telegram, Threads, Pinterest, Discord, Mastodon, Bluesky, Vimeo, Medium, Snapchat)",[44,131,132,137],{},[59,133,134],{},[28,135,136],{},"\u002Ftable",[59,138,139,140,74,143,146,147,99],{},"Eine Datentabelle mit Zeilen und Spalten (unterstützt auf Mobilgeräten die responsiven Modi ",[28,141,142],{},"stack",[28,144,145],{},"scroll"," und ",[28,148,149],{},"hide-columns",[33,151,153],{"id":152},"layout-blöcke","Layout-Blöcke",[38,155,156,164],{},[41,157,158],{},[44,159,160,162],{},[47,161,49],{},[47,163,52],{},[54,165,166,176,186,196,206],{},[44,167,168,173],{},[59,169,170],{},[28,171,172],{},"\u002Fcolumns",[59,174,175],{},"Ein mehrspaltiges Layout (1 bis 4 Spalten)",[44,177,178,183],{},[59,179,180],{},[28,181,182],{},"\u002Fcontainer",[59,184,185],{},"Einen Rahmen, der Blöcke mit gemeinsamem Hintergrund und Innenabstand gruppiert",[44,187,188,193],{},[59,189,190],{},[28,191,192],{},"\u002Fhero",[59,194,195],{},"Einen Hero-Bereich über die volle Breite mit Unterstützung für Hintergrundbilder",[44,197,198,203],{},[59,199,200],{},[28,201,202],{},"\u002Fdivider",[59,204,205],{},"Eine waagerechte Trennlinie",[44,207,208,213],{},[59,209,210],{},[28,211,212],{},"\u002Fspacer",[59,214,215],{},"Vertikalen Abstand zwischen Blöcken",[33,217,219],{"id":218},"fortgeschrittene-blöcke","Fortgeschrittene Blöcke",[38,221,222,230],{},[41,223,224],{},[44,225,226,228],{},[47,227,49],{},[47,229,52],{},[54,231,232,242,252,262,272,282],{},[44,233,234,239],{},[59,235,236],{},[28,237,238],{},"\u002Faccordion",[59,240,241],{},"Aufklappbare Inhaltsabschnitte",[44,243,244,249],{},[59,245,246],{},[28,247,248],{},"\u002Fmenu",[59,250,251],{},"Ein waagerechtes Navigationsmenü",[44,253,254,259],{},[59,255,256],{},[28,257,258],{},"\u002Flist",[59,260,261],{},"Eine gestaltete Liste mit eigenen Aufzählungszeichen",[44,263,264,269],{},[59,265,266],{},[28,267,268],{},"\u002Fcarousel",[59,270,271],{},"Ein scrollbares Bilderkarussell",[44,273,274,279],{},[59,275,276],{},[28,277,278],{},"\u002Fprogress",[59,280,281],{},"Eine visuelle Fortschrittsanzeige",[44,283,284,289],{},[59,285,286],{},[28,287,288],{},"\u002Fhtml",[59,290,291],{},"Einfügen von rohem HTML für eigenen Code (für Fortgeschrittene)",[33,293,295],{"id":294},"gespeicherte-blöcke","Gespeicherte Blöcke",[11,297,298,299,303,304,307,308,310],{},"Ihre ",[95,300,302],{"href":301},"\u002Fguide\u002Fsaved-blocks","gespeicherten Blöcke"," erscheinen im Slash-Menü in der Gruppe ",[23,305,306],{},"Gespeichert",", jeweils unter ihrem eigenen Namen. Tippen Sie nach ",[28,309,30],{}," den Namen eines gespeicherten Blocks, um danach zu filtern und ihn einzufügen.",[312,313,316],"callout",{"type":314,"title":315},"tip","Variablen einfügen",[11,317,318,319,322,323,326,327,331],{},"Personalisierungsvariablen sind kein Slash-Befehl. Tippen Sie ",[28,320,321],{},"{{"," oder ",[28,324,325],{},"@"," innerhalb eines Textblocks, um die Variablenauswahl zu öffnen — siehe ",[95,328,330],{"href":329},"#personalization-with-variables","Personalisierung mit Variablen"," weiter unten.",[15,333,335],{"id":334},"textformatierung","Textformatierung",[11,337,338],{},"Markieren Sie Text innerhalb eines Textblocks, um die Formatierungsleiste einzublenden:",[340,341,342,355,361],"ul",{},[343,344,345,74,348,146,351,354],"li",{},[23,346,347],{},"Fett",[23,349,350],{},"Kursiv",[23,352,353],{},"Unterstrichen"," zur Hervorhebung",[343,356,357,360],{},[23,358,359],{},"Links"," — Text markieren und eine URL hinterlegen",[343,362,363,366],{},[23,364,365],{},"Ausrichtung"," — links, zentriert oder rechts",[11,368,369],{},"Um die Textfarbe zu ändern, setzen Sie die Farbe des Blocks in dessen Einstellungs-Popover — Farbe ist eine Eigenschaft auf Blockebene, kein Inline-Format für eine Auswahl.",[15,371,373],{"id":372},"blockeigenschaften","Blockeigenschaften",[11,375,376],{},"Klicken Sie einen beliebigen Block an, um sein Einstellungs-Popover zu öffnen. Häufige Einstellungen sind:",[340,378,379,385,391,397],{},[343,380,381,384],{},[23,382,383],{},"Innenabstand"," — der Abstand rund um den Inhalt des Blocks",[343,386,387,390],{},[23,388,389],{},"Hintergrundfarbe"," — der Hintergrund des Blocks",[343,392,393,396],{},[23,394,395],{},"Eckenradius"," — abgerundete Ecken",[343,398,399,402],{},[23,400,401],{},"Volle Breite"," — den Hintergrund des Blocks über die gesamte Viewport-Breite ziehen",[11,404,405],{},"Verschiedene Blocktypen haben zusätzliche, spezifische Einstellungen. Bildblöcke haben zum Beispiel Felder für Alt-Text und Link-URL, während Schaltflächenblöcke Steuerelemente für Beschriftung, URL und Stil bieten.",[15,407,409],{"id":408},"layout-mit-spalten","Layout mit Spalten",[11,411,412],{},"Spalten sind die Grundlage komplexer E-Mail-Layouts. Erstellen Sie nebeneinanderliegende Bereiche für Dinge wie Bild-plus-Text, Feature-Raster oder mehrere Produkte nebeneinander.",[414,415,416,422,425,428],"ol",{},[343,417,418,419,421],{},"Tippen Sie ",[28,420,172],{},", um ein Spaltenlayout einzufügen.",[343,423,424],{},"Wählen Sie die Anzahl der Spalten (1 bis 4).",[343,426,427],{},"Ziehen Sie Inhaltsblöcke in die einzelnen Spalten.",[343,429,430],{},"Passen Sie Einstellungen pro Spalte an, etwa Hintergrund, Innenabstand und vertikale Ausrichtung.",[312,432,433],{"type":314},[11,434,435],{},"Auf Mobilgeräten werden Spalten automatisch untereinander gestapelt, damit Ihr Inhalt lesbar bleibt. Sie können Spalten außerdem so einstellen, dass sie ihre Reihenfolge auf Mobilgeräten umkehren, oder das Stapeln ganz deaktivieren, wenn Spalten nebeneinander bleiben sollen.",[15,437,330],{"id":438},"personalisierung-mit-variablen",[11,440,418,441,322,443,445],{},[28,442,321],{},[28,444,325],{}," innerhalb eines Textblocks, um die Variablenauswahl zu öffnen und dynamische Inhalte einzufügen, die beim Versand durch kontaktspezifische Daten ersetzt werden:",[340,447,448,451,459],{},[343,449,450],{},"Kontaktfelder wie Vorname, Nachname und E-Mail",[343,452,453,454,458],{},"Eigene ",[95,455,457],{"href":456},"\u002Fguide\u002Fcontact-properties","Kontakteigenschaften",", die Sie definiert haben",[343,460,461],{},"Systemvariablen wie Abmeldelinks",[11,463,464],{},"Variablen lassen Ihre E-Mails persönlich wirken, ohne dass Sie für jede Empfängerin und jeden Empfänger eigene Versionen anlegen müssen.",[15,466,468],{"id":467},"bedingte-inhalte","Bedingte Inhalte",[11,470,471],{},"Blenden Sie Abschnitte Ihrer E-Mail abhängig von den Daten eines Kontakts ein oder aus. Zeigen Sie zum Beispiel einen Premium-CTA nur Kontakten mit bezahltem Tarif oder unterschiedliche Inhalte je nach Sprache oder Standort eines Kontakts.",[11,473,474],{},"Bedingte Blöcke werten die Eigenschaftswerte eines Kontakts zum Versandzeitpunkt aus und nehmen Inhalte entsprechend auf oder lassen sie weg.",[15,476,478],{"id":477},"wiederholungsblöcke","Wiederholungsblöcke",[11,480,481,482,485],{},"Ein Block kann für jedes Element einer Array-Variablen einmal wiederholt werden — nützlich für Bestellpositionen, Produktlisten oder Empfehlungen. Legen Sie im Einstellungsbereich des Blocks die Array-Variable fest, über die iteriert wird, einen Element-Alias, um auf jeden Eintrag zu verweisen (",[28,483,484],{},"{{item.key}}","), und optional eine maximale Anzahl von Elementen. Der Renderer expandiert den Block beim Versand für jedes Array-Element.",[15,487,489],{"id":488},"responsives-design","Responsives Design",[11,491,492],{},"Ihre E-Mails sind automatisch responsiv:",[340,494,495,498,501,504],{},[343,496,497],{},"Spalten stapeln sich auf kleinen Bildschirmen",[343,499,500],{},"Bilder passen ihre Größe an den Viewport an",[343,502,503],{},"Schriftgrößen lassen sich für die Lesbarkeit auf Mobilgeräten anpassen",[343,505,506,507,322,510,513],{},"Einzelne Blöcke können auf ",[23,508,509],{},"auf Mobilgeräten ausblenden",[23,511,512],{},"auf dem Desktop ausblenden"," gesetzt werden, um Inhalte gezielt zuzuschneiden",[15,515,517],{"id":516},"dark-mode","Dark Mode",[11,519,520],{},"E-Mails bringen automatische Unterstützung für den Dark Mode mit. Wenn der E-Mail-Client einer empfangenden Person auf Dark Mode steht, passt sich Ihre E-Mail an. Sie können außerdem Dark-Mode-Überschreibungen pro Block konfigurieren und alternative Bilder hinterlegen, die auf dunklem Hintergrund besser wirken.",[15,522,524],{"id":523},"fokusmodus","Fokusmodus",[11,526,527,528,531,532,535],{},"Drücken Sie ",[23,529,530],{},"Cmd+Shift+F"," (Mac) oder ",[23,533,534],{},"Strg+Shift+F"," (Windows), um in den Fokusmodus für ablenkungsfreies Bearbeiten zu wechseln. Die Seitenleisten werden ausgeblendet und die Editor-Fläche füllt Ihren Bildschirm.",[15,537,539],{"id":538},"rückgängig-wiederherstellen","Rückgängig & Wiederherstellen",[11,541,542,543,146,546,549,550,553,554,557,558,553,561,564],{},"Jede Bearbeitung wird in einem Verlaufsstapel festgehalten. Nutzen Sie die Schaltflächen ",[23,544,545],{},"Rückgängig",[23,547,548],{},"Wiederherstellen"," in der Werkzeugleiste oder drücken Sie ",[23,551,552],{},"Cmd+Z"," \u002F ",[23,555,556],{},"Strg+Z"," zum Rückgängigmachen und ",[23,559,560],{},"Cmd+Shift+Z",[23,562,563],{},"Strg+Shift+Z"," zum Wiederherstellen. Die Schaltflächen deaktivieren sich selbst, wenn nichts mehr rückgängig gemacht oder wiederhergestellt werden kann.",[15,566,568],{"id":567},"ihre-arbeit-speichern","Ihre Arbeit speichern",[11,570,571,572,575,576,579],{},"Gespeichert wird manuell. Nutzen Sie die Schaltfläche ",[23,573,574],{},"Speichern"," in der Werkzeugleiste, um Ihre Änderungen festzuschreiben; während des Schreibens zeigt die Schaltfläche einen Spinner und die Beschriftung ",[23,577,578],{},"Wird gespeichert...",". Wenn Sie den Editor mit ungespeicherten Änderungen verlassen möchten, fordert Owlat Sie auf, sie zuerst zu speichern oder zu verwerfen, damit Sie durch das Wegnavigieren keine Arbeit verlieren.",[15,581,583],{"id":582},"vorschau","Vorschau",[11,585,586],{},"Nutzen Sie das Vorschau-Panel, um vor dem Versand zu sehen, wie Ihre E-Mail aussehen wird. Die Vorschau verwendet dieselbe Rendering-Engine wie Ihre versendeten E-Mails — was Sie sehen, ist also das, was Ihre Empfängerinnen und Empfänger erhalten. Das Panel bietet:",[340,588,589,596,603,609],{},[343,590,591,592,595],{},"Eine ",[23,593,594],{},"Geräteauswahl"," — Vorschau in Desktop-, Tablet- oder Mobilbreite",[343,597,598,599,602],{},"Einen ",[23,600,601],{},"Dark-Mode-Umschalter",", um zu prüfen, wie sich die E-Mail in dunklen Clients anpasst",[343,604,591,605,608],{},[23,606,607],{},"Codeansicht",", um den erzeugten HTML-Quelltext zu inspizieren",[343,610,598,611,614],{},[23,612,613],{},"E-Mail-Gesundheitswert",", der schon beim Bauen Warnungen zu Darstellung und Zustellbarkeit sichtbar macht",[312,616,617],{"type":314},[11,618,619],{},"Schauen Sie sich während des Bauens häufig die Vorschau an — besonders nach dem Hinzufügen von Spalten oder bedingten Inhalten. Layoutprobleme früh zu erkennen spart Zeit.",[15,621,623],{"id":622},"css-animationen","CSS-Animationen",[11,625,626,627,322,630,633,634,637],{},"Blöcke können eingebaute CSS-Animationen als Progressive Enhancement nutzen. Fügen Sie die Klasse ",[28,628,629],{},"owlat-animate-fade-in",[28,631,632],{},"owlat-animate-slide-up"," im Feld für CSS-Klassen des Blocks hinzu (das Feld wird unverändert durchgereicht, verwenden Sie also exakt diesen Klassennamen). Die Animationen respektieren ",[28,635,636],{},"prefers-reduced-motion"," und laufen nur, wenn die Nutzerin oder der Nutzer Bewegung zulässt. Sie funktionieren in Apple Mail und iOS Mail; andere Clients ignorieren sie stillschweigend.",[15,639,641],{"id":640},"gmail-promotions-annotationen","Gmail-Promotions-Annotationen",[11,643,644,645,649],{},"Wenn Sie an Gmail-Nutzerinnen und -Nutzer senden, können Sie Annotationen für den Werbung-Tab hinzufügen, um direkt im Posteingang reichhaltige Karten anzuzeigen (Logo, Deal-Badge, Aktionscode, Ablaufdatum). Diese werden nicht im visuellen Editor gesetzt — sie sind ein Entwickler-Feature, das über die Render-Optionen des Renderers konfiguriert wird, und lassen sich daher nicht aus dem Dashboard heraus hinzufügen. Details finden Sie in der Dokumentation zum ",[95,646,648],{"href":647},"\u002Fdeveloper\u002Femail-renderer","E-Mail-Renderer",".",[15,651,653],{"id":652},"nächste-schritte","Nächste Schritte",[340,655,656,663,668,675,680],{},[343,657,658,662],{},[95,659,661],{"href":660},"\u002Fguide\u002Femail-templates","E-Mail-Vorlagen"," — Ihre Vorlagenbibliothek verwalten",[343,664,665,667],{},[95,666,295],{"href":301}," — Inhaltsabschnitte speichern und wiederverwenden",[343,669,670,674],{},[95,671,673],{"href":672},"\u002Fguide\u002Femail-theme","E-Mail-Theme"," — Standardgestaltung für Ihre E-Mails festlegen",[343,676,677,679],{},[95,678,98],{"href":97}," — Bilder über alle E-Mails hinweg verwalten und wiederverwenden",[343,681,682,686],{},[95,683,685],{"href":684},"\u002Fguide\u002Fcampaigns","Kampagnen & Auswertung"," — Ihre fertigen E-Mails versenden",{"title":688,"searchDepth":689,"depth":689,"links":690},"",2,[691,698,699,700,701,702,703,704,705,706,707,708,709,710,711,712],{"id":17,"depth":689,"text":18,"children":692},[693,695,696,697],{"id":35,"depth":694,"text":36},3,{"id":152,"depth":694,"text":153},{"id":218,"depth":694,"text":219},{"id":294,"depth":694,"text":295},{"id":334,"depth":689,"text":335},{"id":372,"depth":689,"text":373},{"id":408,"depth":689,"text":409},{"id":438,"depth":689,"text":330},{"id":467,"depth":689,"text":468},{"id":477,"depth":689,"text":478},{"id":488,"depth":689,"text":489},{"id":516,"depth":689,"text":517},{"id":523,"depth":689,"text":524},{"id":538,"depth":689,"text":539},{"id":567,"depth":689,"text":568},{"id":582,"depth":689,"text":583},{"id":622,"depth":689,"text":623},{"id":640,"depth":689,"text":641},{"id":652,"depth":689,"text":653},"Ein blockbasierter visueller Editor für responsive E-Mails, die auf Desktop, Mobilgeräten, in Outlook, Gmail und Apple Mail einheitlich dargestellt werden.","md",{},true,"\u002Fguide\u002Femail-editor",{"title":6,"description":713},"1.guide\u002F3.email-editor","Qcnhxg_Zl97fzo2pFDia-gRWKMP6_gXPD7qPsbgQLN8",[722,726],{"title":723,"path":724,"stem":725,"children":-1},"Team-Postfach","\u002Fguide\u002Fteam-inbox","1.guide\u002F29.team-inbox",{"title":727,"path":728,"stem":729,"children":-1},"KI-Agent & Autonomie","\u002Fguide\u002Fai-agent","1.guide\u002F30.ai-agent",1786915099636]