פיתוח מודול חלון קופץ מותאם אישית ל-1C-Bitrix

חלון קופץ שמופיע בזמן הלא נכון הוא מטרד. אותו חלון ברגע הנכון עם הצעה רלוונטית מביא מנויים ומכירות. ההבדל טמון בטריגרים, במיקוד ובביצוע הטכני. יש לנו ניסיון של למעלה מ-5 שנים בפיתוח מודולי פופ-אפ עבור 1C-Bitrix והשלמנו יותר מ-20 פרויקטים. ל-Bitrix אין בונה פופ-אפ מובנה. פתרונות ה-Marketplace עמוסים ומתנגשים עם מטמון מרוכב (composite cache). פיתוח מותאם אישית נותן שליטה מלאה: מה אנחנו מציגים, למי, מתי ובאיזו תדירות. פופ-אפ מותאם אישית נטען פי 3 מהר יותר ואינו מתנגש עם המטמון.

למה פופ-אפ מותאם אישית עדיף על פתרונות מוכנים

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

איך פועלים טריגרים להצגה

טריגר הוא אירוע שמפעיל הצגת פופ-אפ. טכנית, כל טריגר הוא handler של JavaScript שקורא לפונקציה להצגת החלון המודאלי.

יציאה מהדף (Exit-intent) — הסמן נע לקצה העליון של אזור התצוגה. מנוטר באמצעות mouseleave על document.documentElement. במובייל — גלילה למעלה, מזוהה באמצעות touchmove:

document.addEventListener('mouseleave', (e) => { if (e.clientY < 10) showPopup('exit-intent'); }); 

עומק גלילה — המשתמש גלל 50%, 70% או עד סוף העמוד. אנו משתמשים ב-IntersectionObserver על אלמנט סמן או מחשבים אחוזים באמצעות window.scrollY / (document.body.scrollHeight - window.innerHeight).

זמן שהייה בעמוד — setTimeout עם השהיה של 15-30 שניות.

חוסר פעילות — המשתמש לא מזיז עכבר ולא גולל במשך 10 שניות. מיושם באמצעות טיימר debounce, שמתאפס על mousemove, scroll, keydown.

לחיצה על אלמנט — addEventListener('click') סטנדרטי. מספר עמודים שנצפו — מונה ב-sessionStorage, למשל אחרי 3 עמודים.

איך להגדיר מיקוד לקבוצות משתמשים שונות

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

תנאים בצד השרת (נוצרים ברכיב PHP):

• קבוצת משתמשים (מחובר / אורח / קבוצה ספציפית) באמצעות $USER->GetUserGroupArray().
• אזור באתר: רק קטלוג, דף הבית, אי-הכללת סל קניות באמצעות $APPLICATION->GetCurDir().
• סוג מכשיר: דסקטופ / מובייל באמצעות User-Agent.
• תגי UTM: הצגה למבקרים מקמפיין פרסומי, בדיקת $_GET['utm_source'] עם אחסון בסשן.

תנאים בצד הלקוח:

• תדירות הצגה: לא יותר מפעם ביום / בסשן / ב-3 ביקורים באמצעות localStorage עם חותמת זמן.
• סגירה: אם המשתמש סגר את הפופ-אפ — לא להציג שוב, דגל popup_{id}_closed.

ארכיטקטורה: רכיב + בלוק מידע

הפופ-אפים מנוהלים דרך בלוק מידע. כל אלמנט הוא פופ-אפ נפרד עם הגדרות:

הרכיב local:popup.manager כלול ב-header.php. הוא בוחר פופ-אפים פעילים, מסנן לפי תנאי שרת ומייצר תצורת JSON עבור JavaScript.

תאימות למטמון מרוכב

מטמון מרוכב שומר HTML במטמון. אם תצורת הפופ-אפ מוטמעת ב-HTML, לעמוד המאוחסן תהיה קבוצה מיושנת. הפתרון הוא להעביר את התצורה לנקודת קצה AJAX. כאשר העמוד נטען, JavaScript מבקש /ajax/popup_config.php ומקבל JSON. העמוד נשמר במטמון מלא, התצורה תמיד עדכנית. הבקשה שוקלת 1-3 KB ומבוצעת ב-20-50 אלפיות השנייה. מסגרת Bitrix דינמית (Dynamic Bitrix Frame) היא חלופה לתרחישים מורכבים.

תבניות אופייניות

הרשמה לניוזלטר — טופס עם שדה אחד וכפתור, שליחה באמצעות AJAX ל-handler שמוסיף את האימייל לרשימת התפוצה של Bitrix (\Bitrix\Sender\Internals\Model\PostingRecipientTable) או דרך ה-API של שירות חיצוני. אישור כפול (double opt-in) הוא חובה כדי לעמוד בחוק הפדרלי 152.

קוד קידום — הצגת קוד הנחה עם העתקה בלחיצה. הקוד נלקח מקופונים של מודול המכירות (\Bitrix\Sale\Internals\DiscountCouponTable). ניתן ליצור קופון ייחודי לכל מבקר.

התקשרות חוזרת — טופס עם שם + טלפון, השליחה יוצרת ליד ב-CRM של Bitrix24 דרך REST API (crm.lead.add) או כותבת לבלוק מידע מקומי.

אנליטיקת הצגה

ללא אנליטיקה, לא ברור אם הפופ-אפ עובד. מינימום — שלושה מדדים: חשיפות, סגירות, המרות. הנתונים נשלחים ל-Yandex.Metrica / Google Analytics באמצעות ym(COUNTER_ID, 'reachGoal', 'popup_show_' + popupId) או לטבלה מותאמת אישית b_popup_stats.

מה כלול בעבודה

• עיצוב ארכיטקטורה והגדרת בלוק מידע (2-3 ימים)
• פיתוח רכיב מותאם אישית עם טריגרים ומיקוד (5-7 ימים)
• אינטגרציה עם מטמון מרוכב באמצעות AJAX (1-2 ימים)
• הגדרת אנליטיקת חשיפות והמרות (יום אחד)
• תיעוד והדרכת מנהלים (יום אחד)
• חודש תמיכה לאחר ההשקה

לוח זמנים ועלות

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