Tutorials

1:1 Live VideoChat-Tool

Integration in Webseite/Onlineshop


Der 1:1 Live VideoChat kann per Plugin oder HTML-Code in eine Webseite oder einen Onlineshop integriert werden. Dabei haben Sie die Möglichkeit, den VideoChat global (per Plugin) oder in einzeln ausgewählte Seiten (per HTML-Snippet) einzubinden. Die folgenden Anleitungen beschreiben Schritt für Schritt die Integration in Ihr System. Wenn Sie Unterstützung benötigen, rufen Sie uns an: +49 30 2191 8008 oder kommen Sie in den Support-VideoChat.


WordPress (global via Plugin)

  1. Loggen Sie sich in das 123.chat-Backend ein, klicken Sie oben auf und dann auf "LiveChat".
  2. Klicken Sie auf "Einstellungen" (oben), dann auf "WordPress Plugin" und kopieren Sie die User ID.
  3. Loggen Sie sich in Ihr WordPress-Backend ein.
  4. Klicken Sie links auf "Plugins" und dann oben auf Plugins "Installieren".
  5. Im Suchfeld (rechts) nach "123" suchen - Ihnen wird das 123.chat - VideoChat Plugin angezeigt.
  6. Installieren Sie das Plugin und aktivieren Sie es.
  7. Klicken Sie beim "123.chat" - Plugin auf "Einstellungen".
  8. Die kopierte User-ID (aus dem 123.chat-Backend) einfügen und speichern fertig.
  9. Und so funktioniert der 1:1 Live VideoChat.

Video Anleitung

video chat wordpress plugin

WordPress (einzelne Seiten)

  1. Loggen Sie sich in das 123.chat-Backend ein, klicken Sie oben auf und dann auf "LiveChat".
  2. Klicken Sie auf "Einstellungen" (oben), dann auf "HTML Code" und kopieren Sie das Code-Snippet.
  3. Loggen Sie sich in Ihr WordPress-Backend ein.
  4. Klicken Sie links auf "Seiten" und wählen Sie anschliessend diese Seite(n), auf der der VideoChat erscheinen soll.
  5. Fügen Sie das Code-Snippet entweder als Text- oder HTML-Element ein speichern fertig.
  6. Und so funktioniert der 1:1 Live VideoChat.

Video Anleitung

video chat wordpress tool tutorial

HTML (global oder einzelne Seiten)

  1. Loggen Sie sich in das 123.chat-Backend ein, klicken Sie oben auf und dann auf "LiveChat".
  2. Klicken Sie auf "Einstellungen" (oben), dann auf "HTML Code" und kopieren Sie das Code-Snippet.
  3. Fügen Sie das Code-Snippet innerhalb des body-Tags auf jeder einzelnen Seite ein oder binden Sie es per PHP-Befehl global ein speichern fertig.
  4. Und so funktioniert der 1:1 Live VideoChat.

Video Anleitung

video chat website tool integration

Shopware 5

  1. Loggen Sie sich in das 123.chat-Backend ein, klicken Sie oben auf und dann auf "LiveChat".
  2. Klicken Sie auf "Einstellungen" (oben), dann auf "Shopware 5+6" und kopieren Sie die User ID.
  3. Loggen Sie sich in Ihr Shopware5-Backend ein.
  4. Klicken Sie auf "Einstellungen" "Plugin-Manager".
  5. Suchen Sie nach "123" und Ihnen wird das 123.chat - VideoChat Plugin angezeigt.
  6. Klicken Sie auf "Kostenlos" "Jetzt herunterladen" AGB bestätigen "Zahlungspflichtig bestellen".
  7. Klicken Sie auf "Installieren" fügen Sie unten bei "Konfiguration" die User-ID (aus dem 123.chat-Backend) ein "Aktivieren" Cache leeren bestätigen.
  8. Klicken Sie oben in der Navigation auf "Einstellungen" "Caches / Performance" Reiter "Cache" Häkchen bei "Theme kompilieren" unten rechts "Leeren" "Theme kompilieren" fertig.
  9. Und so funktioniert der 1:1 Live VideoChat.

Video Anleitung

video chat shopware 5 plugin integration

Shopware 6

  1. Loggen Sie sich in das 123.chat-Backend ein, klicken Sie oben auf und dann auf "LiveChat".
  2. Klicken Sie auf "Einstellungen" (oben), dann auf "Shopware 5+6" und kopieren Sie die User ID.
  3. Loggen Sie sich in Ihr Shopware6-Backend ein.
  4. Klicken Sie links auf "Erweiterungen" "Store" suchen Sie oben im Suchfeld nach "123chat" und klicken Sie auf das Item 123.chat - 1:1 Live VideoChat
  5. Dann auf "Erweiterung hinzufügen" klicken AGB akzeptieren Erweiterung kostenlos hinzufügen und Schließen.
  6. Auf der linken Menüleiste auf "Meine Erweiterung" in der Mitte bei der "123.chat"-Erweiterung auf "App installieren" klicken und kurz warten.
  7. Anschliessend aktivieren Sie die 123.chat-Erweiterung (kurz den autom. Reload abwarten) und klicken Sie rechts auf den kleinen Button (drei Punkte) und dann auf "Konfiguration" die kopierte User-ID (aus dem 123.chat-Backen) einfügen Speichern fertig.
  8. Und so funktioniert der 1:1 Live VideoChat.

