Az Önhöz hasonló olvasók támogatják a MUO-t. Amikor a webhelyünkön található linkek használatával vásárol, társult jutalékot kaphatunk. Olvass tovább.

Képzelje el ezt: valaki, aki az Ön egyik termékét használja, problémába ütközik. Van néhány csatorna, amelyen jelenthetik a problémát, és megpróbálhatják megoldani.

Ezek közül választhattak e-mailt vagy telefonhívást. De ezek a kommunikációs csatornák nem garantálják a gyors, nem is beszélve a valós idejű válaszokat. De egy élő, interaktív csevegés egy ügyfélszolgálati szakemberrel felbecsülhetetlen értékűnek bizonyulhat.

Az élő chat funkció nagyon hasznos kommunikációs eszköznek bizonyult. Ennek az az oka, hogy lehetővé teszi a felhasználókkal való jobb kapcsolatteremtést, a felhasználói élmény javítását, valamint a problémák gyors és valós időben történő elhárítását.

Mi az élő chat és miért fontos?

Az élő csevegés funkciót általában widgetként, vagy a webhely betöltése után megjelenő előugró ablakként szerepeltetik a weboldal oldalán. Valós idejű kommunikációt biztosít a felhasználók és az ügyfélszolgálati képviselők vagy a támogatási csoportok között, közvetlenül az alkalmazáson belül.

Az élő csevegés funkció felhasználói sürgető kérdéseket tehetnek fel a termékkel kapcsolatban, érdeklődhetnek olyan területekről, amelyeket nem értenek, vagy jelenthetnek problémát, és megoldásokat kérhetnek. Eközben az ügyfélszolgálati csapatok valós idejű, részletes, a felhasználóra szabott visszajelzést tudnak adni.

Az élő chat funkció integrálásának előnyei

Az élő csevegés funkció integrálása számos előnnyel jár:

  • Az ügyfélszolgálati erőfeszítések javítása. Egy nagyszerű termék csak annyira jó, amennyire a használata. Az élő csevegés funkció integrálása jelentősen javítja a felhasználói élményt azáltal, hogy egyszerűen kaphat segítséget és gyorsan választ kaphat. Végső soron ez segít abban, hogy jobb szolgáltatásokat kínáljon, amelyek leegyszerűsítik terméke használatát.
  • Növelje az ügyfelek elkötelezettségét. Az élő csevegés lehetővé teszi a felhasználók számára, hogy valós időben kommunikáljanak az alkalmazással, így értékesnek érezhetik magukat. Ez arra készteti őket, hogy több tevékenységet végezzenek, regisztráljanak és teszteljenek több funkciót.
  • Szerezz több leadet és növeld az eladásokat. Ez a kommunikációs csatorna lehetőséget biztosít a felhasználókkal való személyes kapcsolattartásra. Használhatja ezt a lehetőséget a potenciális ügyfelek megszerzésére és vásárlókká alakítására. Termékajánlatokat is adhat, és terméke adott csomagjain továbbértékesítheti azokat.
  • A felhasználói adatok forrása. A digitális gazdaságban a felhasználók pontos adataihoz való hozzáférés jelentősen megelőzheti a versenytársakat. Amikor a felhasználók hibákról vagy más termékproblémákról beszélnek, ez a visszajelzés nagyon értékes. Többet megtudhat arról, hogyan lépnek kapcsolatba az Ön szolgáltatásával, és hogyan használhatja fel terméke fejlesztésére.

Mi az a Chatwoot?

A Chatwoot egy nyílt forráskódú ügyfélszolgálati platform, amely személyre szabott módot kínál a felhasználókkal való kapcsolattartásra. Ezenkívül egyszerűsített platformot biztosít a felhasználók kérdéseinek megválaszolásához, és több csatornán keresztül, valós időben történő visszajelzéshez.

Automatizálási, elemzési és jelentéskészítő eszközeivel elemezheti a felhasználói elkötelezettséget, és egyszerűen és hatékonyan kezelheti az ügyfélszolgálati műveleteket.

Ezzel az útmutatóval integrálhatja a Chatwootot az alkalmazásába, és kipróbálhatja élő csevegési funkcióját egy React klienssel és az ügyfélszolgálati irányítópulttal.

Chatwoot projekt beállítása

A Chatwoot egy testreszabható élő chat-bővítményt biztosít, amelyet könnyedén integrálhat alkalmazásába. Amennyire csak lehetséges, személyre szabhatja az ügyfélszolgálati igényeinek megfelelően.

