גדלים של מודעות

בכל מיקום מודעה שתגדירו צריך לציין את הגדלים הכשירים להצגה במיקום מודעה זה. אופן ציון הגדלים של המודעות משתנה בהתאם לסוג המודעות שרוצים להציג, ובהתאם לגודל ולגמישות של מיקומי המודעות עצמם.

במקרים מסוימים, יכול להיות שגודל המודעה ישתנה ברמת הפריט ב-Google Ad Manager. למידע נוסף, בקרו במרכז העזרה.

הקוד המלא של הדוגמאות שכלולות במדריך הזה מופיע בדף לדוגמה ad sizes.

מודעות בגודל קבוע

אפשר להגדיר מיקום מודעה בדף בגודל קבוע אחד.

googletag
  .defineSlot("/6355419/Travel/Europe/France/Paris", [300, 250], "fixed-size-ad")
  .addService(googletag.pubads());

בדוגמה זו יוצגו רק קריאייטיבים בגודל 300x250.

נקודה חשובה: כשעובדים עם מודעות בגודל קבוע, מומלץ מאוד להגדיר את גודל הרכיב <div> שבו יוצג הקריאייטיב. נכסי קריאייטיב לרוב מוצגים באופן אסינכרוני, ולכן הם עלולים לגרום להזזה של רכיבים אחרים בדף אם לא נותר להם מספיק מקום.

מודעות בגדלים מרובים

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

googletag
  .defineSlot(
    "/6355419/Travel/Europe",
    [
      [300, 250],
      [728, 90],
      [750, 200],
    ],
    "multi-size-ad",
  )
  .addService(googletag.pubads());

בדוגמה הזו אפשר להציג קריאייטיבים בגדלים 300x250, 728x90 ו-750x200. מערכת Ad Manager מביאה בחשבון רק קריאייטיבים שתואמים לגדלים האלה במהלך תהליך בחירת המודעות.

אם לא צוינו מימדים למיקום המודעה <div> ב-CSS, GPT מגדיר באופן אוטומטי את המאפיינים השווה לגובה המוצהר הקצר ביותר ולרוחב המוצהר הרחב ביותר מ-1px כאשר מתבצעת קריאה ל-display(). במקרה הזה, הערך יהיה 750x90. עם זאת, שינוי הגודל הזה יכול להתרחש אחרי טעינה של תוכן אחר בדף, וכתוצאה מכך תזוזת התוכן. כדי למנוע שינויים בפריסה, כדאי לשריין מקום באמצעות CSS כפי שמוצג במדריך הפחתה של שינוי הפריסה.

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

מודעות נוזל

למודעות גמישות אין גודל קבוע, אלא שהן מתאימות את עצמן לתוכן הקריאייטיבי שלהן. בשלב זה, מודעות מותאמות הן סוג המודעות הגמיש היחיד שנתמך ב-Ad Manager.

במהלך עבודה עם מודעות משתנות, ייתכן שיצוין גודל מותאם אישית של fluid.

googletag
  .defineSlot("/6355419/Travel", ["fluid"], "native-ad")
  .addService(googletag.pubads());

בדוגמה הזו, מיקום המודעה יהיה ברוחב של מאגר ההורה, והגובה ישתנה בהתאם לתוכן הקריאייטיב. כדי לשנות את הגודל של מיקום המודעה ב-GPT, יש לבצע את הפעולות הבאות:

  1. התקבלה תגובה למודעה.
  2. תוכן הקריאייטיב נכתב ב-iframe, כשהגובה הראשוני מוגדר ל-0px והרוחב מוגדר ל-100%.
  3. לאחר שהטעינה של כל המשאבים ב-iframe תסתיים, הקריאייטיב יהיה גלוי על ידי הגדרת גובה ה-iframe השווה לגובה הרכיב <body> של ה-iframe.

מודעות רספונסיביות

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

כדי לעשות זאת, מגדירים מיפוי בין גודל אזור התצוגה לגודל המודעה, ולאחר מכן משייכים את המיפוי הזה למיקום המודעה בדף.

const responsiveAdSlot = googletag
  .defineSlot(
    "/6355419/Travel/Europe",
    [
      [300, 250],
      [728, 90],
      [750, 200],
    ],
    "responsive-ad",
  )
  .addService(googletag.pubads());

const mapping = googletag
  .sizeMapping()
  .addSize(
    [1024, 768],
    [
      [750, 200],
      [728, 90],
    ],
  )
  .addSize([640, 480], [300, 250])
  .addSize([0, 0], [])
  .build();

responsiveAdSlot.defineSizeMapping(mapping);

בדוגמה הזו, המיפוי מציין:

  • כאשר אזור התצוגה >= 1024x768, ניתן להציג מודעות בגודל 750x200 או 728x90.
  • כאשר 1024x768 > אזור התצוגה >= 640x480, מודעות בגודל 300x250 יכולות להופיע.
  • כאשר אזור התצוגה < 640x480, אי אפשר להציג מודעות.

GPT יזהה את גודל אזור התצוגה של הדפדפן ששולח את הבקשה, וישתמש במיפוי הגדול ביותר שמתאים. כדי לקבוע את המיפוי הגדול ביותר ב-GPT, המערכת מביאה בחשבון תחילה את הרוחב ואז את הגובה (כלומר [100, 10] > [10, 100]). במקרה של שגיאה במיפוי או אם לא ניתן לקבוע את גודל אזור התצוגה, ייעשה שימוש בגדלים שצוינו ב-defineSlot().

לאחר מכן, המיפוי משויך למיקום המודעה על ידי קריאה לשיטה Slot.defineSizeMapping(). השיטה הזו מקבלת מערך של מיפויים בפורמט הבא:

[
  [
    [viewport-width-1, viewport-height-1],
    [[ad-width-1, ad-height-1], [ad-width-2, ad-height-2], ...]
  ],
  [
    [viewport-width-2, viewport-height-2],
    [[ad-width-3, ad-height-3], [ad-width-4, ad-height-4], ...]
  ],
  ...
]

הסדר של גודלי אזורי התצוגה בתוך מערך זה מגדיר את העדיפות שלהם. הפונקציה SizeMappingBuilder שבה נעשה שימוש בדוגמה שלמעלה היא דרך נוחה ליצור מערך בפורמט הזה, שבו המידות ממוינות באופן אוטומטי מהגדול ביותר לקטן ביותר. בדוגמה הזו, הפלט של SizeMappingBuilder.build() הוא:

[
  [[1024, 768], [[750, 200], [728, 90]]],
  [[640, 480], [[300, 250]]],
  [[0, 0], []]
]