Video Anleitung

video chat shopware 6 plugin integration

Shopify

  1. Loggen Sie sich in das 123.chat-Backend ein, klicken Sie oben auf und dann auf "LiveChat".
  2. Klicken Sie auf "Einstellungen" (oben), dann auf "Shopify App" und kopieren Sie das Code-Snippet.
  3. Loggen Sie sich in Ihr Shopify-Backend ein.
  4. Klicken Sie links auf "Themes" in der Mitte auf "Actions" im Dropdown-Menue auf "Edit Code".
  5. Klicken Sie auf der nächsten Seite beim Layout "theme.liquid" fügen Sie das Code-Snippet innerhalb des body-Tags ein Speichern fertig.
  6. Und so funktioniert der 1:1 Live VideoChat.

Video Anleitung

video chat shopify plugin

EXPO-IP

  1. Loggen Sie sich in das 123.chat-Backend ein, klicken Sie oben auf und dann auf "LiveChat".
  2. Klicken Sie auf "Einstellungen" (oben), dann auf "HTML Code" und kopieren Sie das Code-Snippet.
  3. Loggen Sie sich in Ihr EXPO-IP Backend ein.
  4. Klicken Sie links auf "Booths" und wählen Sie rechts den Messestand (kleines Stiftsymbol) aus, auf dem der VideoChat integriert werden soll.
  5. Klicken Sie auf der nächsten Seite auf den Reiter "Settings" (oben) und scrollen Sie runter bis zu "Chat implementation" fügen Sie das Code-Snippet ein Save fertig.
  6. Gehen Sie auf Ihren virtuellen Messestand (Quadrat mit Pfeil) und passen Sie ggf. die Positionierung des VideoChats an. Gehen Sie hierzu im 123.chat-Backend auf "Einstellungen" und wählen Sie zwischen "rechst" und "links" bzw. geben Sie die horizontalen und vertikalen Pixel bei Typ und Positionierung des Video-/TextChat - Buttons an Speichern fertig.
  7. Und so funktioniert der 1:1 Live VideoChat.

Video Anleitung

video chat wordpress plugin tutorial

So funktioniert der 1:1 Live VideoChat


  1. Loggen Sie sich in das 123.chat-Backend ein, klicken Sie oben auf und dann auf "LiveChat".
  2. Testen Sie zunächst Signalton und Kamera mit den 2 Button rechts - jetzt sind Sie startklar und können Ihren Browser minimieren, um weiter zu arbeiten.
  3. Schreibt Ihnen ein Besucher über das Chatfenster von Ihrer Website/Onlineshop oder will mit Ihnen sofort VideoChatten, ertönt ein Signalton und Sie sehen zusätzlich ein kleines Hinweisfenster (Browsernotification unten rechts). Klicken Sie dann auf diese Browsernotification oder wechseln Sie per Browsertab ins 123.chat-Backend.
  4. Wählen Sie links oben den Anrufer aus (rot markiert) und klicken Sie anschliessend in der Mitte auf den großen Button "VideoChat annehmen".
  5. Nachdem Sie einmalig Kamera und Mikrofon freigegeben haben, werden Sie automatisch mit Ihrem Besucher verbunden.
  6. Die Kamera Ihres Besuchers ist zunächst deaktiviert und kann bei Bedarf von diesem aktiviert werden.
video chat wordpress plugin tutorial

123.chat IT-Spezifikation

1:1 Live VideoChat-Tool

Whitelisting für Firewalls in Unternehmensnetzwerken oder VPNs


Der 1:1 VideoChat von 123.chat basiert auf WebRTC und kann ohne Software-Installation mit jedem gängigen und aktuellen Browser genutzt werden, wobei zur einfachen Handhabung der Google Chrome Browser präferiert wird.
Einige Funktionen von 123.chat werden möglicherweise deaktiviert oder die Übertragungsqualität leidet, wenn Ihr Netzwerkadministrator (IT-Abteilung) die Video- und Audiodienste in Browsern blockiert.

Am häufigsten werden die Probleme gelöst, indem Sie Ihr VPN ausschalten oder in ein Gast-WLAN gehen, soweit vorhanden.

Wenn Sie Ihr VPN nicht deaktivieren können, muss Ihr Netzwerkadministrator 123.chat zu Ihrer Liste der akzeptierten Verwendung hinzufügen, die allgemein als "Whitelisting" bezeichnet wird. Alle Informationen zu Domains und Ports finden Sie in der nebenstehenden Tabelle.

Bei Fragen unterstützen wir Sie gern per Mail auf support@123.chat oder telefonsich unter: +49 30 2191 8008 - oder kommen Sie in unseren Support-VideoChat (rechts unten).

Web-Proxy Domainfreigabe (Ausnahme hinzufügen)
https://123.chat
Firewall Portfreigabe
45.157.176.156:443/tcp
45.157.176.156:10000/udp
193.26.156.19:443/tcp
194.13.83.198:443/tcp
194.13.83.198:10000/udp