כיצד להוסיף את צ'אטבוט ה-AI של Asyntai ל-Webflow

מדריך שלב אחר שלב לאתרי Webflow

פלטפורמה:

שלב 1: קבל את קוד ההטמעה שלך

First, go to your Asyntai Dashboard and scroll down to the "Embed Code" section. Copy your unique embed code which will look like this:

<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>

הערה: הקוד למעלה הוא רק דוגמה. עליך להעתיק את קוד ההטמעה הייחודי שלך מלוח הבקרה שלך כיוון שהוא מכיל את מזהה הווידג'ט האישי שלך.

שלב 2: הוספת קוד דרך הגדרות האתר (כל העמודים)

כדי להוסיף את הצ'אטבוט לכל עמודי אתר ה-Webflow שלכם בבת אחת:

התחברו לחשבון ה-Webflow שלכם ובחרו את הפרויקט
לחצו על סמל גלגל השיניים (הגדרות אתר) בסרגל הצד השמאלי
לחצו על "Custom Code" בתפריט ההגדרות
גללו מטה אל קטע "Footer Code" (לפני תגית </body>)
הדבק את קוד ההטמעה של Asyntai
לחצו על "Save Changes"
פרסמו את האתר כדי שהשינויים ייכנסו לתוקף

טיפ: הוספת הקוד לקטע ה-Footer ממקמת אותו ממש לפני תגית הסגירה </body>, מה שמומלץ לווידג'טים של צ'אט מכיוון שזה לא יאט את טעינת העמוד.

חלופה: קוד מותאם אישית לעמוד ספציפי

אם אתה רוצה את הצ'אטבוט רק בעמודים ספציפיים:

פתחו את הפרויקט שלכם ב-Webflow Designer
לחצו על פאנל העמודים (סמל תיקייה) בסרגל הצד השמאלי
רחפו מעל העמוד שברצונכם לערוך ולחצו על סמל גלגל השיניים
גללו מטה אל "Custom Code"
הדביקו את קוד ההטמעה של Asyntai בקטע "Before </body> tag"
לחץ על "Save"
פרסמו את האתר

חלופה: שימוש ברכיב הטמעה

תוכלו גם להוסיף את הצ'אטבוט באמצעות רכיב ההטמעה בכל מקום בעמוד:

פתחו את הפרויקט שלכם ב-Webflow Designer
לחצו על כפתור "+" כדי לפתוח את פאנל ההוספה
חפשו "Embed" או מצאו אותו תחת Components
גררו את רכיב ההטמעה אל העמוד שלכם
הדביקו את קוד ההטמעה של Asyntai בעורך הקוד
לחץ על "Save & Close"
פרסמו את האתר

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

שלב 3: אמת את ההתקנה

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

לא רואה את הווידג'ט? ודאו שפרסמתם את האתר לאחר הוספת הקוד. קוד מותאם אישית מופיע רק באתר החי, לא בתצוגה המקדימה של ה-Designer. נסו לנקות את מטמון הדפדפן או לצפות בחלון גלישה פרטית.

הוספת שורת החיפוש החכמה

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

הוסיפו את המאפיין data-replace לתגית הסקריפט והשורה תתפוס את מקומה של הקיימת בתבנית. הוסיפו אותו ב-Site Settings, Custom Code, Footer, באותו מקום שבו קוד הצאט, וכך הוא ימוקם ממש לפני תגית body הסוגרת.

<script src="https://widget.asyntai.com/static/js/search-widget.js" data-asyntai-id="YOUR_WIDGET_ID" data-replace="auto" async></script>

קראו את המדריך המלא לשורת החיפוש החכמה