Wie lange dauert die Installation eines Live-Chats?

Etwa 2 Minuten. Registrieren Sie sich für ein kostenloses Konto, kopieren Sie das Widget-Skript und fügen Sie es in den Footer Ihrer Website vor dem schließenden Body-Tag ein. Das Chat-Widget erscheint sofort — kein Server-Neustart, kein Build-Prozess, kein Warten.

Benötige ich Programmierkenntnisse, um einen Live-Chat hinzuzufügen?

Nein. Sie müssen eine Zeile JavaScript in Ihre Website einfügen. Auf Plattformen wie WordPress, Shopify oder Tilda erfolgt dies über visuelle Einstellungsfelder — kein Code-Editor erforderlich.

So fügen Sie Live-Chat in 2 Minuten zu Ihrer Website hinzu (Anleitung 2026)

Q: Ist Live-Chat kostenlos?

Svyazio bietet einen kostenlosen Starter-Tarif mit 1 Agenten und 50 Gesprächen pro Monat. Keine Kreditkarte erforderlich, kein Zeitlimit. Kostenpflichtige Tarife beginnen bei 19 $/Agent/Monat für E-Mail-Integration und gespeicherte Antworten.

Q: Verlangsamt Live-Chat meine Website?

Nein. Das Svyazio-Widget lädt asynchron mit dem defer-Attribut. Es blockiert nicht das Rendern der Seite und beeinträchtigt nicht die Core Web Vitals. Das Skript ist leichtgewichtig und wird weltweit über CDN ausgeliefert.

Q: Welche Plattformen werden unterstützt?

Jede Website, die HTML unterstützt. WordPress, Shopify, WooCommerce, Tilda, Wix, Squarespace, Webflow, Next.js, individuelles HTML — wenn Sie ein Script-Tag hinzufügen können, funktioniert Svyazio.

Inhaltsverzeichnis

Warum Ihre Website einen Live-Chat braucht
Universelle Installation — 3 Schritte
WordPress-Installation
Shopify-Installation
Tilda-Installation
Anpassung Ihres Chat-Widgets
Multichannel: Telegram + E-Mail
FAQ

Das Hinzufügen eines Live-Chats zu Ihrer Website erforderte früher Plugins, Konfigurationsdateien und manchmal einen Entwickler. 2026 braucht es nur eine Zeile JavaScript und etwa 2 Minuten Ihrer Zeit. Dieser Leitfaden behandelt alle wichtigen Plattformen — WordPress, Shopify, Tilda, Wix und einfaches HTML — damit Sie noch heute mit Besuchern chatten können.

Wir verwenden Svyazio als Beispiel. Es ist ein kostenloses Live-Chat-Tool mit einem einheitlichen Posteingang für Website-Chat, Telegram und E-Mail. Der kostenlose Tarif umfasst 1 Agenten und 50 Gespräche pro Monat — keine Kreditkarte, kein Zeitlimit. Der hier beschriebene Installationsprozess funktioniert jedoch ähnlich für jedes JavaScript-basierte Chat-Widget.

Warum Ihre Website einen Live-Chat braucht

Bevor wir uns den technischen Schritten widmen, beantworten wir die naheliegende Frage: Warum der Aufwand? Hier sind drei datenbasierte Gründe.

1. Live-Chat steigert Conversions. Laut Forrester Research konvertieren Besucher, die den Live-Chat nutzen, 3–5× häufiger. Für Online-Shops bedeutet das mehr abgeschlossene Bestellungen. Für SaaS-Unternehmen mehr Testregistrierungen. Für Dienstleistungsunternehmen mehr gebuchte Termine. Der Mechanismus ist einfach: Menschen haben Fragen, und je schneller Sie antworten, desto wahrscheinlicher handeln sie.

2. Kunden bevorzugen Chat gegenüber Telefon und E-Mail. Eine Studie von J.D. Power ergab, dass 42% der Kunden Live-Chat für den Kundensupport bevorzugen — mehr als Telefon (32%) oder E-Mail (23%). Chat ist unaufdringlich (keine Wartemusik), sofort (kein 24-Stunden-E-Mail-Warten) und bequem (Kunden können nebenbei andere Dinge tun). Wenn Ihre einzigen Supportkanäle Telefon und E-Mail sind, verpassen Sie die Mehrheit potenzieller Gespräche.