Miután beágyazta a beépülő modul kódját az alkalmazásba, a felhasználó kommunikálhat az ügyfélszolgálati csapatokkal, és kezelhetik ezeket a beszélgetéseket a Chatwoot ügynökének irányítópultjáról.

  1. Irány a Chatwoot weboldala, regisztráljon egy fiókot, és lépjen a felhasználói irányítópultra.
  2. A felhasználók beszélgetéseinek kezeléséhez először be kell állítania a beérkező leveleket, és az igényeinek megfelelően testre kell szabnia. Kattintson a Új postafiók gombot a kezdéshez.
  3. Most válassza ki azt a csatornát, amelybe integrálni szeretné a Chatwootot. Ehhez az útmutatóhoz válassza a lehetőséget Weboldal mivel egy React alkalmazásba integrálja.
  4. Ezután töltse ki webhelye adatait. A helyi fejlesztéshez kipróbálhatja a funkciót egy helyi gazdagép-domain URL-címével, azonban az éles üzembe helyezés után ne felejtse el frissíteni a tartományt az élő URL-lel.
  5. Végül adjon hozzá egy ügynököt, hogy kezelje a beszélgetéseket ebben a postafiókban. Ez lehet az ügyfélszolgálati csapat tagja.

Sikeresen beállította a Chatwoot élő chatjét, és webhelyét kommunikációs csatornaként állította be. A Chatwoot előállítja azt a kódot, amelyet be kell ágyaznia az alkalmazásba az élő csevegés funkció widget hozzáadásához. Ez a kód nagyon rugalmas, mivel könnyen integrálható egy webes kliensbe, amely bármelyikével készült JavaScript frontend keretrendszerek.

Ha tovább szeretné személyre szabni a beállítást, kattintson a gombra További beállítások gomb.

React Project Setup

A funkció kipróbálásához hozzon létre egy React alkalmazást és beágyazott Chatwoot élő chat-bővítményt. Hozzon létre egy React alkalmazást és hozzon létre egy ENV-fájlt a projektmappa gyökérkönyvtárában a webhely-token tárolására.

REACT_APP_WEBSITE_TOKEN = token

Következő, a src könyvtárba, hozzon létre egy új mappát, és nevezze el az összetevőknek. Ebben a mappában hozzon létre egy új fájlt: Livechat.js.

Adja hozzá a következő kódot ehhez a fájlhoz:

import Reagálás, {useEffect} tól től'reagál'
funkcióÉlő chat () {
 useEffect(() => {
ablak.chatwootSettings = {
 hideMessageBubble: hamis,
 pozíció: "jobb", 
 terület: "en", 
típus: "alapértelmezett"
 };

 (funkció(d, t) {
var BASE_URL = " https://app.chatwoot.com";
var g = d.createElement (t), s = d.getElementsByTagName (t)[0];
 g.src = BASE_URL + "/packs/js/sdk.js";
 g.halasztás = igaz;
 g.async = igaz;
s.parentNode.insertBefore(g, s);


 g.onload = funkció() {
ablak.chatwootSDK.fuss({
websiteToken: folyamat.env.REACT_APP_WEBSITE_TOKEN,
 baseUrl: BASE_URL
 })
 }
 })(dokumentum, "forgatókönyv");
 }, []);


Visszatérésnulla;
};
exportalapértelmezett Élő chat;

Ez a kód integrálja a Chatwoot élő csevegési funkcióját a React alkalmazásba. A useEffect hook egyszer lefuttatja a kódot a visszahíváson belül, amikor az összetevő felcsatolódik. Először is inicializálja a Chatwoot beállításait a funkcióhoz. Ezután futtatja a Chatwoot által biztosított bővítmény funkciót, amely beállítja az élő csevegés widgetet az oldalon.

A websiteTokent paraméterként adja át a chatwootSDK.run függvénynek, amely összeköti az alkalmazást az Ön Chatwoot-fiókjával. Végül az élő csevegés függvény null értéket ad vissza, mivel nem kell HTML-elemeket megjelenítenie.

Tesztelje az élő csevegés funkciót

  1. Importálja ezt az összetevőt a sajátjába app.js fájlt, és pörgesse fel a fejlesztőkiszolgálót a változtatások frissítéséhez. Látnia kell az élő csevegés widgetet a Reacton, amely a böngészőben fut.
  2. Az élő csevegés funkció teszteléséhez kattintson a widgetre a beszélgetési csevegőfal megnyitásához, és írjon be egy üzenetet.
  3. Most lépjen a Chatwoot felhasználói irányítópultjára, és navigáljon a beérkezett üzenetek mappába, és új üzenetet kell látnia. Alapértelmezés szerint a Chatwoot generál néhány üzenetet, és azonnal automatikusan válaszol, miután a felhasználó üzenetet küld, mint például az alábbiakban. Írja be a választ az üzenetre, és kattintson a Küldés gombra. A válasz megtekintéséhez lépjen vissza az alkalmazás widget-csevegőfalához.

Sikeresen integrált egy élő csevegés funkciót az alkalmazásába, nagyon kevés kódsorral.

Megéri egy élő csevegési funkció?

Az élő csevegés nagyszerű módja az ügyfélszolgálat nyújtásának, az ügyfelek elégedettségének növelésének és a felhasználói élmény javításának.

Kommunikációs csatornát biztosít az elkötelezettség növelésére, a válaszidő csökkentésére és az ügyfélszolgálat személyre szabására. Végső soron kis erőfeszítéssel javíthatja az ügyfélszolgálati műveleteket.