היום אני רוצה להראות לכם איך אפשר לדווח על רכישות מהשרת באמצעות Server Side Tag Manager (להלן sGTM).
אני אתן קצת רקע כדי שתבינו מה היתרון של כזה דבר, ולמה אי אפשר להסתפק בפתרונות המובנים שיש ב-sGTM.
איך Server Side Tag Manager עובד בגדול? (אבל ממש בגדול)
התג מנג’ר הרגיל שאתם רגילים לעבוד איתו (א.ק.א Client GTM) עובד בצורה פשוטה – כשהתג נורה הוא שולח פיקסל לפלטפורמה מסויימת, כמו גוגל אנליטיקס, גוגל אדס, פייסבוק וכד’
הנה איור נחמד מהדוקומנטציה של גוגל (שמסבירה את זה יפה מאוד):
ה-sGTM עובד בצורה קצת שונה – מהדפדפן הנתונים נשלחים לשרת שלכם ב-Google Cloud.
שם יש קונטיינר של sGTM, ובתוכו יש client שיודע לעבד את הבקשה ולפרסר (מלשון parse) את הנתונים שהיא מכילה.
למשל אם שלחתם לשרת בקשת POST כזו: https://sgtm.lixfix.co.il/data?event=purchase&revenue=222 אז הקליינט המתאים ידע לפרק את הפרמטרים event ו-revenue ולהפוך אותם לזמינים לשימוש.
אחרי שהפרמטרים זמינים, אתם יכולים לירות את התג המתאים שישלח את הנתונים לפלטפורמה הרצויה, כמו אנליטיקס, פייסבוק וכד’
הנה עוד איור נחמד מאותה דוקומנטציה:
העניין הוא, שכל client יודע לעבד רק סוג מסוים של בקשות.
למשל הקליינט GA4 יודע לעבד בקשות שמתקבלות שמתקבלות מתג GA4, והקליינט Universal Analytics יודע לעבד בקשות שמתקבלות מתג Universal Analytics.
ומה קורה אם אנחנו רוצים לשלוח דיווחים מהשרת שלנו ל-sGTM בכל פעם שגולש מסיים רכישה, כדי שמ-sGTM נוכל לדווח על הרכישה לפייסבוק (באמצעות Conversion API), לגוגל אנליטיקס ולמערכת ה-marketing automation שלנו כדי שנוכל לשלוח לרוכש מיילים בנוגע לרכישה?
כמו שהסברתי קודם, אנחנו צריכים client שידע לעבד את הבקשה ולפרק את כל הפרמטרים ששלחנו אודות הרכישה.
אז אפשרות אחת היא לשלוח את המידע בפורמט שמתאים לאחד הקליינטים שכבר נמצאים בתג מנג’ר, כמו Measurement Protocol.
הוא יעבד עבורנו את הבקשה הנכנסת (incoming request), ואנחנו נוכל להשתמש במידע הזה ולהרכיב בקשה יוצאת (outgoing request) שתצא לפייסבוק, גוגל אנליטיקס, ומערכת ה-marketing automation (כמובן שכל אחת מהבקשות תצטרך תג ייעודי):
הנה דוגמא לבקשה מסוג Measurement Protocol (GA4):
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
const measurement_id = `G-XXXXXXXXXX`; const api_secret = `<secret_value>`; fetch(`https://sgtm.lixfix.co.il/mp/collect?measurement_id=${measurement_id}&api_secret=${api_secret}`, { method: "POST", body: JSON.stringify({ client_id: 'XXXXXXXXXX.YYYYYYYYYY', events: [{ name: 'purchase', params: { item_name: 'the greatest product', price: 9999 }, }] }) }); |
העניין הוא שלא תמיד המתכנתים שלנו יוכלו להרכיב בקשה כזו.
בנוסף, לפעמים לא המתכנתים הם אלו ששולחים את הדיווח על הרכישה, אלא פלטפורמה שכל מה שהיא יודעת להוציא זה callback פשוט ל-URL מסוים.
כמו למשל https://sgtm.lixfix.co.il/data?event=purchase?item_name=the greatest product&price=9999
הקליינטים המובנים ב-sGTM לא יודעים לעבד בקשות מהסוג הזה, איך אנחנו לוקחים את המידע הזה ומעבדים אותו לטובת דיווח הרכישה לגוגל אנליטיקס, פייסבוק וכד’?
הפתרון – Data Client
כמו שאמרתי קודם, כל קליינט יודע לעבד רק בקשות מסוג מסויים.
כדי לעבד בקשות POST פשוטות אנחנו נשתמש בקליינט שנוצר על ידי חברת stape.io, ועושה עבודה מעולה.
את הקליינט תוכלו להוריד מכאן (אתם צריכים את הקובץ template.tpl)
כעת לכו ל-Templates ב-sGTM ולחצו על New:
לחצו על 3 הנקודות בצד ימין, ואז import:
בחרו את הקובץ template.tpl שהורדתם מ-github ולחצו על save.
זהו. עכשיו אם תלכו ל-Clients ותלחצו על New, תוכלו לראות שיש לכם אפשרות להוסיף קליינט מסוג Data Client:
שלב שני – שימוש בקליינט החדש
למעשה, אין יותר מדי הגדרות שצריך לעשות פה, ואלו ההגדרות הדיפולטיביות של הקליינט:
הקליינט יגיב (claims) לבקשות שיגיעו ל-URL של ה-sGTM שלכם ואחריו /data, ככה שאם ה-URL שלי הוא https://sgtm.lixfix.co.il, אז כדי שהבקשות שלי יעובדו על ידי הקליינט אני צריך לשלוח אותם ל-https://sgtm.lixfix.co.il/data.
בואו נשלח ונראה מה קורה
לצורך הבדיקה אני אשתמש בתוכנה בשם Insomnia, וארכיב בקשה POST פשוטה לכתובת של ה-sGTM.
ניתן לראות שאחרי ששלחתי אותה קיבלתי 200, כלומר הבקשה התקבלה ויש client שטיפל בה:
הנה מה שמופיע בדיבאגר של sGTM.
תוכלו לראות שהקליינט Data Client שיצרנו הגיב לבקשה:
והנה הנתונים שהוא פירסר. בין היתר יש שם את הפרמטרים שהעברנו:
רק לצורך ההשוואה, תראו מה קורה כשאני שולח את הבקשה ל-path שלא מוגדר בשום קליינט. הבקשה מתקבלת ב-sGTM, אבל הוא מחזיר 400 ואף קליינט לא מעבד אותה:
מה עושים עם המידע שהתקבל?
מה שאתם רוצים.
עכשיו זה הזמן שלכם ליצור variables שיאספו את הנתונים הרלוונטיים מתוך Event Data. לדוגמא:
ואת זה אתם יכולים לשלוח לכל מקום שרק תרצו (באמצעות התג המתאים כמובן):
סיכום והערה למתקדמים
באמצעות ה-Server Side Tag Manager השמיים הם הגבול, ותוכלו לעשות הרבה אינטגרציות חכמות בין המערכות שלכם.
ה-Data Client עליו הסברתי בפוסט, מאפשר לכם לקחת ולעבד את הבקשות הכי פשוטות, מבלי שתצטרכו להסביר למתכנתים איך בדיוק להרכיב את הבקשה.
כל מה שאתם צריכים לעשות זה לבקש מהם שישלחו את הנתונים ל-URL של ה-sGTM שלכם ואחריו /data, ואתם כבר תיקחו את המידע ותדווחו עליו לכל מערכות המדידה.
הערה למתקדמים:
כדי שהנתונים ישלחו לאנליטיקס, הם צריכים להופיע ב-Event Data בשמות מסויימים.
למשל ה-URL צריך להיקרא page_location, ה-User Agent צריך להיקרא user_agent, וכו’
הקליינט עליו דברנו יודע לקלוט ולעבד כל מיני וריאציות של הפרמטרים, אבל כמובן שהוא לא יכול לכסות את כל האפשרויות.
למשל אם תשלחו את ה-User Agent עם הפרמטר ua, הקליינט לא ידע שזה user agent:
עוד דוגמא – כתובת העמוד צריכה להיות אחת מהאפשרויות הבאות כדי שהקליינט יפרסר אותה ל-page_location, ואם תשלחו אותה עם הפרמטר page – יופיע לכם סתם page (ולא page_location) ואז זה לא יעבור כמו שצריך לאנליטיקס:
יחד עם זאת, אם יש לכם הבנה בקוד תוכלו לשנות את הקוד של הקליינט ולהוסיף תמיכה באיזה פרמטר שתרצו, אבל תעשו את זה בזהירות.
בהצלחה!