Edit mobile newsletters

Nutze den sichtbaren Modusschalter Desktop or Mobile oberhalb der Arbeitsfläche. Die Mobile-Ansicht zeigt eine schmale Arbeitsfläche. Sie dient dazu, die Darstellung für kleine Bildschirme gezielt anzupassen, ohne den Desktop-Entwurf zu verändern.

So funktionieren mobile Abweichungen {#mobile-overrides}

Wähle in der Mobile-Ansicht einen Baustein aus und ändere eine verfügbare Eigenschaft im Style Editor. Die Änderung wird nur für die mobile Darstellung gespeichert. In der Regel verwendet die Mobile-Ansicht zunächst die Desktop-Einstellung. Eine Ausnahme sind Bilder mit fester Breite: Beim ersten Wechsel in den Modus Mobile legt der Editor dafür automatisch eine prozentuale mobile Breite an, damit das Bild responsiv bleibt.

Typische mobile Anpassungen sind Textgröße und Zeilenhöhe, Innenabstand, Bildbreite und -ausrichtung, Buttonbreite, Farben, Rahmen und Rundungen. Bearbeite nur die Eigenschaft, die auf dem Smartphone tatsächlich angepasst werden muss. Andere Desktop-Einstellungen bleiben erhalten.

Die Mobile-Ansicht ist kein zweiter Newsletter. Der Style Editor zeigt dort jeweils den wirksamen Wert: eine mobile Einstellung, falls Du sie schon gesetzt hast, sonst den Desktop-Wert. Es gibt dabei keine getrennten Eingabefelder für Desktop und Mobil und keine Kennzeichnung für gespeicherte Abweichungen. Wenn ein Wert in beiden Ansichten identisch sein soll, ändere ihn in der Desktop-Ansicht statt ihn zweimal zu pflegen.

Sichtbarkeit und mehrspaltige Bereiche {#mobile-layout}

In Responsive kannst Du für geeignete Bausteine festlegen, ob sie auf Mobile or Desktop angezeigt werden. Nutze das zum Beispiel für ein sehr breites Bild, das auf Mobil durch eine kompaktere Alternative ersetzt wird. Prüfe immer, dass mindestens eine verständliche Version des Inhalts sichtbar bleibt.

Bei einem mehrspaltigen Layout stehen zusätzlich diese Optionen zur Verfügung:

• Spalten untereinander: Die nebeneinanderstehenden Spalten werden auf kleinen Bildschirmen untereinander angezeigt.
• Spalten umkehren: Wenn diese Option verfügbar ist, wird die Reihenfolge der Spalten für die ausgelieferte Newsletter-Version gedreht. Das ist sinnvoll, wenn zum Beispiel auf dem Desktop ein Bild links und der zugehörige Text rechts steht, der Text auf Mobil aber zuerst erscheinen soll.

Wähle dafür den Container des mehrspaltigen Layouts, nicht einen Text- oder Bildbaustein innerhalb der Spalte. Die Optionen erscheinen nicht bei einfachen Einzelbausteinen.

Wenn Du die Option Columns below each other nicht findest, wähle die äußere Layout-Tabelle erneut aus. Die Option Spalten umkehren erscheint nur bei einem unterstützten mehrspaltigen Layout. Der Mobile-Canvas zeigt das Stapeln der Spalten, aber keine umgekehrte Reihenfolge. Prüfe die tatsächliche Reihenfolge nach dem Umkehren deshalb in der Vorschau oder mit einer Testmail.

> Der mobile Bearbeitungsmodus dient der Gestaltung. Strukturelle Änderungen per Drag-and-drop sind dort nicht vorgesehen. Wechsle dafür zurück in die Desktop-Ansicht und optimiere anschließend die mobile Darstellung. E-Mail-Programme können CSS unterschiedlich auslegen; eine Testmail bleibt deshalb der zuverlässigste letzte Check.