איך מטמיעים טופס באתר
ב-Formy מטמיעים טופס באתר שלכם בהעתקת קוד אחד מלשונית השיתוף. הטופס מופיע בתוך העמוד, והגובה שלו מתאים את עצמו לתוכן, כך שאין פס גלילה פנימי. אפשר גם להציג אותו כחלון קופץ שנפתח מכפתור בפינת העמוד.
הטמעה זמינה בכל המסלולים, כולל Free, ועובדת בכל אתר שמאפשר להדביק קוד HTML, בלי תוסף.
נכתב בסיוע כלי AI ונבדק מול המוצר ב-. אושר לפרסום על ידי תומר גל, CTO ב-Formy. איך אנחנו כותבים ומאשרים תוכן
מה צריך לפני שמתחילים
- הטופס מפורסם. בטופס שהוא עדיין טיוטה, חלק ההטמעה לא מופיע.
- באתר שלכם יש מקום שמקבל קוד HTML: רכיב או בלוק של HTML בבונה האתר, או גישה לקוד העמוד.
- כדאי להחליט מראש בין טופס בתוך העמוד לבין חלון קופץ. חלון קופץ לא זמין לטופס בסגנון ממוקד, שמציג שאלה אחת בכל פעם.
איך עושים את זה, שלב אחר שלב
פותחים את לשונית השיתוף
בעמוד הטופס עוברים ללשונית שיתוף וגוללים לחלק הטמעת הטופס.
מעתיקים את הקוד
לוחצים העתקת הקוד. הקוד כולל את הטופס עצמו (
iframe) וסקריפט קטן של Formy שמתאים את הגובה.
החלק "הטמעת הטופס" בלשונית "שיתוף". הצילום מהרצה מקומית, ולכן הכתובת בקוד שייכת למחשב המקומי. צילום מסך מהמוצר, עם נתונים בדויים. מדביקים באתר
באתר מוסיפים רכיב HTML במקום שבו הטופס צריך להופיע, ומדביקים את הקוד כמו שהוא. שומרים ומפרסמים את העמוד באתר.
כדאי לא לשנות את הקוד. הסקריפט מזהה את הטופס לפי הכתובת שבו.
רוצים חלון קופץ? משתמשים בכפתור הפופאפ
באותו חלק לוחצים הטמעה כ-פופאפ. בחלון שנפתח רואים דמו חי, ותחת התאמה אישית בוחרים צבע, אימוג׳י, צד (למטה מימין או משמאל) ורוחב מרבי לטופס, 500 פיקסלים כברירת מחדל. מעתיקים את הקוד ומדביקים אותו בחלק
<head>של האתר.
האפשרויות של החלון הקופץ: צבע הכפתור העגול, האימוג'י שעליו, הפינה שבה הוא מופיע והרוחב המרבי של הטופס. צילום מסך מהמוצר, עם נתונים בדויים. בודקים בעמוד החי
פותחים את העמוד באתר, ממלאים את הטופס עד הסוף ובודקים שהתגובה מופיעה בלשונית תגובות של הטופס ב-Formy.
איך בודקים שזה עבד
הטופס מוצג ברוחב מלא של האזור שבו הדבקתם אותו, והגובה גדל וקטן עם התוכן, גם במעבר בין עמודים בטופס.
פרמטרים של קמפיין בכתובת של העמוד באתר שלכם, כמו utm_source או gclid, נשמרים עם התגובה, גם כשהטופס מוטמע.
בהטמעה בתוך העמוד, מי שמנהל את האתר יכול להאזין לאירועים של הטופס בקוד, למשל formy.on('submit', …) אחרי שליחה מוצלחת, ולמלא שדה בעזרת setField. קוד החלון הקופץ לא כולל את הסקריפט הזה.
מה עושים כשמשהו לא עובד
- בלשונית השיתוף אין חלק הטמעה
- הטופס עדיין טיוטה. פרסמו אותו.
- לחיצה על הטמעה כ-פופאפ מציגה אזהרה ולא פותחת חלון
- הטופס בסגנון ממוקד. חלון קופץ לא נתמך בסגנון הזה. הטמיעו אותו בתוך העמוד, או החליפו את סגנון הטופס לקלאסי.
- הטופס בעמוד נחתך או מופיע עם פס גלילה
- כנראה הודבק רק חלק מהקוד, בלי הסקריפט שאחרי ה-iframe, או שבונה האתר מסיר סקריפטים. העתיקו שוב את כל הקוד, ובדקו שבונה האתר משאיר את תגית ה-
script. - הפיקסל או Google Analytics של הטופס לא מדווחים מהעמוד באתר
- כלי מדידה שחיברתם לטופס ב-Formy לא נטען בתוך הטמעה, בכוונה. מדדו את העמוד באתר בכלים של האתר, או השתמשו באירוע
submitשל הסקריפט. הפרטים במדריך לפיקסל ול-GA4. - בטופס מוטמע, שדה קורא ברקוד לא פותח את המצלמה
- קודי ההטמעה של Formy, גם בתוך העמוד וגם בחלון קופץ, לא מבקשים מהדפדפן גישה למצלמה בשביל הטופס. לכן אחרי פתיחת מצלמה מופיע אישור גישה למצלמה, ושום ברקוד לא נקרא. בטופס עם סריקת ברקוד שולחים את קישור הטופס עצמו, בהודעה או בקוד QR.
- אחרי שינוי הכתובת של הטופס, ההטמעה הפסיקה לעבוד
- הקוד מכיל את כתובת הטופס. אחרי חידוש הקישור העתיקו את הקוד מחדש והחליפו אותו באתר.
מגבלות ומסלולים
| מה | זמינות |
|---|---|
| טופס בתוך העמוד | כל המסלולים, כולל Free |
| חלון קופץ | כל המסלולים, בטופס בסגנון קלאסי בלבד |
| כלי מדידה של הטופס בתוך ההטמעה | לא נטען, בכל המסלולים |
| שדה קורא ברקוד בתוך ההטמעה | המצלמה לא נפתחת, בכל המסלולים |
נכון ל-. המחירים והמכסות המלאים בעמוד המחירים.
מה אי אפשר לעשות
- להפעיל בתוך הטמעה את הפיקסל, GA4 או GTM שהגדרתם לטופס ב-Formy.
- להציג חלון קופץ לטופס בסגנון ממוקד.
- להטמיע טופס שעדיין טיוטה.
- לסרוק ברקוד במצלמה בתוך טופס מוטמע. לסריקה שולחים את קישור הטופס עצמו.
מה עוד כדאי לקרוא
מה היכולת עושה, למי היא מתאימה ומה היא לא עושה, בעמוד הטמעת טופס באתר.
רוצים לראות את זה במסך? בסרטון ההדרכה איך משתפים טופס: קישור, קוד QR והטמעה באתר.
אין לכם עדיין חשבון ב-Formy?
פותחים חשבון חינמי, בונים טופס, ומשתמשים במדריך הזה צעד אחר צעד.
פתיחת חשבון בחינםלא הסתדרתם, או שמשהו כאן כבר לא תואם למה שאתם רואים? כתבו ל-support@formy.co.il, ונבדוק. לכל המדריכים במרכז העזרה