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

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

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

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

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

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

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], "fluid"],
    "multi-size-ad",
  )
  .addService(googletag.pubads());

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

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

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

מודעות המוצגות באופן גמיש

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

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

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

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

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

בשל האופי הגמיש של מודעות נוזליות, יש מספר אזהרות מודעים לו, כולל:

בדרך כלל חולף זמן רב יותר עד שמודעות גמישות יוצגו מאשר מודעות עם בגודל קבוע.
מודעות זופות יכולות לגרום לזרימה חוזרת של תוכן הדף לאחר שינוי הגודל שלהן, פעולה שמובילה לזרימה חוזרת של תוכן הדף יכולה להשפיע לרעה או של ביצועים.
מודעות נוזלות עלולות להיות מוצגות באופן שגוי אם רכיב האב של הקריאייטיב עלול גובה קבוע של ה-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], []]
]