שלוש דרכים להוסיף את טופס SupportRetriever לכל פרויקט: כתובת ישירה, iframe, או קישור HTML.
קבלת קוד ההטמעה
בקריאה ל-GET /api/agent/form מתקבלות כל אפשרויות ההטמעה: direct_url, iframe, html_link (default ו-with_styles).
אפשרות 1: כתובת ישירה (כתובת ישירה)
שימוש: קישורים, הפניות, שיתוף. פורמט: https://supportretriever.com/form/[form-id]
יתרונות: הכי פשוט, עובד בכל מקום, מובייל, אפשר להוסיף פרמטרי URL. חסרונות: המשתמש עוזב את הדף.
אפשרות 2: הטמעת iframe
שימוש: טופס inline בדף. פורמט: <iframe src="..." width="100%" height="600" frameborder="0" style="border: none;"></iframe>
יתרונות: הטופס נשאר בדף, מראה משולב. חסרונות: דורש תמיכה ב-iframe, גובה קבוע.
iframe רספונסיבי: wrapper עם padding-bottom ו-position absolute ל-iframe.
אפשרות 3: כפתור קישור HTML
שימוש: כפתורים מעוצבים שפותחים את הטופס. גרסה פשוטה עם class, גרסה עם inline styles, גרסה מותאמת (class + style).
יתרונות: שליטה מלאה במראה. חסרונות: המשתמש עוזב את הדף.
פרמטרי URL למעקב
הוספת query parameters כמו ?מקור=homepage&campaign=summer2024&type=support – נשמרים אוטומטית עם כל שליחה לאנליטיקה.
בחירת האפשרות המתאימה
| שימוש | אפשרות מומלצת |
|---|---|
| קישור בתפריט | כתובת ישירה |
| דף יצירת קשר | iframe או כתובת ישירה |
| קישור בפוטר | כתובת ישירה |
| מודל/פופאפ | iframe |
| חתימת אימייל | כתובת ישירה |
| CTA בבלוג | כפתור קישור HTML |
| דף נחיתה | iframe או כתובת ישירה |
מובייל
- כתובת ישירה: חוויית מובייל טובה, נפתח במסך מלא
- iframe: אולי נדרש wrapper רספונסיבי
- קישור HTML: עובד מצוין, טופס במסך מלא
בדיקת ההטמעה
לפני השקה: לבדוק בדסקטופ (Chrome, Firefox, Safari), במובייל, שליחה מקצה לקצה, אימות קבלת שליחות ופרמטרי URL.