Nutzen Sie unseren kleinen HTML Generator, um schnell und einfach schicke Angebote für Mails zu erstellen.

Newsletter-HTML Konfigurator (Fluid-Hybrid, Outlook Desktop Button-safe)

directdeal.me • Bulletproof-Button (VML) • Bild-Skalierung (%)

Eingaben

Produktlink Bildlink Titel (H2) Beschreibung (kurz)

Preis (optional, z. B. 149,90 €)

Streichpreis (optional, z. B. 199,90 €)

Angebots-Badge anzeigen

Badge-Text (optional; Standard: ANGEBOT)

Herstellernummer (optional)

Link zur Herstellernummer (optional)

Button-Text

Button-Farbe

Bildbreite (px, Obergrenze für max-width)

Bild-Skalierung (%) (10–100, Standard 50)

Nach-Abstand (px, Separator)

Outlook Desktop Button (VML) aktiv

Fluid-Hybrid: 100 % Breite + zentrierendes DIV mit max-width:600px. Bild skaliert prozentual (CSS) + feste Pixelobergrenze (Attribut) für Outlook. Outlook Desktop Button: VML via MSO-Conditional (nur wenn aktiviert).

Generierter HTML-Code

Live-Vorschau (simuliert 600 px E-Mail-Breite)

Vorschau erscheint nach dem Generieren …

Hinweis: Browser-Vorschau kann Outlook-Desktop-Verhalten nicht 1:1 simulieren. Für Outlook Desktop ist der VML-Button entscheidend.

Newsletter-HTML Konfigurator – Funktionsbeschreibung

Dieses Tool erstellt einen Outlook-sicheren HTML-Block für Produkt-Newsletter auf Basis deiner Eingaben. Es nutzt einen 600-px Hybrid-Container mit MSO-Conditional Comments und VML-Button, damit Layout und Buttons auch in Outlook-Desktop zuverlässig dargestellt werden.

So verwenden Sie das Tool

Pflichtangaben: Produktlink und Bildlink eintragen.
Optional: Titel, Kurzbeschreibung, Preis(e), Badge-Text, Herstellernummer (mit/ohne Link) sowie Button-Text/Farbe anpassen.
Technik: Containerbreite (typisch 600 px) und Bildbreite (z. B. 420 px ≈ 70 %) definieren.
Generieren: „HTML generieren“ klicken ➜ Code kopieren ➜ im Newsletter-Tool als HTML-Block einfügen.

Eingabefelder im Überblick

Produktlink: Ziel-URL des Artikels (Shop-Detailseite).
Bildlink: Direktlink zum Produktbild (z. B. …imgbolt.de/…png).
Titel (H2): Überschrift im Block.
Beschreibung (kurz): 1–3 Sätze Nutzenfokus, optional Verfügbarkeit.
Preis / Streichpreis: Zeigt wahlweise nur Preis, Preis mit durchgestrichenem Streichpreis oder nur Streichpreis.
Angebots-Badge: Checkbox zum Einblenden; Badge-Text frei wählbar (Standard: „ANGEBOT“).
Herstellernummer & Link: Kleine Zeile oberhalb der Beschreibung; mit Link klickbar.
Button-Text & Farbe: Call-to-Action und Markenfarbe (z. B. #0d345b).
Containerbreite: Feste Breite für Outlook-Tische (empfohlen 600 px).
Bildbreite: Feste Pixelbreite (Attribut + CSS), damit Outlook korrekt skaliert.