Live-Vorschau
Genau der Code, den du kopierst, wird beim Bearbeiten auf einer Beispielseite angezeigt.
Kostenloser WhatsApp-Chat-Button für Websites
WhatsApp-Widget-Generator für deine Website
Gestalte einen schwebenden WhatsApp-Chat-Button, sieh ihn live auf einer Beispielseite und kopiere ein kleines HTML-Snippet. Funktioniert mit WordPress, Shopify, Wix, Squarespace, Webflow oder selbst programmierten Seiten – ohne Plugin, ohne externes Skript, ohne Besucher-Tracking.
Mit Ländervorwahl. Leerzeichen, Bindestriche und ein führendes + sind in Ordnung.
Besucher sehen diesen Text in WhatsApp und können ihn vor dem Senden ändern. Es wird nichts automatisch gesendet.
Einbettungscode: vor </body> einfügen
Gib eine WhatsApp-Nummer ein, um den Einbettungscode zu erstellen.
Kostenlos, ohne Anmeldung. Wird in deinem Browser erstellt – nichts, was du eingibst, wird an MyChatWrap gesendet.
Was ist ein WhatsApp-Website-Widget?
Ein WhatsApp-Widget ist ein Button in der Ecke deiner Website, der beim Klick einen WhatsApp-Chat mit deinem Unternehmen öffnet. Dieser Generator erzeugt reines HTML und CSS: einen gestalteten wa.me-Link mit optionaler Begrüßungsblase. Da nichts von einem anderen Server geladen wird, wiegt er fast nichts, kann deine Seite nicht ausbremsen und braucht kein Cookie-Banner.
Ein schlanker Chat-Button unter deiner Kontrolle
Kein Skript, kein Tracking
Reines HTML und CSS, etwa 1 KB, ohne Drittanbieter-Anfragen oder Cookies.
Eigener Text und eigene Farbe
Nutze eine Beschriftung wie „Schreib uns“ oder einen runden Symbol-Button in deiner Markenfarbe.
Begrüßungsblase
Eine optionale Nachricht über dem Button lädt Besucher zum Chat ein.
Mobilfreundlich
Wird auf Handys optional zum Symbol, damit er keine Inhalte verdeckt.
Standardmäßig barrierearm
Tastatur-Fokus und eine Beschriftung für Screenreader sind eingebaut.
So fügst du WhatsApp zu deiner Website hinzu
1. Nummer eingeben
Gib deine WhatsApp- oder WhatsApp-Business-Nummer mit Ländervorwahl ein.
2. Button gestalten
Lege Text, Begrüßung, Farbe, Position und vorausgefüllte Nachricht fest.
3. Code einfügen
Kopiere das Snippet und füge es direkt vor </body> auf deiner Seite ein.
Wo du den Code einfügst
Füge das Snippet einmal an einer Stelle ein, die auf jeder Seite geladen wird:
- WordPress: ein Header/Footer-Code-Plugin oder die footer.php deines Themes vor </body>
- Shopify: Onlineshop → Themes → Code bearbeiten → theme.liquid, vor </body>
- Wix: Einstellungen → Benutzerdefinierter Code → Body – Ende, auf allen Seiten
- Squarespace: Einstellungen → Erweitert → Code-Injektion → Footer
- Webflow: Projekteinstellungen → Custom Code → Footer Code
- Jede HTML-Seite: direkt vor dem schließenden </body>-Tag
Warum ein reines HTML-Widget?
Die meisten Chat-Widget-Plugins laden bei jedem Seitenaufruf JavaScript vom Server eines anderen Unternehmens. Das macht die Seite schwerer, kann Tracking-Cookies setzen und funktioniert nicht mehr, wenn der Dienst seine Tarife ändert. Dieses Snippet ist ein gestalteter Link: Lädt deine Seite, funktioniert der Button.
Der Nachteil: Es gibt keine eingebaute Klick-Statistik. Nutze eine eigene vorausgefüllte Nachricht wie „Hallo, ich bin auf Ihrer Website“, um Chats aus dem Widget zu erkennen.
Damit der Button konvertiert
Sag, was als Nächstes passiert („Schreib uns“, „Frage stellen“), statt nur ein Symbol zu zeigen. Halte die Begrüßung kurz und menschlich und fülle eine Nachricht vor, damit Besucher nicht vor einem leeren Feld sitzen. Auf Handys verdeckt ein reiner Symbol-Button keine Produktfotos oder Checkout-Buttons.
Was dieses Tool macht
- Erzeugt einen schwebenden WhatsApp-Button als reines HTML/CSS
- Zeigt eine Live-Vorschau genau des Snippets
- Unterstützt Text, Farbe, Begrüßung, Position und Mobil-Optionen
- Prüft deine Nummer vor dem Veröffentlichen
Was es nicht kann
- Live-Chat, Chatbots oder ein gemeinsames Team-Postfach bieten
- Klicks oder Besucher zählen – bewusst ohne Tracking
- Sich selbst installieren – du fügst das Snippet in deine Seite ein
Privat in deinem Browser erstellt
Alles auf dieser Seite wird in deinem Browser erzeugt. Nummer, Nachricht und Einstellungen werden weder an MyChatWrap gesendet noch irgendwo gespeichert. Dein Gerät verlässt nur, was du selbst kopierst, herunterlädst oder veröffentlichst.
Fragen zum WhatsApp-Widget
Weitere WhatsApp-Tools
WhatsApp-Link-Generator
Erstelle einen wa.me-Click-to-Chat-Link mit vorausgefüllter Nachricht, fertig zum Kopieren.
WhatsApp-QR-Code-Generator
Erstelle einen Scan-to-Chat-QR-Code für WhatsApp mit eigenen Farben, als PNG oder druckfertiges SVG.
WhatsApp-Nachrichtenvorlagen
Fülle fertige WhatsApp-Business-Nachrichten für Bestellungen, Erinnerungen, Angebote und mehr aus.
WhatsApp to PDF
Du brauchst jede Nachricht? Erstelle eine vollständige chronologische Transkript-PDF.
Du schreibst schon mit Kunden auf WhatsApp?
Exportiere einen Kunden- oder Team-Chat und sieh dir Antwortzeiten, Stoßzeiten, wer Gespräche beginnt und mehr an – privat in deinem Browser ausgewertet.
WhatsApp-Chat analysieren