3. Chat senkt Supportkosten. Ein Agent kann 3–5 Chat-Gespräche gleichzeitig bearbeiten — im Vergleich zu 1 Telefonat zur gleichen Zeit. Das bedeutet, Ihr Team bearbeitet mehr Anfragen, ohne die Mitarbeiterzahl zu erhöhen. Gespeicherte Antworten (vorgefertigte Antworten auf häufige Fragen) machen dies noch effizienter und reduzieren die durchschnittliche Bearbeitungszeit um 30–50%.

Universelle Installation — 3 Schritte

Diese Methode funktioniert auf jeder Website — ob sie mit HTML, React, Vue, Next.js oder einem anderen Framework erstellt wurde. Wenn Sie ein <script>-Tag hinzufügen können, funktioniert dies.

Schritt 1: Kostenloses Konto erstellen

Gehen Sie zu app.svyazio.com und registrieren Sie sich. Der Vorgang dauert 30 Sekunden — Name, E-Mail, Passwort, fertig. Keine Kreditkarte erforderlich. Sie landen auf Ihrem Dashboard mit einem leeren Posteingang.

Schritt 2: Widget-Code kopieren

Navigieren Sie zu Einstellungen → Installation. Sie sehen einen Code-Schnipsel wie diesen:

<script>
  (function(d, w, c) {
    w.SvyazioConfig = {
      orgId: 'YOUR_ORG_ID',
      serverUrl: 'https://app.svyazio.com'
    };
    w[c] = w[c] || function() { (w[c].q = w[c].q || []).push(arguments); };
    var s = d.createElement('script');
    s.async = true;
    s.src = 'https://app.svyazio.com/widget/svyazio.js';
    if (d.head) d.head.appendChild(s);
  })(document, window, 'Svyazio');
</script>

Kopieren Sie ihn. Die orgId ist Ihre eindeutige Organisationskennung — sie teilt dem Widget mit, mit welchem Posteingang es sich verbinden soll. Sie finden sie unter Einstellungen → Installation.

Schritt 3: Vor </body> einfügen

Öffnen Sie den HTML-Code Ihrer Website und fügen Sie den Code-Schnipsel direkt vor dem schließenden </body>-Tag ein. Speichern Sie die Datei und laden Sie die Seite neu. Das Chat-Widget erscheint in der unteren rechten Ecke — bereit für Gespräche.

<html>
<body>
  ... Ihr Seiteninhalt ...

  <!-- Svyazio Live Chat -->
  <script>
    w.SvyazioConfig = { orgId: 'YOUR_ORG_ID', serverUrl: 'https://app.svyazio.com' };
    (function(d, w, c) {
      w[c] = w[c] || function() { (w[c].q = w[c].q || []).push(arguments); };
      var s = d.createElement('script');
      s.async = true;
      s.src = 'https://app.svyazio.com/widget/svyazio.js';
      if (d.head) d.head.appendChild(s);
    })(document, window, 'Svyazio');
  </script>
</body>
</html>

Das Skript lädt asynchron — es blockiert nicht das Rendern Ihrer Seite. Ihre Website-Geschwindigkeit wird nicht beeinträchtigt.

WordPress-Installation

Methode A: WPCode-Plugin (einfachste)

Installieren Sie das kostenlose WPCode-Plugin (Insert Headers and Footers). Gehen Sie zu Code Snippets → Body. Fügen Sie das Svyazio-Skript ein. Klicken Sie auf Speichern. Fertig — keine Theme-Dateibearbeitung erforderlich.

Methode B: Theme-Datei

Gehen Sie zu Design → Theme-Datei-Editor → footer.php. Fügen Sie das Skript vor </body> ein. Speichern. Hinweis: Wenn Sie Ihr Theme aktualisieren, müssen Sie das Skript erneut hinzufügen. Ein Child-Theme verhindert dies.

Methode C: Elementor

