# יישומון צ'אט

## מדריך הטמעת יישומון צ'אט באתר

הוסיפו לאתר שלכם יישומון צ'אט ידידותי למשתמש המאפשר למבקרים לתקשר ישירות דרך ממשק האתר. תהליך ההטמעה פשוט ויעניק לאתר שלכם יכולות הודעות מובנות.


### יצירה והגדרה של ווידג'ט הצ'אט

**איך מגיעים לשם:**

1. לחץ על **הגדרות** (Settings) ליד החלק התחתון של סרגל הצד השמאלי. (בטלפון, הקש תחילה על סמל התפריט **☰** בפינה העליונה כדי לפתוח את סרגל הצד.)
2. בסרגל הצד של ההגדרות, תחת **ערוצים** (Channels), לחץ על **ערוצים**.
3. מצא את הכרטיס **ווידג'ט צ'אט לאתר** (Website chat widget).
4. אם עדיין אין לך ווידג'ט, לחץ על **התחבר** (Connect) כדי ליצור אחד עם שם תצוגה והודעת פתיחה.
5. לאחר היצירה, לחץ על **נהל** (Manage) בכל עת כדי לפתוח את לוח ההגדרות המלא.


שינויים שאתה שומר חלים על הווידג'ט החי שלך באופן אוטומטי — אין צורך להדביק מחדש את קוד ההתקנה לאחר ביצוע שינוי.

לצד ההגדרות מוצגת **תצוגה מקדימה חיה** (Live preview): דף אינטרנט לדוגמה שבו פועל הווידג'ט האמיתי שלך, המציג את הצבעים, המיקום, הלוגו, סמל המפעיל והקופץ היזום בדיוק כפי שהמבקרים יראו אותם. התצוגה עוקבת אחר העריכות שלך בזמן אמת, כך שאין צורך לשמור כדי לראות איך נראה שינוי בצבע או בעיצוב. ניתן אפילו ללחוץ על כפתור הצ'אט בתוך התצוגה המקדימה כדי לפתוח את הווידג'ט ולנסות אותו.

### מה ניתן להתאים אישית

לוח הניהול מאורגן בארבעה חלקים.

#### מראה

