דמיינו את זה: מישהו שמשתמש באחד מהמוצרים שלכם נתקל בבעיה. ישנם כמה ערוצים שהם יכולים להשתמש בהם כדי לדווח על הבעיה ולנסות לפתור אותה.
ביניהם, הם יכלו לבחור באימייל או בשיחה. אבל ערוצי תקשורת אלה אינם מבטיחים תגובות מהירות, שלא לדבר על תגובות בזמן אמת. אבל צ'אט חי ואינטראקטיבי עם איש מקצוע בתמיכת לקוחות יכול להיות בעל ערך רב.
תכונת צ'אט חי הוכחה ככלי תקשורת שימושי מאוד. הסיבה לכך היא שהוא מאפשר לך לתקשר טוב יותר עם משתמשים, לשפר את חווית המשתמש ולפתור בעיות במהירות ובזמן אמת.
מהו צ'אט חי ולמה זה חשוב?
תכונת צ'אט חי נכללת בדרך כלל כווידג'ט בצד של דף אינטרנט, או כחלון מוקפץ שמופיע לאחר טעינת האתר. הוא מספק תקשורת בזמן אמת בין משתמשים ונציגי שירות לקוחות או צוותי תמיכה, ישירות בתוך האפליקציה.
משתמשים בתכונת הצ'אט החי יכולים לשאול שאלות דוחקות על המוצר, לברר לגבי תחומים שהם לא מבינים או לדווח על בעיה ולבקש פתרונות. בינתיים, צוותי תמיכת הלקוחות שלך יכולים לספק משוב מפורט בזמן אמת, בהתאמה אישית למשתמש.
היתרונות של שילוב תכונת צ'אט חי
שילוב תכונת צ'אט חי יכול להביא מספר יתרונות:
- שפר את מאמצי שירות הלקוחות. מוצר נהדר הוא רק טוב כמו השימוש בו. שילוב תכונת צ'אט חי עוזרת לשפר משמעותית את חוויית המשתמש על ידי מתן דרך קלה לקבל עזרה ותשובות במהירות. בסופו של דבר, זה יעזור לך להציע שירותים טובים יותר המייעלים את השימוש במוצר שלך.
- הגבר את מעורבות הלקוחות. צ'אט חי מאפשר למשתמשים ליצור אינטראקציה עם האפליקציה שלך בזמן אמת, מה שגורם להם להרגיש מוערכים. זה מנחה אותם לעסוק יותר, להירשם ולבדוק תכונות נוספות.
- צור יותר לידים והגדל את המכירות. ערוץ תקשורת זה מספק דרך לאינטראקציה אישית עם המשתמשים שלך. אתה יכול להשתמש בהזדמנות זו כדי ללכוד לידים ולהפוך אותם ללקוחות. אתה יכול גם לספק המלצות למוצרים ולמכור אותם במכירה יתרה על חבילות ספציפיות של המוצר שלך.
- מקור נתוני המשתמש. בכלכלה הדיגיטלית, גישה לנתונים מדויקים על המשתמשים יכולה להוביל אותך באופן משמעותי לפני המתחרים. כאשר משתמשים מספרים לך על באגים או בעיות אחרות במוצר, המשוב הזה הוא בעל ערך רב. אתה יכול ללמוד עוד על האופן שבו הם מקיימים אינטראקציה עם השירות שלך ולהשתמש בו כדי לשפר את המוצר שלך.
מה זה Chatwoot?
Chatwoot היא פלטפורמת שירות לקוחות בקוד פתוח המספקת דרך מותאמת אישית ליצירת קשר עם המשתמשים שלך. זה גם מספק לך פלטפורמה פשוטה להגיב לשאילתות של משתמשים ולספק משוב על פני מספר ערוצים בזמן אמת.
אתה יכול להשתמש בכלי האוטומציה, הניתוח והדיווח שלו כדי לנתח את מעורבות המשתמשים ולנהל בקלות וביעילות את פעולות שירות הלקוחות.
באמצעות מדריך זה, אתה יכול לשלב את Chatwoot עם האפליקציה שלך ולבדוק את תכונת הצ'אט החי שלה עם לקוח React ולוח מחוונים של תמיכת לקוחות.
הגדרת פרויקט Chatwoot
Chatwoot מספקת תוסף צ'אט חי הניתן להתאמה אישית שתוכל לשלב בקלות באפליקציה שלך. אתה יכול להתאים אותו ככל האפשר כדי להתאים לצרכי שירות הלקוחות שלך.
לאחר שתטמיע את קוד הפלאגין באפליקציה שלך, משתמש יכול לתקשר עם צוותי תמיכת הלקוחות שלך, והם יכולים לנהל את השיחות הללו מלוח המחוונים של הסוכן של Chatwoot.
- פנה אל האתר של Chatwoot, הירשם לחשבון ונווט ללוח המחוונים של המשתמש.
- כדי לנהל את השיחות של המשתמשים שלך, תחילה עליך להגדיר תיבת דואר נכנס ולהתאים אותה בהתאם למה שאתה דורש. הקלק על ה תיבת דואר נכנס חדשה כפתור כדי להתחיל.
- כעת, בחר את הערוץ שבו תרצה לשלב את Chatwoot. עבור מדריך זה, בחר אתר אינטרנט מכיוון שאתה משלב אותו באפליקציית React.
- לאחר מכן, מלא את פרטי האתר שלך. לפיתוח מקומי אתה יכול לבדוק את התכונה עם כתובת אתר של דומיין מארח מקומי, עם זאת, לאחר הפריסה לייצור, זכור לעדכן את הדומיין בכתובת האתר החיה.
- לבסוף, הוסף סוכן/ים לניהול השיחות בתיבת הדואר הנכנס הזו. זה יכול להיות חבר בצוות תמיכת הלקוחות שלך.
הגדרת בהצלחה את הצ'אט החי של Chatwoot כשהאתר שלך מוגדר כערוץ תקשורת. Chatwoot תייצר את הקוד שאתה צריך להטמיע באפליקציה שלך כדי להוסיף את הווידג'ט של תכונת הצ'אט החי. קוד זה גמיש מאוד מכיוון שאתה משלב אותו בקלות בלקוח אינטרנט שנבנה עם כל אחד מה- מסגרות חזיתיות של JavaScript.
אם ברצונך להתאים אישית את ההגדרה לחץ על הגדרות נוספות לַחְצָן.
React Project Setup
צור אפליקציית React והטמיע את תוסף הצ'אט החי של Chatwoot כדי לבדוק את התכונה. צור אפליקציית React וצור קובץ ENV בספריית השורש של תיקיית הפרויקט שלך כדי להחזיק את אסימון האתר שלך.
REACT_APP_WEBSITE_TOKEN = אסימוןלאחר מכן, ב- src ספרייה, צור תיקיה חדשה ושם לה רכיבים. בתיקייה זו צור קובץ חדש: Livechat.js.
הוסף את הקוד הבא לקובץ זה:
יְבוּא הגיבו, {useEffect} מ'לְהָגִיב'פוּנקצִיָהצ'אט חי () {
useEffect(() => {
חַלוֹן.chatwootSettings = {
hideMessageBubble: שֶׁקֶר,
עמדה: "ימין",
מיקום: "he",
סוּג: "תֶקֶן"
};
(פוּנקצִיָה(ד, ט) {
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.defer = נָכוֹן;
g.async = נָכוֹן;
ס.parentNode.insertBefore(ז, ס);g.onload = פוּנקצִיָה() {
חַלוֹן.chatwootSDK.לָרוּץ({
websiteToken: תהליך.env.REACT_APP_WEBSITE_TOKEN,
baseURl: BASE_URL
})
}
})(מסמך, "תַסרִיט");
}, []);לַחֲזוֹרריק;
};
יְצוּאבְּרִירַת מֶחדָל צ'אט חי;
קוד זה משלב את תכונת הצ'אט החי של Chatwoot באפליקציית React שלך. ה-useEffect hook מריץ את הקוד בתוך ה-callback פעם אחת כאשר הרכיב נטען. ראשית, הוא מאתחל את ההגדרות של Chatwoot עבור התכונה. לאחר מכן הוא מריץ את פונקציית הפלאגין, המסופקת על ידי Chatwoot, המגדירה את ווידג'ט הצ'אט החי בעמוד.
הוא מעביר את ה-websiteToken כפרמטר לפונקציית chatwootSDK.run שמחברת את האפליקציה עם חשבון Chatwoot שלך. לבסוף, פונקציית הצ'אט החי מחזירה null מכיוון שאינך נדרש לעיבוד רכיבי HTML.
בדוק את תכונת הצ'אט החי
- ייבא את הרכיב הזה ב- app.js קובץ וסובב את שרת הפיתוח כדי לעדכן את השינויים שבוצעו. אתה אמור לראות את ווידג'ט הצ'אט החי ב-React שלך פועל בדפדפן.
- כדי לבדוק את תכונת הצ'אט החי, לחץ על הווידג'ט כדי לפתוח את קיר הצ'אט של השיחה והקלד הודעה.
- כעת, עברו ללוח המחוונים של המשתמש של Chatwoot ונווט לתיבת הדואר הנכנס שלך, אתה אמור לראות הודעה חדשה. כברירת מחדל, Chatwoot תייצר כמה הודעות ותגיב אוטומטית מיד לאחר שמשתמש שולח הודעה, כמו אלה שאתה רואה למטה. הקלד תגובה להודעה ולחץ על שלח. חזור לקיר הצ'אט של הווידג'ט באפליקציה שלך כדי לראות את התגובה.
שילבת בהצלחה תכונת צ'אט חי באפליקציה שלך עם מעט מאוד שורות קוד.
האם תכונת צ'אט חי שווה את זה?
תכונת צ'אט חי היא דרך מצוינת לספק שירות לקוחות, להגביר את שביעות רצון הלקוחות ולשפר את חווית המשתמש.
הוא מספק ערוץ תקשורת עם פוטנציאל להגביר את המעורבות, להפחית את זמן התגובה ולהתאים אישית את תמיכת הלקוחות. בסופו של דבר, זה אמור לעזור לך לשפר את פעולות שירות הלקוחות עם מעט מאמץ.
