Banner und PS führen auf das Ziel der Mail (eigene utm_content -banner und -ps), Füllzeichen nach dem Vorschautext, Button auf dem Handy volle Breite. Text und Look unverändert. ZIPs, Vorschauen und Mediakit neu. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
122 lines
8.5 KiB
HTML
122 lines
8.5 KiB
HTML
<!doctype html>
|
|
<html lang="de" xmlns="http://www.w3.org/1999/xhtml">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="x-apple-disable-message-reformatting">
|
|
<meta name="color-scheme" content="light">
|
|
<title>B3 · In einer Stunde</title>
|
|
<!--
|
|
B3, Erinnerung eine Stunde vorher (Teil 2: Nur nach der Anmeldung).
|
|
Gebaut wie die Muster-Mail k03.html, Bausteine sind unten mit
|
|
„BAUSTEIN: …“ markiert. B3 hat kein PS.
|
|
|
|
Betreff: In einer Stunde
|
|
Vorschautext: Um 18 Uhr geht es los.
|
|
Versand: WebinarGeek, Erinnerung eine Stunde vorher (Di 08.12., 17 Uhr)
|
|
Geändert ggü. PDF:
|
|
- „[Zugangslink Google Meet]“ gestrichen, Satz endet mit dem Doppelpunkt,
|
|
danach Button „Zum Webinar →“ ({{ZUGANGSLINK}}) mit Zeile zum Kopieren
|
|
|
|
Platzhalter: {{ZUGANGSLINK}} ersetzen, [Vorname] über die Personalisierung
|
|
von WebinarGeek. Bilder liegen in ../bilder/.
|
|
-->
|
|
<style>
|
|
body { margin: 0; padding: 0; background: #F4F3EF; }
|
|
a { color: #8A6800; }
|
|
@media (max-width: 620px) {
|
|
.karte { width: 100% !important; border-radius: 0 !important; }
|
|
.rand { padding-left: 22px !important; padding-right: 22px !important; }
|
|
.spalte { display: block !important; width: 100% !important; padding: 0 0 12px 0 !important; }
|
|
.text { font-size: 17px !important; }
|
|
.knopf { width: 100% !important; }
|
|
.knopf a { display: block !important; }
|
|
}
|
|
</style>
|
|
</head>
|
|
<body style="margin:0;padding:0;background:#F4F3EF;">
|
|
|
|
<!-- BAUSTEIN: Vorschautext (unsichtbar) -->
|
|
<div style="display:none;max-height:0;overflow:hidden;opacity:0;">Um 18 Uhr geht es los.͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­͏‌  ­</div>
|
|
|
|
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="background:#F4F3EF;">
|
|
<tr><td align="center" style="padding:28px 12px 40px;">
|
|
|
|
<!-- BAUSTEIN: Kopf (Logo über der Karte) -->
|
|
<table role="presentation" width="600" cellpadding="0" cellspacing="0" border="0" class="karte" style="width:600px;">
|
|
<tr><td align="center" style="padding:0 0 20px;">
|
|
<img src="../bilder/logo-hivegrid.png" width="152" height="40" alt="HiveGrid" style="display:block;border:0;width:152px;height:40px;">
|
|
</td></tr>
|
|
</table>
|
|
|
|
<!-- Karte -->
|
|
<table role="presentation" width="600" cellpadding="0" cellspacing="0" border="0" class="karte" style="width:600px;background:#FFFFFF;border:1px solid #E4E1D8;border-radius:14px;overflow:hidden;">
|
|
|
|
<!-- BAUSTEIN: Banner -->
|
|
<tr><td style="padding:0;">
|
|
<a href="{{ZUGANGSLINK}}" style="display:block;text-decoration:none;"><img src="../bilder/webinargeek/b3-in-einer-stunde.jpg" width="600" alt="Gleich geht's los: In einer Stunde." style="display:block;border:0;width:100%;max-width:600px;height:auto;"></a>
|
|
</td></tr>
|
|
|
|
<!-- BAUSTEIN: Terminleiste -->
|
|
<tr><td class="rand" style="padding:0 40px;">
|
|
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="border-bottom:1px solid #ECEAE3;">
|
|
<tr>
|
|
<td class="spalte" width="40%" valign="top" style="padding:14px 10px 14px 0;font-family:Arial,Helvetica,sans-serif;">
|
|
<div style="font-size:11px;font-weight:bold;letter-spacing:1.5px;text-transform:uppercase;color:#8A6800;">Wann</div>
|
|
<div style="font-family:Georgia,'Times New Roman',serif;font-size:16px;font-weight:bold;color:#1A1A1A;padding-top:4px;">Di, 8. Dezember, 18 Uhr</div>
|
|
</td>
|
|
<td class="spalte" width="32%" valign="top" style="padding:14px 10px;font-family:Arial,Helvetica,sans-serif;">
|
|
<div style="font-size:11px;font-weight:bold;letter-spacing:1.5px;text-transform:uppercase;color:#8A6800;">Wo</div>
|
|
<div style="font-family:Georgia,'Times New Roman',serif;font-size:16px;font-weight:bold;color:#1A1A1A;padding-top:4px;">Live im Browser</div>
|
|
</td>
|
|
<td class="spalte" width="28%" valign="top" style="padding:14px 0 14px 10px;font-family:Arial,Helvetica,sans-serif;">
|
|
<div style="font-size:11px;font-weight:bold;letter-spacing:1.5px;text-transform:uppercase;color:#8A6800;">Dauer</div>
|
|
<div style="font-family:Georgia,'Times New Roman',serif;font-size:16px;font-weight:bold;color:#1A1A1A;padding-top:4px;">Eine Stunde</div>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</td></tr>
|
|
|
|
<!-- BAUSTEIN: Text -->
|
|
<tr><td class="rand text" style="padding:30px 40px 0;font-family:Georgia,'Times New Roman',serif;font-size:17px;line-height:1.65;color:#1A1A1A;">
|
|
<p style="margin:0 0 18px;">Moin [Vorname],</p>
|
|
<p style="margin:0 0 6px;">in einer Stunde geht es los, hier ist dein Zugangslink:</p>
|
|
</td></tr>
|
|
|
|
<!-- BAUSTEIN: Button (statt „[Zugangslink Google Meet]“) -->
|
|
<tr><td align="center" class="rand" style="padding:18px 40px 26px;">
|
|
<table role="presentation" cellpadding="0" cellspacing="0" border="0" class="knopf"><tr>
|
|
<td align="center" bgcolor="#F1B729" style="border-radius:6px;">
|
|
<a href="{{ZUGANGSLINK}}" style="display:inline-block;padding:16px 34px;font-family:Arial,Helvetica,sans-serif;font-size:16px;font-weight:bold;color:#1A1A1A;text-decoration:none;border-radius:6px;">Zum Webinar →</a>
|
|
</td>
|
|
</tr></table>
|
|
<p style="margin:10px 0 0;font-family:Arial,Helvetica,sans-serif;font-size:12px;color:#6B6B66;text-align:center;">Oder diesen Link kopieren: {{ZUGANGSLINK}}</p>
|
|
</td></tr>
|
|
|
|
<tr><td class="rand text" style="padding:0 40px;font-family:Georgia,'Times New Roman',serif;font-size:17px;line-height:1.65;color:#1A1A1A;">
|
|
<p style="margin:0 0 18px;">Leg dir deine drei Zahlen neben den Rechner, dann sehen wir uns um 18 Uhr.</p>
|
|
</td></tr>
|
|
|
|
<!-- BAUSTEIN: Gruß und Signatur (ohne PS, deshalb unten 34px) -->
|
|
<tr><td class="rand text" style="padding:0 40px;font-family:Georgia,'Times New Roman',serif;font-size:17px;line-height:1.65;color:#1A1A1A;">
|
|
<p style="margin:0 0 12px;">Gruß Noah</p>
|
|
</td></tr>
|
|
<tr><td class="rand" style="padding:0 40px 34px;">
|
|
<img src="../bilder/signatur-noah.png" width="360" height="88" alt="Noah Geerkens, Inhaber Geerkens GmbH, Rheinberg" style="display:block;border:0;width:360px;max-width:100%;height:auto;">
|
|
</td></tr>
|
|
</table>
|
|
|
|
<!-- BAUSTEIN: Fuß (außerhalb der Karte) -->
|
|
<table role="presentation" width="600" cellpadding="0" cellspacing="0" border="0" class="karte" style="width:600px;">
|
|
<tr><td class="rand" align="center" style="padding:26px 30px 0;font-family:Arial,Helvetica,sans-serif;font-size:12px;line-height:1.7;color:#6B6B66;">
|
|
Du bekommst diese Mail, weil du dich für das Webinar am 8. Dezember angemeldet hast.<br>
|
|
<a href="https://hivegrid.de/datenschutz" style="color:#6B6B66;text-decoration:underline;">Datenschutz</a><br>
|
|
HiveGrid GmbH i. G. · Xantener Straße 235a · 47495 Rheinberg
|
|
</td></tr>
|
|
</table>
|
|
|
|
</td></tr>
|
|
</table>
|
|
</body>
|
|
</html>
|