- **ערכת נושא עיצובית:** עצבו מחדש את כל הווידג'ט בלחיצה אחת. שש ערכות נושא קובעות יחד את המראה, הצבעים, הפינות והגופן: **Classic** (המראה המוצק המקורי — סרגל כותרת צבעוני על לוח שטוח), **Glass** (לוח שקוף למחצה עם אפקט זכוכית חלבית המטשטש בעדינות את הדף שמאחוריו, כאשר הכותרת ותיבת ההודעות צפים ככרטיסים מעוגלים בתוכו), **Midnight** (גרסת Glass בצבעים כהים), **Bloom** (ורוד רך, מעוגל במיוחד), **Ember** (גרסת Glass בכתום חמים) ו-**Mono** (שחור-לבן, פינות חדות). ערכת נושא היא נקודת התחלה — לאחר בחירת אחת, עדיין ניתן לשנות כל צבע או הגדרה בנפרד. ווידג'טים חדשים מתחילים עם Glass; המעבר מתבצע באופן מיידי בכל מקום שבו הווידג'ט מוטמע, ללא צורך בשינויי קוד באתר שלך.
- **פינות וגופן:** שני כפתורי עיצוב עצמאיים. **פינות** קובע עד כמה הלוח, הבועות והכפתורים יהיו מעוגלים (מעוגל, רך או חד), ו-**גופן** בוחר את הגופן שהמבקרים יראו (ברירת מחדל, Serif, מעוגל או Mono) — הגופנים מגיעים ממה שכבר קיים במכשיר של המבקר, כך שלא נטען שום דבר נוסף באתר שלך.
- **שם תצוגה:** מוצג בכותרת הווידג'ט.
- **לוגו:** העלו תמונה שמופיעה בראש הצ'אט. השתמשו בלוגו החברה שלכם או בתמונת פנים ידידותית.
- **אייקון מפעיל:** האייקון שעל כפתור הצ'אט הצף עצמו. בחרו אחד מהאייקונים המובנים (בועת צ'אט, מטוס נייר, סימן שאלה ועוד), השתמשו שוב בלוגו שהעליתם, או העלו תמונה נפרדת משלכם — שימושי אם ברצונכם להציג תמונה של חבר צוות אמיתי שמקבל את פני המבקרים.
- **צבעים:** חמישה צבעים, כל אחד מהם מגדיר את החלק בווידג'ט שהוא צובע. **צבע מותג** הוא הכפתור הצף, הכותרת וההודעות של המבקר עצמו, עם **טקסט מותג** עבור הטקסט שמופיע מעליו. **בועת בוט** היא הרקע של תשובות הבוט שלכם ושל מחוון ההקלדה, עם **טקסט בועת בוט** עבור המילים שבתוכן ונקודות ההקלדה המונפשות. **חלון צ'אט** הוא הלוח שמאחורי כל ההודעות. בחרו צבע לבועת הבוט שיהיה שונה בבירור מצבע המותג שלכם — אם השניים תואמים, שני הצדדים של השיחה ייראו באותו צבע והמבקרים לא יוכלו להבדיל בין תשובות הבוט לבין ההודעות שלהם. בועת בוט באפור בהיר עם טקסט כהה לצד צבע המותג שלכם היא השילוב הבטוח.
- **מיקום:** מקמו את כפתור הצ'אט הצף בפינה **הימנית התחתונה** או **השמאלית התחתונה**, עם היסט אופקי ואנכי (בפיקסלים) אם הוא חופף למשהו אחר בדף שלכם.
- **שאלות פתיחה:** הצעות לתגובה מהירה (צ'יפים לחיצים) המוצגות בצ'אט כדי שהמבקרים יוכלו להתחיל בלחיצה אחת במקום להקליד — למשל "מהם המחירים שלכם?" או "האם אתם מציעים תמיכה?" — עד 10 שאלות.


#### התנהגות

- **הודעת פתיחה:** ההודעה הראשונה שהמבקרים רואים כשהם פותחים את הצ'אט (למשל, "איך אוכל לעזור לך?").
- **צליל:** השמעת צליל כאשר מגיעה הודעה חדשה בצ'אט.
- **בקשת הרשאת התראות:** ניתן לבקש מהמבקרים לאשר התראות דפדפן, כך שהם יקבלו התראה על תשובות גם כשהם עוברים ללשוניות אחרות.
- **בועת קופץ יזומה:** בועה קטנה ואופציונלית שקופצת לצד כפתור הצ'אט כדי להזמין אנשים ליצור קשר. הפעל אותה כדי להגדיר את ההודעה שלה, את הטקסט בכפתורי האישור/דחייה, וכמה שניות להמתין לפני שהיא מופיעה. הבועה נעלמת מעצמה לאחר 20 שניות אם איש לא לוחץ עליה (מספר זה קבוע), וברגע שמבקר לוחץ על **לא עכשיו**, היא לא תופיע שוב במהלך הביקור שלו. חלון הצ'אט עצמו לעולם לא נפתח מעצמו: הוא נפתח כאשר המבקר לוחץ על כפתור הצ'אט או על הבועה, ונשאר פתוח עד שהמבקר סוגר אותו.
- **מהירות תגובת ה-AI:** מחוון בין **איטי יותר** (אנושי יותר — ה-AI לוקח רגע לפני המענה) לבין **מהירות מקסימלית** (רובוטי יותר — התשובות מגיעות מהר ככל האפשר). מצב "מאוזן" נמצא באמצע.


#### שפות

הווידג'ט הוא רב-לשוני כברירת מחדל — אין צורך להפעיל דבר.

- **השפה נבחרת אוטומטית עבור המבקר.** ראשית, המערכת בודקת את השפה שהדף שלך מצהיר עליה ב-HTML שלו (`<html lang="it">`), ולאחר מכן היא חוזרת לשפת הדפדפן של המבקר. אם אף אחת מהן אינה שפה שאנו תומכים בה, תוצג אנגלית.
- **או שניתן לבחור שפה בעצמך.** השדה **שפת הווידג'ט** במקטע "התנהגות" מוגדר כברירת מחדל על "אוטומטי", שזהו תהליך הזיהוי שתואר לעיל. בחר שפה שם, והתוויות של הווידג'ט עצמו (שדות השם הפרטי, האימייל והטלפון בטופס המבקר וטקסט הדוגמה שלהם, הודעת הפרטיות, הכפתורים) יישארו בשפה זו ללא קשר למה שמוגדר בדף או בדפדפן. השתמש באפשרות זו כאשר בונה האתרים שלך אינו מצהיר על השפה הנכונה, או כאשר ברצונך לקבוע שפה אחת קבועה עבור כל מבקר.
- **שפות נתמכות:** אנגלית, הולנדית, גרמנית, צרפתית, ספרדית, איטלקית, פורטוגזית, רומנית, פולנית, ערבית, פינית ופיליפינית. זוהי הרשימה עבור הכפתורים והתוויות של הווידג'ט עצמו.
- **ההודעות שלך מתורגמות עבורך.** בכל פעם שאתה שומר, הודעת הפתיחה, בועת הקופץ היזומה ושאלות הפתיחה שלך מתורגמות לכל שתים-עשרה השפות לעיל. עליך לכתוב אותן רק פעם אחת, בכל שפה שתעדיף.
- **כתוב כל הודעה בשפה אחת בלבד.** אם תכניס שתי שפות לאותו שדה — למשל שורה באנגלית ושורה באיטלקית — כל התוכן יטופל כהודעה אחת ויתורגם כפי שהוא, כך שמבקר איטלקי יראה את אותו משפט פעמיים. כתוב את ההודעה פעם אחת, בכל שפה שתעדיף.
- **ה-AI משיב בשפת המבקר.** לא משנה באיזו שפה המשתמש מקליד, הסוכן שלך יענה באותה שפה, ללא קשר לשפה שבה מוצגות תוויות הווידג'ט. אם אתה מעדיף שהוא תמיד יענה בשפה קבועה אחת, ציין זאת בהנחיות הסוכן שלך.

**טיפ:** אם האתר שלך לא מגדיר מאפיין `lang` בתגית ה-`<html>` שלו, כדאי להוסיף אחד כזה. זהו הסימן החזק ביותר שיש לנו לבחירת השפה הנכונה, במיוחד עבור מבקרים הגולשים מחוץ לארץ.

#### איסוף לידים ופרטיות

- **איסוף פרטי מבקרים:** כבוי כברירת מחדל. כאשר מופעל, המבקרים מתבקשים להזין את שמם וכתובת האימייל שלהם (ואופציונלית את מספר הטלפון) לפני תחילת השיחה, כך שתוכל לתעד את הליד גם אם הם עוזבים באמצע הצ'אט.
- **כותרת הטופס** ו-**כותרת משנה לטופס:** התאם אישית את הכותרת וההסבר הקצר שמוצגים מעל הטופס.
- **איסוף מספר טלפון:** הפעל כדי לבקש גם מספר טלפון; כבוי יאסוף רק שם ואימייל.

> **מבקר השאיר מספר טלפון ועזב את האתר שלך — האם ניתן להמשיך בוואטסאפ?** כן. פתח את הצ'אט שלו ובחר ב-**המשך בוואטסאפ** מתפריט שלוש הנקודות (יש לחבר את WhatsApp Web או WhatsApp Business). <span data-t="appName">Your AI Connector</span> יוצרת שיחת וואטסאפ מקושרת עבור אותו אדם, מעתיקה את שמו, כתובת האימייל ופרטיו, וה-AI מעביר את מה שנאמר באתר, כך שאף אחד לא צריך לחזור על דבריו. צ'אט האתר נשאר במקומו ושתי השיחות מצביעות זו על זו תחת **שיחות מקושרות** בלוח אנשי הקשר. ראה [ממשק צ'אט](../chats/chat-interface.md).

> **האם סוכן ה-AI יכול להציע את המעבר לוואטסאפ בעצמו?** כן, ואין צורך בתכונה נוספת — שורה אחת בהוראות הסוכן עושה זאת. צור [קישור מקוצר](../settings/short-links.md) למספר הוואטסאפ שלך עם הודעה מוכנה מראש כגון "היי, התכתבתי באתר שלכם ואני רוצה להמשיך כאן", ולאחר מכן אמור לסוכן מתי לשלוח אותו, לדוגמה: "אם המבקר צריך לעזוב, רוצה להמשיך מאוחר יותר, או מבקש וואטסאפ, הצע להמשיך שם ושלח קישור זה: (הקישור המקוצר שלך)". קישורים בווידג'ט ניתנים להקשה, כך שהמבקר מגיע לוואטסאפ עם המספר שלך שנבחר וההודעה מוקלדת מראש, וההודעה הראשונה שלו פותחת שיחת וואטסאפ בתיבת הנכנס שלך. אם המבקר השאיר את מספר הטלפון שממנו הוא כותב (עם קידומת מדינה) בטופס הווידג'ט, <span data-t="appName">Your AI Connector</span> מקשרת בין שתי השיחות באופן אוטומטי וה-AI בוואטסאפ כבר מכיר את צ'אט האתר, בדיוק כמו ב-**המשך בוואטסאפ**. אם לא נאסף מספר טלפון, שתי השיחות לא יקושרו, לכן שמור על הודעה מוכנה מראש ספציפית מספיק כדי שסוכן הוואטסאפ ידע מאיפה האדם הגיע.
- **דרוש אישור מדיניות פרטיות:** ניתן לדרוש מהמבקרים לאשר את מדיניות הפרטיות שלך לפני הצ'אט, ולהגדיר את כתובת ה-URL שאליה היא מפנה.

> **מה הווידג'ט מאחסן בדפדפן של המבקר, והאם עליי להציב אותו מאחורי באנר עוגיות?** שום דבר לא מאוחסן רק מעצם טעינת הדף. הווידג'ט אינו כותב עוגיות ואינו משתמש באחסון דפדפן עד שהמבקר בוחר לשוחח: שולח הודעה ראשונה, ממלא את טופס פרטי המבקר, או מאשר את מדיניות הפרטיות שלך. מרגע זה הוא שומר מזהה שיחה אקראי והעתק של השיחה באותו דפדפן, כאחסון צד-ראשון בדומיין שלך, כך שהצ'אט עדיין יהיה שם כשהם יחזרו. הוא אינו טוען סקריפטים של ניתוח נתונים או מעקב ואינו מגדיר עוגיות צד-שלישי. מכיוון שלא נכתב דבר עד שהמבקר מבקש לשוחח, הדבר נופל תחת הגדרת אחסון הנחוץ בהחלט עבור שירות שהמבקר ביקש, כך שניתן לטעון אותו ללא צורך בחסימתו מאחורי באנר הסכמה. אם האתר שלך משתמש בכלי הסכמה בכל מקרה, זה בסדר גמור להשאיר את הווידג'ט מאחוריו; הצ'אט פשוט יופיע ברגע שהמבקר ייתן את הסכמתו.


#### ערוצים והטמעה

- **כפתור צירוף קבצים:** מאפשר למבקרים לשלוח תמונות וקבצים בצ'אט.
- **בורר אימוג'י:** מוסיף בורר אימוג'י לצד תיבת ההודעות.
- **קישורים לערוצים:** ניתן לכלול קישורים ל-WhatsApp, Instagram או Messenger כדי שהמבקרים יוכלו להמשיך את השיחה בפלטפורמה המועדפת עליהם. אפשרות זו מופיעה רק לאחר חיבור מספר WhatsApp, חשבון Instagram או Messenger.
- **כפתורי פעולה:** שורת קיצורי דרך בחלק העליון של הצ'אט שמובילים את המבקר ליעד מסוים במקום לשיחה — ראו [כפתורי פעולה](#action-buttons) להלן.
- **רשימה לבנה של דומיינים:** הגבילו את האתרים המורשים להטמיע את הווידג'ט שלכם. הוסיפו את הדומיינים שבהם התקנתם אותו (למשל `example.com` או `*.example.com`); השאירו ריק כדי לאפשר לכל דומיין.
- **ניתוב צ'אטים אלו אל:** בחרו את הקמפיין או הנציג שאמורים לטפל בצ'אטים שמגיעים מהקוד שאתם עומדים להעתיק. השאירו על **ברירת מחדל של החשבון** כדי להשתמש בניתוב הרגיל של הווידג'ט שלכם. ראו [שליחת דפים שונים לקמפיינים שונים](#send-different-pages-to-different-campaigns) להלן.
- **קטע הטמעה:** בחרו **בועה צפה** או **מוטבע** והעתיקו את קוד ההתקנה (ראו להלן).
- **קישור הדגמה ללקוח:** הדביקו כל כתובת אתר כדי לקבל קישור שניתן לשיתוף, הפותח את האתר עם הווידג'ט שלכם פועל עליו — אין צורך בהתקנה מצדם. ראו [הצגת הווידג'ט באתר של מישהו אחר](#show-the-widget-on-someone-elses-website) להלן.

בתחתית הלוח, פעולת **מחיקת ווידג'ט צ'אט** מסירה את הווידג'ט מהאתר שלך באופן מיידי — לא ניתן לבטל פעולה זו, והמבקרים לא יראו יותר את בועת הצ'אט.

#### כפתורי פעולה

חלק מהמבקרים לא רוצים לשוחח בצ'אט. הם רוצים את מספר הטלפון, הכתובת או האימייל שלכם, והם רוצים את זה בלחיצה אחת. כפתורי פעולה הם שורת קיצורי דרך בחלק העליון של לוח הצ'אט בדיוק למטרה זו.

ניתן להוסיף עד שישה כפתורים. לכל אחד יש **תווית** (המילים שעל הכפתור) ו**יעד**, והיעד תלוי בפעולה שתבחרו:

| פעולה | מה המבקר מקבל | מה עליכם למלא |
| --- | --- | --- |
| **שיחה** | חייגן הטלפון שלהם נפתח עם המספר שלכם מוכן | מספר הטלפון שלכם, למשל `+1 555 123 4567` |
| **SMS** | אפליקציית ההודעות שלהם פותחת הודעה חדשה אליכם | מספר הטלפון שלכם |
| **WhatsApp** | WhatsApp פותח צ'אט איתכם | מספר ה-WhatsApp שלכם, או קישור `wa.me` שכבר יש לכם |
| **אימייל** | אפליקציית המייל שלהם פותחת אימייל חדש אליכם | כתובת האימייל שלכם |
| **הוראות הגעה** | Google Maps נפתח עם המיקום שלכם | הכתובת שלכם, או קישור למפות שכבר יש לכם |
| **קישור** | הדף נפתח בלשונית חדשה | כל כתובת אתר מלאה המתחילה ב-`https://` |

**כפתורים אלו אינם משתמשים בקרדיטים.** לחיצה על אחד מהם לא שולחת הודעה ולא מתחילה שיחה — היא פשוט לוקחת את המבקר לאן שביקש להגיע. רק שיחה ממשית עם סוכן ה-AI שלכם משתמשת בקרדיטים, בדיוק כפי שהיה קודם.

כמה דברים שכדאי לדעת:

- **הכפתורים נשארים גלויים בזמן שהמבקר משוחח.** מישהו יכול לשאול שתי שאלות ועדיין ללחוץ על **הוראות הגעה** לאחר מכן מבלי לרענן את הדף.
- **התוויות שלכם מוצגות בדיוק כפי שכתבתם אותן.** בניגוד להודעת הפתיחה ושאלות הפתיחה שלכם, תוויות הכפתורים אינן מתורגמות אוטומטית, לכן אם אתם משרתים מבקרים בכמה שפות, שמרו על התוויות קצרות וברורות (או כתבו אותן בשפה העיקרית שלכם).
- **מלאו את הכפתור כראוי אחרת הוא לא יישמר.** אם מספר טלפון, כתובת אימייל או קישור אינם תקינים, הלוח יציין זאת ויחסום את **שמירת שינויים** במקום לפרסם כפתור שלא יבצע שום פעולה באתר שלכם.
- **הם אינם תשובות לשאלות נפוצות.** כפתורי פעולה רק שולחים אנשים למקום אחר; הם לא משיבים בטקסט מוכן מראש. שאלות הן התפקיד של סוכן ה-AI שלכם, והוא עונה עליהן מתוך בסיס הידע שלכם. אם ברצונכם להציע מה לשאול, השתמשו ב**שאלות פתיחה** תחת 'מראה' (Appearance).



#### מה לא ניתן להתאים אישית

לוח הניהול (Manage) מכיל את כל מכלול האפשרויות. באופן ספציפי:

- **ללא CSS מותאם אישית או גיליון סגנונות.** עיצוב הוא מה שבוררי הנושא, הפינה, הגופן והצבע מציעים — לא ניתן להזריק CSS משלך לתוך הווידג'ט, וכללים בדף שלך לא יחולו בתוכו.
- **ללא טקסט מציין מיקום (placeholder) מותאם אישית** בתיבת ההודעות.
- **ללא הגבלה גיאוגרפית או של מדינות.** ה-**Domain whitelist** מגביל אילו *אתרים* רשאים להטמיע את הווידג'ט; אין דרך להציג או להסתיר אותו על סמך המיקום של המבקר. אם אתה זקוק לכך, הסתר את קוד ההטמעה בעצמך בדפים או עבור קהלים שאינך מעוניין שיראו אותו.
- **ללא הטמעת וידאו** בתוך הצ'אט.
- **ללא טיימר הסתרה אוטומטית.** בועת ההזמנה נעלמת מעצמה לאחר 20 שניות ולא ניתן לשנות מספר זה; חלון הצ'אט הפתוח לעולם לא נסגר מעצמו. אם הבועה מסתירה תוכן בדף שלך, הזז את הווידג'ט באמצעות היסטים (offsets) של **מיקום** או כבה את הבועה והשאר רק את כפתור ההפעלה.

אם אחד מאלה מהווה חסם עבורך, ה-[הטמעה מוטבעת (inline embed)](#embed-inline-on-a-page-advanced) מעניקה לך את מירב השליטה: הווידג'ט יושב בתוך מכולה (container) בדף שלך, שאת גודלה ומיקומה אתה קובע בעצמך.


### הוראות התקנה

כדי להוסיף את ווידג'ט הצ'אט לאתר שלך, הוסף שורת קוד אחת ל-HTML של האתר.

1. פתח את קובץ ה-HTML של האתר שלך בעורך טקסט.
2. מצא את תגית הסגירה `</body>` — היא נמצאת בדרך כלל בסוף הקובץ.
3. הדבק את שורת הקוד הזו ממש לפני תגית ה- `</body>`, כדי ששאר הדף ייטען תחילה:

{% code overflow="wrap" %}
```html
<script src="https://api.youraiconnector.com/v1/chat-widget/CONFIG_ID"></script>
```
{% endcode %}

4. החלף את `CONFIG_ID` במזהה התצורה הייחודי שלך, המופיע במקטע **ערוצים והטמעה** (Channels & Embed) בלוח הניהול. מזהה זה ספציפי לחשבון שלך ומחבר את הווידג'ט למערכת ההודעות שלך.

הקטע לא יאט את האתר שלך: מדובר בטוען זעיר, והווידג'ט עצמו יורד ברקע מבלי לחסום את הדף. אם בכל זאת תרצה שהווידג'ט ימתין עד לסיום טעינת הדף במלואו, תוכל לעטוף את אותו ה-URL כך במקום:

{% code overflow="wrap" %}
```html
<script>
window.addEventListener('load', function () {
  var s = document.createElement('script');
  s.src = 'https://api.youraiconnector.com/v1/chat-widget/CONFIG_ID';
  s.async = true;
  document.body.appendChild(s);
});
</script>
```
{% endcode %}

ואם מה שברצונך לעכב הוא בועית ההזמנה הקטנה ולא טעינת הווידג'ט, ניתן להשתמש בעיכוב של **בועת הקופץ היזום** (Proactive popup bubble) בסעיף 'התנהגות' שלעיל — אין צורך בקוד.

הנה דוגמה מלאה לאיך קובץ ה-HTML שלכם אמור להיראות עם יישומון הצ'אט מוטמע:

{% code overflow="wrap" %}
```html
<!DOCTYPE html>
<html>
<head>
    <title>My Website</title>
</head>
<body>
    <!-- Your existing website content would be here -->

    <!-- Chat Widget Integration -->
    <script src="https://api.youraiconnector.com/v1/chat-widget/CONFIG_ID"></script>
</body>
</html>
```
{% endcode %}

### הטמעה מוטבעת בדף (מתקדם)

אם ברצונך שהצ'אט יופיע כחלק מהדף שלך — למשל בתוך מקטע ייעודי של "צור קשר", לשונית עזרה או סרגל צד — במקום כבועה צפה בפינה, העבר את **קטע הטמעה** (Embed snippet) למצב **מוטבע** (Inline) בלוח הניהול והעתק את קטע הקוד המוטבע.

זה נראה כך:

{% code overflow="wrap" %}
```html
<div data-chat-widget="CONFIG_ID" style="width:100%;height:600px;"></div>
<script src="https://api.youraiconnector.com/v1/chat-widget/embed.js" async></script>
```
{% endcode %}

ה-`<div>` הוא נקודת העיגון — לוח הצ'אט מרונדר בתוכו וממלא את ממדיו. עצבו את ה-div כרצונכם (הגדירו לו גובה קבוע, הניחו אותו בתוך קונטיינר flex, מקמו אותו בתא בתוך grid וכו') ולוח הצ'אט יתאים את עצמו.

אתם זקוקים רק לתג `<script>` **אחד** בדף, גם אם אתם מטמיעים מספר ווידג'טים של צ'אט. הסקריפט סורק את הדף עבור כל `<div data-chat-widget="…">` ומעגן לוח צ'אט בכל אחד מהם.

מתי לבחור בהטמעה מוטבעת (inline) לעומת צפה (floating):

- **בועת צ'אט צפה** מתאימה לכפתור "צריך עזרה?" שזמין תמיד בכל האתר.
- **הטמעה מוטבעת** מתאימה כאשר הצ'אט אמור להיות במקום ספציפי — דף תמיכה, סרגל צד של מאגר ידע, לשונית עזרה בתוך אפליקציה — ולהרגיש כחלק טבעי מאותו דף.

ההטמעה המוטבעת עושה שימוש חוזר באותה תצורה של הבועה הצפה (לוגו, הודעת פתיחה, איסוף לידים, שאלות פתיחה וכן הלאה), כך שאין צורך להגדיר דבר פעמיים.

### הצגת הווידג'ט באתר של מישהו אחר

באפשרותך להציג את ווידג'ט הצ'אט שלך פועל באתר שאינו בשליטתך — ללא צורך בקוד וללא צורך בגישה לאתר שלהם. זו הדרך המהירה ביותר להראות ללקוח פוטנציאלי איך העוזר ייראה בדפים שלו.

1. פתח את לוח הניהול וגלול אל **ערוצים והטמעה**.
2. ב**קישור הדגמה ללקוח**, הקלד את כתובת האתר (למשל `www.theircompany.com`).
3. לחץ על **העתק** כדי להעתיק את הקישור, או על **פתח** כדי לראות אותו בעצמך תחילה.
4. שלח את הקישור למי שברצונך להציג לו אותו.

פתיחת הקישור טוענת את אתר האינטרנט ההוא עם ווידג'ט הצ'אט שלך צף מעליו, בדיוק כפי שהיה נראה אילו היה מותקן. כל מי שיש לו את הקישור יכול לפתוח אותו — אין צורך להתחבר לשום מקום.

כמה דברים שכדאי לדעת:

- **צ'אטים מההדגמה הם אמיתיים.** הודעות שמבקר שולח בהדגמה מגיעות לתיבת הדואר הנכנס שלך ונענות על ידי הנציג שלך, והן משתמשות בקרדיטים כמו כל שיחה אחרת.
- **הדף ללא מיתוג.** הוא מציג את אתר האינטרנט שלהם ואת הווידג'ט שלך, ולא שום דבר אחר.
- **חלק מאתרי האינטרנט אינם ניתנים להטמעה במסגרת (iframe).** מספר אתרים (בנקים, קמעונאים גדולים, כל מה שנמצא מאחורי הגדרות אבטחה מחמירות) חוסמים דפים אחרים מלהציג אותם. כאשר זה קורה, הקישור עדיין עובד: הוא מציג חלון דפדפן ניטרלי במקום האתר האמיתי, עם הווידג'ט שלך פעיל מעליו כך שההדגמה עדיין מבצעת את תפקידה.
- **זה לא משנה את אתר האינטרנט שלהם.** שום דבר לא מותקן ושום דבר לא משתנה — ההדגמה קיימת רק בתוך הקישור הזה.

{% hint style="info" %}
קישור ההדגמה תמיד משתמש בניתוב ברירת המחדל של החשבון שלך, ללא קשר למה שמוגדר ב**ניתוב צ'אטים אלו אל**. אם ברצונך שצ'אטים מהדגמה יטופלו על ידי נציג ספציפי, הגדר תחילה את אותו נציג כברירת המחדל של ווידג'ט הצ'אט שלך.
{% endhint %}

### שלח דפים שונים לקמפיינים שונים

כברירת מחדל, כל צ'אט שמגיע דרך הווידג'ט שלך מטופל על ידי אותו קמפיין או נציג. באפשרותך לעקוף זאת עבור כל דף, כך שמבקרים בדף התמחור שלך ישוחחו עם קמפיין המכירות, בעוד שמבקרים בדף העזרה ישוחחו עם נציג התמיכה — הכל מאותו ווידג'ט צ'אט.

ישנן שתי דרכים להשיג את הקוד:

- **מהקמפיין או מהסוכן.** בדף **קמפיינים**, פתחו את התפריט **⋮** של קמפיין ובחרו ב-**הוספה לאתר**. בדף **סוכנים**, לחצו על הכפתור **&lt;/&gt;** בשורה, או פתחו את הסוכן ועברו ללשונית **נקודות כניסה**. בכל מקרה תקבלו קטע קוד מוכן להדבקה שכבר מופנה לאותו קמפיין או סוכן.

  בלשונית **נקודות כניסה** של סוכן יש גם לוח **ווידג'ט צ'אט לאתר** המציג כמה צ'אטים באתר הסוכן כבר מנהל. צ'אטים מהטמעה (embed) מגיעים ישירות לסוכן, לכן **אין** צורך ליצור עבורם כלל נקודת כניסה — סוכן ללא כללים כלל עדיין יענה להטמעה שלו.

  **הוספה לאתר** מופיעה רק בקמפיינים פעילים שהוגדרו לטיפול בצ'אטים נכנסים. קמפיין בטיוטה עדיין לא יכול לקבל מבקרים, לכן האפשרות מוסתרת עד לפרסומו. בדף הסוכנים, היא מופיעה עבור סוכנים פעילים. סוכן מושהה יקבל את הצ'אט אך לעולם לא ישיב, לכן האפשרות מוסתרת עד להפעלתו מחדש. אין ערוץ להגדרה עבור סוכן — סוכן יכול לקבל צ'אט מכל ערוץ.
- **מהגדרות הווידג'ט.** ב-**הגדרות ← ערוצים ← ניהול** בווידג'ט הצ'אט שלך, הגדר את **ניתוב צ'אטים אלו אל** והעתק את קטע הקוד שמתחתיו. שינוי התפריט הנפתח משנה את קטע הקוד.

קטע הקוד הצף נושא את היעד בכתובת:

{% code overflow="wrap" %}
```html
<script src="https://api.youraiconnector.com/v1/chat-widget/CONFIG_ID?campaign=CAMPAIGN_ID"></script>
```
{% endcode %}

קטע הקוד המוטבע נושא אותו ב-`<div>` במקום זאת, כך שדף אחד יכול להכיל מספר צ'אטים המופנים למקומות שונים:

{% code overflow="wrap" %}
```html
<div data-chat-widget="CONFIG_ID" data-campaign="CAMPAIGN_ID" style="width:100%;height:600px;"></div>
<script src="https://api.youraiconnector.com/v1/chat-widget/embed.js" async></script>
```
{% endcode %}

עבור נציג, הניסוח משתנה ל-`?agent=AGENT_ID` או `data-agent="AGENT_ID"`.

כמה דברים שכדאי לדעת:

- השתמש בלחצן ההעתקה במקום להקליד את המזהה (ID) ידנית. אם המזהה אינו תואם לקמפיין או לנציג בחשבונך, הצ'אט עדיין יעבוד אך יחזור לניתוב ברירת המחדל שלך.
- מי שנמצא באמצע שיחה יישאר עם מי שהתחיל איתו, גם אם יגיע מאוחר יותר לדף שמפנה למקום אחר. זה מונע מהשיחה לשנות את אופייה באמצע.
- יעד ספציפי לדף מקבל עדיפות על פני ברירת המחדל של החשבון שלך ועל פני מילות מפתח מפעילות.

### אמרו לווידג'ט מי הוא המבקר (מתקדם)

אם אתם מציבים את ווידג'ט הצ'אט בתוך אזור חברים, פורטל לקוחות או אפליקציה שבה אנשים כבר מחוברים, האתר שלכם כבר יודע מי הם. אתם יכולים להעביר את המידע הזה לווידג'ט כדי שלא יבקש מהמבקר פרטים שכבר סיפק לכם, וכדי שה-AI שלכם יוכל להשתמש במה שאתם כבר יודעים עליו.

הוסיפו בלוק הגדרות קטן **לפני** הסקריפט של הווידג'ט:

{% code overflow="wrap" %}
```html
<script>
  window.chatWidgetSettings = {
    visitor: {
      id: "12345",
      name: "Maria",
      email: "maria@example.com",
      phone: "+391234567890"
    },
    data: {
      plan: "Professional",
      customer_since: "2024",
      last_order: "A-2291"
    }
  };
</script>
<script src="https://api.youraiconnector.com/v1/chat-widget/CONFIG_ID"></script>
```
{% endcode %}

הדף שלכם אמור למלא את הערכים האלה בצד השרת, מתוך מי שמחובר כרגע.

שני דברים קורים:

- **טופס ה-"לפני שנתחיל..." מדלג.** עם שם ואימייל שסופקו, המבקר עובר ישירות לשיחה, והפרטים האלה נשמרים באיש הקשר שלו בדיוק כאילו הוא הקליד אותם בעצמו.
- **כל מה שנמצא תחת `data` מועבר ל-AI שלכם.** כל דבר שתשימו שם — תוכנית, מספר הזמנה, תאריך חידוש, יתרת אשראי, כמה מושבים יש להם — הופך לחלק ממה שה-AI יודע על אותו אדם, כך שהוא יכול לענות על "מתי התוכנית שלי מתחדשת?" מבלי לבקש מהם להסביר מי הם קודם לכן. השתמשו בכל שמות שדות שנראים לכם הגיוניים; הם יופיעו באיש הקשר תחת שדות מותאמים אישית (Custom Fields). עד 20 ערכים, שנשלחים מחדש עם כל הודעה, כך שאם התוכנית משתנה באמצע השיחה, ה-AI יראה את הערך החדש.

עבור הטמעות מוטבעות (inline embeds), אתם יכולים לשים את אותו מידע על ה-`<div>` במקום זאת, מה ששימושי כאשר דף אחד מכיל מספר צ'אטים:

{% code overflow="wrap" %}
```html
<div data-chat-widget="CONFIG_ID"
     data-visitor-name="Maria"
     data-visitor-email="maria@example.com"
     data-visitor-data='{"plan":"Professional"}'
     style="width:100%;height:600px;"></div>
<script src="https://api.youraiconnector.com/v1/chat-widget/embed.js" async></script>
```
{% endcode %}

אם האתר שלכם יודע מי המבקר רק לאחר טעינת הדף — למשל באפליקציית דף יחיד (SPA) שבה ההתחברות מתבצעת ללא רענון דף — קראו לפונקציה הזו בכל פעם שיש לכם את הפרטים, והווידג'ט יעדכן את עצמו:

{% code overflow="wrap" %}
```html
<script>
  window.chatWidget.setVisitor({
    visitor: { id: "12345", name: "Maria", email: "maria@example.com" },
    data: { plan: "Professional" }
  });
</script>
```
{% endcode %}

כמה דברים שכדאי לדעת:

- אם שני אנשים שונים מתחברים באותו מחשב, השני מתחיל שיחה חדשה במקום לראות את הצ'אט של הראשון. הווידג'ט מזהה את שינוי האדם ומאפס את עצמו.
- זה נועד להקשר (context), לא לחיבור משתמשים. שיחות עדיין נשמרות בנפרד כפי שהיו תמיד, כך שהעברת `id` לא מאפשרת לאף אחד לפתוח צ'אט של מישהו אחר, ומישהו שמשתמש במכשיר או בדפדפן אחר יתחיל שם שיחה חדשה.
- זה אופציונלי. ווידג'ט בדף ציבורי רגיל לא זקוק לכל זה ומתנהג בדיוק כפי שהתנהג קודם.

### שינוי הגדרות הווידג'ט מהקוד שלך (API)

ניתן לשנות את כל מה שמופיע בלוח ה-**ניהול** (Manage) של הווידג'ט גם באמצעות ה-[REST API](../api/reference.md), דבר שימושי אם אתה מנהל אתרים רבים או רוצה לכבות את כפתור הצירוף באופן אוטומטי עבור לקוח. שלח `PATCH` אל `https://api.youraiconnector.com/v1/chat-widget-configs/CONFIG_ID` עם מפתח ה-API שלך ורק את השדות שברצונך לשנות — לדוגמה, `{"show_upload_button": false}` מסתיר את כפתור הצירוף, `{"show_emoji_button": false}` מסתיר את בורר האימוג'י, ו-`{"launcher_icon": "chat-dots"}` מחליף את סמל המפעיל. `CONFIG_ID` הוא אותו מזהה שמופיע בסקריפט ההטמעה שלך. הרשימה המלאה של השדות המקובלים (שם, הודעת פתיחה, צבעים, סמל מפעיל, דומיינים מורשים, טופס פרטי מבקר, הודעת פרטיות, ערכת נושא, סגנון פינה וגופן) נמצאת ב-[מדריך ה-API](../api/reference.md) תחת **ווידג'ט צ'אט** (Chat Widget). אתרים יעדכנו את השינוי בטעינת הדף הבאה.

### למה לצפות לאחר ההתקנה

לאחר שתוסיף את הסקריפט לאתר שלך, ווידג'ט הצ'אט ייצור באופן אוטומטי כפתור צ'אט בפינת האתר שלך (כברירת מחדל בפינה הימנית התחתונה). הווידג'ט נשאר במיקום קבוע בזמן שהמשתמשים גוללים בדפים שלך, מה שמבטיח שהוא תמיד נגיש.


כאשר מבקרים לוחצים על כפתור זה, הוא מתרחב לחלון צ'אט מלא שבו הם יכולים להתחיל שיחה, תוך הצגת הודעת הפתיחה שלך. אם Collect visitor info (איסוף פרטי מבקר) מופעל, יופיע תחילה טופס קטן המבקש את שמם והאימייל שלהם (ואופציונלית טלפון) לפני שהם יוכלו להקליד.


ממשק הצ'אט מתאים את עצמו אוטומטית לגדלי מסך שונים, כך שהוא עובד בצורה חלקה גם במחשבים שולחניים וגם במכשירים ניידים.

### בדיקת ההטמעה שלכם

לאחר הוספת הווידג'ט לאתר שלך, בדוק שהוא עובד:

1. פתח את האתר שלך בדפדפן.
2. לחץ על כפתור הצ'אט כדי לפתוח את הווידג'ט.
3. שלח הודעת בדיקה וודא שאתה מקבל תשובה.
4. חזור על הפעולה במכשיר או בדפדפן אחר כדי לוודא שהוא עובד בכל מקום.


אם ווידג'ט הצ'אט אינו מופיע באתר שלך, בדוק את הדברים הבאים:

1. ודא שהחלפת את `CONFIG_ID` במזהה התצורה האמיתי שלך.
2. ודא שתגית הסקריפט ממוקמת לפני תגית הסגירה `</body>`.
3. בדוק את הקוד עבור שגיאות הקלדה.

### מאחורי חומת אש ארגונית

אם הווידג'ט נטען עבור הציבור אך לא עבור הצוות ברשת המשרדית, כמעט בוודאות שהרשת חוסמת את הדומיין שממנו הוא נטען. בקש מצוות ה-IT שלך לאפשר, באמצעות HTTPS רגיל בפורט 443:

- **הדומיין בקטע הקוד להטמעה שלך** — הכתובת בשורת ה-`<script src="...">` שהעתקת מלוח הניהול.
- **`api.youraiconnector.com`** — הווידג'ט שולח את הודעותיו גם לכאן.

אין צורך לפתוח שום דבר אחר: ללא פורטים נוספים וללא כללי כניסה (inbound rules). אם הווידג'ט עדיין לא מופיע לאחר מכן, פתח את מסוף המפתחים (developer console) בדפדפן שלך בעמוד הרלוונטי ושלח לנו את הדיווחים שמופיעים בו — בקשה חסומה מציינת את שם הדומיין שסורב, וזה בדרך כלל מספק את התשובה המלאה.