Wenn Sie Elementor verwenden, gehen Sie zu Elementor → Custom Code → Footer. Fügen Sie das Skript ein. Veröffentlichen. Dies funktioniert mit der Custom-Code-Funktion von Elementor Pro.

Svyazio verwendet Shadow DOM — das Widget rendert in einem isolierten Container, der CSS-Konflikte mit Ihrem WordPress-Theme, Plugins und Page Buildern verhindert. Funktioniert mit Astra, GeneratePress, Kadence, Divi und jedem anderen Theme. Vollständiger WordPress-Integrationsleitfaden →

Shopify-Installation

Gehen Sie in Ihrem Shopify-Admin zu Online-Shop → Themes → Aktionen → Code bearbeiten. Öffnen Sie theme.liquid. Finden Sie das schließende </body>-Tag und fügen Sie das Svyazio-Skript direkt davor ein. Klicken Sie auf Speichern.

Das Chat-Widget erscheint jetzt auf jeder Seite Ihres Shops — Startseite, Produktseiten, Warenkorb, Kasse und Blog. Shadow-DOM-Isolation bedeutet null CSS-Konflikte mit jedem Shopify-Theme (Dawn, Debut, Brooklyn, individuelle Themes). Vollständiger Shopify-Integrationsleitfaden →

Tilda-Installation

Seitenweit: Gehen Sie zu Ihrem Tilda-Projekt → Website-Einstellungen → Mehr → HTML-Code → Vor dem </body>-Tag. Fügen Sie den Code ein. Veröffentlichen Sie alle Seiten erneut.

Einzelne Seite: Fügen Sie einen T123 HTML-Block (Sonstiges → HTML-Code) zu einer bestimmten Seite hinzu. Fügen Sie den Widget-Code ein. Nützlich, wenn Sie Chat nur auf bestimmten Landing Pages möchten.

Klicken Sie nach dem Einfügen auf Erneut veröffentlichen — Tilda speichert Seiten statisch zwischen, daher erscheint das Widget erst nach der erneuten Veröffentlichung. Vollständiger Tilda-Integrationsleitfaden →

Andere Plattformen

Der gleiche Ein-Zeile-JavaScript-Ansatz funktioniert auf:

Wix: Dashboard → Einstellungen → Custom Code → Body-Ende. Einfügen. Veröffentlichen.
Squarespace: Einstellungen → Erweitert → Code-Injection → Footer. Einfügen. Speichern.
Webflow: Projekteinstellungen → Custom Code → Body. Einfügen. Veröffentlichen.
Next.js / React: Fügen Sie das Script-Tag in Ihre _document.tsx ein oder verwenden Sie next/script mit strategy="lazyOnload".
Statisches HTML: Vor </body> in Ihre HTML-Datei einfügen. Deployen.

Anpassung Ihres Chat-Widgets

Nach der Installation passen Sie das Widget über Ihr Svyazio-Dashboard an — keine Codeänderungen nötig:

Widget-Farbe: Passend zur Primärfarbe Ihrer Marke
Willkommensnachricht: Legen Sie eine Begrüßung fest, die erscheint, wenn Besucher den Chat öffnen
Offline-Formular: Erfassen Sie die E-Mail des Besuchers, wenn Ihr Team offline ist
Geschäftszeiten: Online-/Offline-Status automatisch anzeigen (Pro-Tarif)
Automatische Nachrichten: Nachrichten basierend auf Seiten-URL, Verweildauer oder Scroll-Tiefe auslösen (Pro-Tarif)
White-Label: Svyazio-Branding entfernen für ein vollständig markenspezifisches Erlebnis (Pro-Tarif)

Multichannel: Telegram + E-Mail

Live-Chat ist nur der Anfang. Moderne Kunden nutzen mehrere Kanäle — und erwarten nahtlosen Support über alle hinweg. Svyazio unterstützt drei Kanäle in einem Posteingang:

Website-Chat — das Widget, das Sie gerade installiert haben
Telegram — verbinden Sie Ihren Telegram-Bot (Pro-Tarif, bis zu 10 Bots)
E-Mail — verbinden Sie support@firma.com via IMAP/SMTP (Business-Tarif, bis zu 10 Konten im Pro-Tarif)

