diff --git a/E-Mails/README.md b/E-Mails/README.md index 9bc8900..4f3c804 100644 --- a/E-Mails/README.md +++ b/E-Mails/README.md @@ -16,12 +16,28 @@ | `bilder/banner/` | 14 Banner für die Mails in Mailjet | in Mailjet hochladen | | `bilder/webinargeek/` | 4 Banner für B0 bis B3 | für Dejan in WebinarGeek | | `bilder/logo-hivegrid.png`, `signatur-noah.png`, `heft-klein.png` | Logo, Signatur mit Foto, Heft-Bild | in jede Mail | +| `bilder/logo-hivegrid-transparent.png` | Logo ohne Hintergrund | für Kopfbereiche in anderer Farbe | +| `mailjet-import/*.zip` | jede Mailjet-Mail als ZIP mit HTML und Bildern | **schnellster Weg**, direkt in Mailjet importieren | | `quelle/` | Werkzeug, aus dem die Bilder und Vorschauen entstehen | nur zum neu Erzeugen, siehe unten | --- ## So gehst du in Mailjet vor +### Am schnellsten: als ZIP importieren + +Jede Mail ist fertig gepackt, mit Text, Bildern und Buttons. Mailjet lädt die Bilder beim Import selbst hoch. + +1. In Mailjet unter **Meine Marketing-Vorlagen** auf **Neue Vorlage erstellen**, dann **Mit HTML programmieren** und die ZIP-Datei hochladen, z. B. `mailjet-import/k03.zip`. +2. In der Vorlage **„[Vorname]“** durch die Personalisierung ersetzen (Eigenschaft `anrede`, siehe Platzhalter). +3. **`{{ABMELDEN}}`** durch Mailjets Abmelde-Link ersetzen, **`{{HEFT_LINK}}`** und **`{{HARIS_LINK}}`** durch die Links von Dejan. +4. Vorlage speichern und daraus die Kampagne anlegen. Betreff und Vorschautext stehen oben in der Datei und im PDF. +5. Testmail schicken und prüfen, dass Mailjet nichts verschoben hat. + +Mailjet sagt dazu selbst, dass es eigenes HTML nicht prüft. Deshalb ist die Testmail Pflicht. Ändert sich eine Mail in `mails/`, die ZIPs neu packen mit `python3 quelle/pakete.py`. + +### Oder im Drag-and-drop-Editor nachbauen + 1. **Bilder hochladen:** alles aus `bilder/banner/`, dazu Logo, Signatur und Heft-Bild. 2. **Einmal die Vorlage bauen**, nach `mails/k03.html` (das ist die Muster-Mail). Die Werte stehen unten unter „Gestaltung“. Als Vorlage speichern. 3. **Für jede Mail die Vorlage kopieren:** @@ -33,12 +49,7 @@ 4. **Platzhalter ersetzen**, siehe unten. 5. **Testen und einplanen**, wie in der Planung (`../webinar/mail-strecke/README.md`, Schritt 5). -Statt Drag-and-drop geht auch HTML: Bietet Mailjet beim Anlegen eigenes HTML an, kannst du die Datei aus `mails/` nehmen. -- Vorher die Bildpfade (`../bilder/…`) durch die Adressen der hochgeladenen Bilder ersetzen. -- Die Platzhalter ersetzen. -- Den Abmelde-Link von Mailjet einsetzen. - -Prüf dann in der Testmail, dass Mailjet nichts verschoben hat. +**Eigene Bilder in den Editor:** Den Baustein **Bild** in die Spalte ziehen, dann **Bild aus Galerie einfügen** und über **Hochladen** die Datei von hier wählen. Danach unter **Bearbeiten** Breite und Alt-Text setzen. Mailjet nimmt Bilder bis 2 MB, empfiehlt unter 200 KB. Alle Bilder hier liegen darunter. --- diff --git a/E-Mails/bilder/logo-hivegrid-transparent.png b/E-Mails/bilder/logo-hivegrid-transparent.png new file mode 100644 index 0000000..a8449a8 Binary files /dev/null and b/E-Mails/bilder/logo-hivegrid-transparent.png differ diff --git a/E-Mails/mailjet-import/b4a.zip b/E-Mails/mailjet-import/b4a.zip new file mode 100644 index 0000000..9c7a147 Binary files /dev/null and b/E-Mails/mailjet-import/b4a.zip differ diff --git a/E-Mails/mailjet-import/b4b.zip b/E-Mails/mailjet-import/b4b.zip new file mode 100644 index 0000000..d1502b1 Binary files /dev/null and b/E-Mails/mailjet-import/b4b.zip differ diff --git a/E-Mails/mailjet-import/b4c.zip b/E-Mails/mailjet-import/b4c.zip new file mode 100644 index 0000000..2eb4a42 Binary files /dev/null and b/E-Mails/mailjet-import/b4c.zip differ diff --git a/E-Mails/mailjet-import/b5.zip b/E-Mails/mailjet-import/b5.zip new file mode 100644 index 0000000..4b3e19d Binary files /dev/null and b/E-Mails/mailjet-import/b5.zip differ diff --git a/E-Mails/mailjet-import/b6.zip b/E-Mails/mailjet-import/b6.zip new file mode 100644 index 0000000..773b0ba Binary files /dev/null and b/E-Mails/mailjet-import/b6.zip differ diff --git a/E-Mails/mailjet-import/k01.zip b/E-Mails/mailjet-import/k01.zip new file mode 100644 index 0000000..98d2892 Binary files /dev/null and b/E-Mails/mailjet-import/k01.zip differ diff --git a/E-Mails/mailjet-import/k02.zip b/E-Mails/mailjet-import/k02.zip new file mode 100644 index 0000000..a93907c Binary files /dev/null and b/E-Mails/mailjet-import/k02.zip differ diff --git a/E-Mails/mailjet-import/k03.zip b/E-Mails/mailjet-import/k03.zip new file mode 100644 index 0000000..1f66e05 Binary files /dev/null and b/E-Mails/mailjet-import/k03.zip differ diff --git a/E-Mails/mailjet-import/k04.zip b/E-Mails/mailjet-import/k04.zip new file mode 100644 index 0000000..1f9c4a3 Binary files /dev/null and b/E-Mails/mailjet-import/k04.zip differ diff --git a/E-Mails/mailjet-import/k07.zip b/E-Mails/mailjet-import/k07.zip new file mode 100644 index 0000000..d1b8a96 Binary files /dev/null and b/E-Mails/mailjet-import/k07.zip differ diff --git a/E-Mails/mailjet-import/k08.zip b/E-Mails/mailjet-import/k08.zip new file mode 100644 index 0000000..812e1b4 Binary files /dev/null and b/E-Mails/mailjet-import/k08.zip differ diff --git a/E-Mails/mailjet-import/k09.zip b/E-Mails/mailjet-import/k09.zip new file mode 100644 index 0000000..eb47907 Binary files /dev/null and b/E-Mails/mailjet-import/k09.zip differ diff --git a/E-Mails/mailjet-import/k10.zip b/E-Mails/mailjet-import/k10.zip new file mode 100644 index 0000000..f913f9d Binary files /dev/null and b/E-Mails/mailjet-import/k10.zip differ diff --git a/E-Mails/mailjet-import/k11.zip b/E-Mails/mailjet-import/k11.zip new file mode 100644 index 0000000..24c0a6d Binary files /dev/null and b/E-Mails/mailjet-import/k11.zip differ diff --git a/E-Mails/quelle/bilder.html b/E-Mails/quelle/bilder.html index 7baa73d..287efb2 100644 --- a/E-Mails/quelle/bilder.html +++ b/E-Mails/quelle/bilder.html @@ -275,6 +275,8 @@ function banner(id) { const BAUSTEINE = { logo: () => ``, + // Logo ohne Hintergrund, für Kopfbereiche in anderer Farbe (z. B. im Mailjet-Editor) + logofrei: () => { document.documentElement.style.background = document.body.style.background = "transparent"; return ``; }, signatur: () => `
Noah GeerkensInhaber Geerkens GmbH, RheinbergVierte Generation, seit 1948
`, heftklein: () => `
`, diff --git a/E-Mails/quelle/erzeugen.sh b/E-Mails/quelle/erzeugen.sh index 6dfa973..37b3498 100755 --- a/E-Mails/quelle/erzeugen.sh +++ b/E-Mails/quelle/erzeugen.sh @@ -30,6 +30,7 @@ b1 1200 600 webinargeek/b1-morgen-abend-18-uhr b2 1200 600 webinargeek/b2-heute-abend-18-uhr b3 1200 600 webinargeek/b3-in-einer-stunde logo 456 120 logo-hivegrid +logofrei 456 120 logo-hivegrid-transparent signatur 900 220 signatur-noah heftklein 260 360 heft-klein' @@ -40,7 +41,7 @@ echo "$LISTE" | while read -r id breite hoehe datei; do fi "$CHROME" --headless=new --disable-gpu --hide-scrollbars --force-device-scale-factor=1 \ --allow-file-access-from-files --virtual-time-budget=8000 \ - --window-size="$breite,$hoehe" --screenshot="$TMP/$id.png" "$QUELLE?id=$id" >/dev/null 2>&1 + --default-background-color=00000000 --window-size="$breite,$hoehe" --screenshot="$TMP/$id.png" "$QUELLE?id=$id" >/dev/null 2>&1 if [ "$breite" = 1200 ]; then sips -s format jpeg -s formatOptions 84 "$TMP/$id.png" --out "$ZIEL/$datei.jpg" >/dev/null echo "$ZIEL/$datei.jpg" diff --git a/E-Mails/quelle/pakete.py b/E-Mails/quelle/pakete.py new file mode 100644 index 0000000..62ac82c --- /dev/null +++ b/E-Mails/quelle/pakete.py @@ -0,0 +1,40 @@ +#!/usr/bin/env python3 +"""Packt jede Mailjet-Mail als ZIP zum Import in Mailjet. + +Mailjet: „Meine Marketing-Vorlagen“ → „Neue Vorlage erstellen“ → „Mit HTML +programmieren“ → ZIP hochladen. Erwartet wird die HTML-Datei oben im ZIP und +die Bilder in einem eigenen Ordner, mit relativen Pfaden wie ./images/bild.jpg. + +Legt ../mailjet-import/.zip an. B0 bis B3 fehlen, die laufen über +WebinarGeek. Erneut ausführen, wenn sich eine Mail in ../mails/ ändert. +""" + +import re +import zipfile +from pathlib import Path + +HIER = Path(__file__).resolve().parent +MAILS = HIER.parent / "mails" +BILDER = HIER.parent / "bilder" +ZIEL = HIER.parent / "mailjet-import" +MAILJET = ["k01", "k02", "k03", "k04", "k07", "k08", "k09", "k10", "k11", "b4a", "b4b", "b4c", "b5", "b6"] +BILD = re.compile(r'src="\.\./bilder/((?:banner/|webinargeek/)?([^"/]+))"') + + +def main(): + ZIEL.mkdir(exist_ok=True) + for kennung in MAILJET: + html = (MAILS / f"{kennung}.html").read_text(encoding="utf-8") + dateien = {name: BILDER / pfad for pfad, name in BILD.findall(html)} + html = BILD.sub(lambda m: f'src="./images/{m.group(2)}"', html) + html = html.replace("Bilder liegen in ../bilder/.", "Bilder liegen im Ordner images/.") + ziel = ZIEL / f"{kennung}.zip" + with zipfile.ZipFile(ziel, "w", zipfile.ZIP_DEFLATED) as z: + z.writestr(f"{kennung}.html", html) + for name, pfad in sorted(dateien.items()): + z.write(pfad, f"images/{name}") + print(f"{ziel.name}: {len(dateien)} Bilder, {ziel.stat().st_size // 1024} KB") + + +if __name__ == "__main__": + main()