Alle drei Kanäle fließen in einen einzigen Posteingang zusammen. Wenn ein Kunde auf Ihrer Website chattet, später eine Nachfrage per E-Mail sendet und dann Ihrem Telegram-Bot schreibt — erscheinen alle drei im selben Gesprächsthread. Ihre Agenten sehen den vollständigen Verlauf unabhängig vom Kanal.

Was nach der Installation zu tun ist

Sie haben das Widget installiert. Jetzt holen Sie das Beste daraus:

Mobile App herunterladen. Svyazio hat native Apps für iOS und Android mit Push-Benachrichtigungen. Sie verpassen nie eine Nachricht — auch nicht, wenn Sie nicht am Schreibtisch sind.
5–10 gespeicherte Antworten erstellen. Welche Fragen werden Ihnen am häufigsten gestellt? Versandkosten, Rückgaberegelung, Preise, Geschäftszeiten? Schreiben Sie gespeicherte Antworten dafür. Ihre Agenten antworten mit 2 Klicks, anstatt dieselbe Antwort dutzende Male am Tag zu tippen.
Eine automatische Nachricht einrichten. Im Pro-Tarif können Sie Nachrichten basierend auf dem Besucherverhalten auslösen. Beispiel: Wenn jemand 30+ Sekunden auf einer Preisseite verbringt, lösen Sie aus: „Haben Sie eine Frage zu unseren Tarifen? Wir helfen gerne!“ Das verwandelt passives Surfen in aktive Gespräche.
Ihr Team einladen. Im Business- und Pro-Tarif können Sie mehrere Agenten einladen. Weisen Sie Gespräche zu, hinterlassen Sie interne Notizen und nutzen Sie Abteilungen, um Chats an die richtige Person weiterzuleiten.

Preisübersicht

Svyazio bietet transparente Pro-Agent-Preise ohne versteckte Gebühren:

Starter (Kostenlos): 1 Agent, 50 Gespräche/Monat — für persönliche Websites und Tests
Business (19 $/Agent/Monat): E-Mail, gespeicherte Antworten, Tippvorschau, interne Notizen, bis zu 10 Agenten
Pro (39 $/Agent/Monat): Telegram, KI-Assistent, Abteilungen, Analysen, White-Label, unbegrenzte Agenten

Beide kostenpflichtigen Tarife beinhalten eine 7-tägige kostenlose Testphase ohne Kreditkarte.

Häufig gestellte Fragen

Wie lange dauert die Installation?

Etwa 2 Minuten. Registrieren, Skript kopieren, in den Footer Ihrer Website einfügen. Das Widget erscheint sofort — kein Neustart, kein Build, kein Warten.

Brauche ich Programmierkenntnisse?

Nein. Bei WordPress, Shopify und Tilda fügen Sie das Skript über visuelle Einstellungsfelder ein. Bei individuellen Websites fügen Sie einfach eine Zeile vor </body> hinzu. Keine Programmierkenntnisse erforderlich.

Ist Live-Chat kostenlos?

Ja. Der Starter-Tarif von Svyazio ist für immer kostenlos — 1 Agent, 50 Gespräche/Monat, keine Kreditkarte. Kostenpflichtige Tarife beginnen bei 19 $/Agent/Monat für mehr Funktionen.

Wird es meine Website verlangsamen?

Nein. Das Skript lädt asynchron mit defer. Es blockiert nicht das Rendern der Seite und beeinträchtigt nicht die Core Web Vitals. Weltweit per CDN ausgeliefert.

Welche Plattformen werden unterstützt?

Jede Website: WordPress, Shopify, WooCommerce, Tilda, Wix, Squarespace, Webflow, Next.js, React, individuelles HTML — wenn Sie ein Script-Tag hinzufügen können, funktioniert es.

Bereit für Live-Chat?

Für immer kostenlos. Installation in 2 Minuten. Keine Kreditkarte.

Kostenlos starten

Weiterlesen

10 beste kostenlose Live-Chat-Tools Telegram-Support-Leitfaden WordPress-Integration