הגדרת מודעות באנר

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

המדריך הזה מסביר איך לטעון מודעת באנר מותאמת ומעוגנת באפליקציה ל-iOS.

דרישות מוקדמות

לפני שממשיכים, מגדירים את Google Mobile Ads SDK.

תמיד כדאי לבצע בדיקות באמצעות מודעות בדיקה

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

הדרך הכי קלה לטעון מודעות בדיקה היא להשתמש במזהה יחידת המודעות הייעודי לבדיקה שלנו לבאנרים ל-iOS:

/21775744923/example/adaptive-banner

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

מידע נוסף על אופן הפעולה של Google Mobile Ads SDK מודעות לבדיקה זמין במאמר מודעות לבדיקה.

יצירת GAMBannerView

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

באופן פרוגרמטי

אפשר גם ליצור מופע של GAMBannerView באופן ישיר. בדוגמה הבאה נוצר GAMBannerView:

Swift

// Initialize the banner view.
bannerView = AdManagerBannerView()
bannerView.delegate = self

bannerView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(bannerView)

// This example doesn't give width or height constraints, as the ad size gives the banner an
// intrinsic content size to size the view.
NSLayoutConstraint.activate([
  // Align the banner's bottom edge with the safe area's bottom edge
  bannerView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor),
  // Center the banner horizontally in the view
  bannerView.centerXAnchor.constraint(equalTo: view.centerXAnchor),
])

SwiftUI

כדי להשתמש ב-AdManagerBannerView, צריך ליצור UIViewRepresentable:

private struct BannerViewContainer: UIViewRepresentable {
  typealias UIViewType = BannerView
  let adSize: AdSize

  init(_ adSize: AdSize) {
    self.adSize = adSize
  }

  func makeUIView(context: Context) -> BannerView {
    let banner = BannerView(adSize: adSize)
    banner.adUnitID = "ca-app-pub-3940256099942544/2435281174"
    banner.load(Request())
    banner.delegate = context.coordinator
    return banner
  }

  func updateUIView(_ uiView: BannerView, context: Context) {}

  func makeCoordinator() -> BannerCoordinator {
    return BannerCoordinator(self)
  }

מוסיפים את UIViewRepresentable להיררכיית התצוגה, ומציינים את הערכים של height ושל width:

var body: some View {
  Spacer()
  // Request an anchored adaptive banner with a width of 375.
  let adSize = largeAnchoredAdaptiveBanner(width: 375)
  BannerViewContainer(adSize)
    .frame(width: adSize.size.width, height: adSize.size.height)
}

Objective-C

// Initialize the banner view.
GAMBannerView *bannerView = [[GAMBannerView alloc] init];
bannerView.delegate = self;
UIView *view = self.view;

bannerView.translatesAutoresizingMaskIntoConstraints = NO;
[view addSubview:bannerView];

// This example doesn't give width or height constraints, as the ad size gives the banner an
// intrinsic content size to size the view.
[NSLayoutConstraint activateConstraints:@[
  // Align the banner's bottom edge with the safe area's bottom edge
  [bannerView.bottomAnchor
      constraintEqualToAnchor:view.safeAreaLayoutGuide.bottomAnchor],
  // Center the banner horizontally in the view
  [bannerView.centerXAnchor constraintEqualToAnchor:view.centerXAnchor],
]];

self.bannerView = bannerView;

Interface Builder

אפשר להוסיף GAMBannerView ל-storyboard או לקובץ xib. אם בחרתם בשיטה הזו, חשוב להוסיף רק אילוצי מיקום למודעת הבאנר. לדוגמה, כשמציגים מודעת באנר מותאמת בתחתית המסך, מגדירים את החלק התחתון של תצוגת הבאנר כך שיהיה שווה לחלק העליון של Bottom Layout Guide, ומגדירים את האילוץ centerX כך שיהיה שווה ל-centerX של תצוגת העל.

הגדרת גודל המודעה

מודעות באנר מותאמות גדולות הן פורמט גדול יותר שמיועד לפריסות שלא דורשות גלילה. בהשוואה למודעות באנר מותאמות ומעוגנות רגילות, במודעות האלה הגובה המקסימלי גדול יותר (עד 20% מגובה המסך, בין 50 ל-150 נקודות). השטח המוגדל הזה מותאם לקטע וידאו.

בדוגמה הבאה מוצג גודל של מודעת באנר מותאמת ומעוגנת גדולה:

Swift

// Request a large anchored adaptive banner with a width of 375.
bannerView.adSize = largeAnchoredAdaptiveBanner(width: 375)

Objective-C

// Request a large anchored adaptive banner with a width of 375.
self.bannerView.adSize = GADLargeAnchoredAdaptiveBannerAdSizeWithWidth(375);

צריך להגדיר גודל מודעה שקטן מגודל המסך של המכשיר או שווה לו. כדי לקבוע את גודל המסך המקסימלי ב-iOS 26 ואילך, משתמשים במאפיין UIWindowScene.effectiveGeometry.coordinateSpace. ב-iOS מגרסה 18 ומגרסאות קודמות, צריך להשתמש במאפיין UIWindowScene.coordinateSpace. פרטים על מגבלות הגודל מופיעים במאמר בנושא פתרון בעיות שקשורות לחשיפות שלא מולאו ב-Ad Manager.

טעינת מודעה

אחרי שמטמיעים את GAMBannerView ומגדירים את המאפיינים שלו, כמו adUnitID, הגיע הזמן לטעון מודעה. כדי לעשות את זה, צריך להפעיל את loadRequest: באובייקט GAMRequest:

Swift

func loadBannerAd(bannerView: AdManagerBannerView) {
  // Request a large anchored adaptive banner with a width of 375.
  bannerView.adSize = largeAnchoredAdaptiveBanner(width: 375)
  bannerView.load(AdManagerRequest())
}

SwiftUI

banner.adUnitID = "ca-app-pub-3940256099942544/2435281174"
banner.load(Request())

Objective-C

// Request a large anchored adaptive banner with a width of 375.
self.bannerView.adSize = GADLargeAnchoredAdaptiveBannerAdSizeWithWidth(375);

[self.bannerView loadRequest:[GAMRequest request]];

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

רענון מודעה

אם הגדרתם את יחידת המודעות לרענון, אתם לא צריכים לבקש מודעה אחרת כשהמודעה לא נטענת. ‫Google Mobile Ads SDK מכבד את קצב הרענון שציינתם בממשק המשתמש של Ad Manager. אם לא הפעלתם את הרענון, שלחו בקשה חדשה. במאמר קצב הרענון של מודעות באפליקציות לנייד מוסבר איך להגדיר את קצב הרענון של יחידות המודעות.

טיפול בשינויים בכיוון המסך

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

Swift

override func viewWillTransition(
  to size: CGSize, with coordinator: UIViewControllerTransitionCoordinator
) {
  coordinator.animate(alongsideTransition: { _ in
    // Load a new ad for the new orientation.
  })
}

Objective-C

- (void)viewWillTransitionToSize:(CGSize)size
       withTransitionCoordinator:(id<UIViewControllerTransitionCoordinator>)coordinator {
  [coordinator animateAlongsideTransition:^(id<UIViewControllerTransitionCoordinatorContext> context) {
    // Load a new ad for the new orientation.
  } completion:nil];
}

אירועי מודעות

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

הרשמה לאירועים של מודעות באנר

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

Swift

bannerView.delegate = self

SwiftUI

banner.delegate = context.coordinator

Objective-C

bannerView.delegate = self;

הטמעת אירועים של מודעות באנר

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

Swift

func bannerViewDidReceiveAd(_ bannerView: BannerView) {
  print("Banner ad loaded.")
}

func bannerView(_ bannerView: BannerView, didFailToReceiveAdWithError error: Error) {
  print("Banner ad failed to load: \(error.localizedDescription)")
}

func bannerViewDidRecordImpression(_ bannerView: BannerView) {
  print("Banner ad recorded an impression.")
}

func bannerViewDidRecordClick(_ bannerView: BannerView) {
  print("Banner ad recorded a click.")
}

func bannerViewWillPresentScreen(_ bannerView: BannerView) {
  print("Banner ad will present screen.")
}

func bannerViewWillDismissScreen(_ bannerView: BannerView) {
  print("Banner ad will dismiss screen.")
}

func bannerViewDidDismissScreen(_ bannerView: BannerView) {
  print("Banner ad did dismiss screen.")
}

Objective-C

- (void)bannerViewDidReceiveAd:(GAMBannerView *)bannerView {
  NSLog(@"bannerViewDidReceiveAd");
}

- (void)bannerView:(GAMBannerView *)bannerView didFailToReceiveAdWithError:(NSError *)error {
  NSLog(@"bannerView:didFailToReceiveAdWithError: %@", error.localizedDescription);
}

- (void)bannerViewDidRecordImpression:(GAMBannerView *)bannerView {
  NSLog(@"bannerViewDidRecordImpression");
}

- (void)bannerViewWillPresentScreen:(GAMBannerView *)bannerView {
  NSLog(@"bannerViewWillPresentScreen");
}

- (void)bannerViewWillDismissScreen:(GAMBannerView *)bannerView {
  NSLog(@"bannerViewWillDismissScreen");
}

- (void)bannerViewDidDismissScreen:(GAMBannerView *)bannerView {
  NSLog(@"bannerViewDidDismissScreen");
}

אפשר לעיין בדוגמה של Ad Delegate כדי לראות הטמעה של שיטות להעברת מודעות באנר באפליקציית iOS API Demo.

Swift Objective-C

תרחישים לדוגמה

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

הוספת באנר להיררכיית התצוגה אחרי קבלת מודעה

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

Swift

func bannerViewDidReceiveAd(_ bannerView: BannerView) {
  // Add banner to view and add constraints.
  addBannerViewToView(bannerView)
}

Objective-C

- (void)bannerViewDidReceiveAd:(GAMBannerView *)bannerView {
  // Add bannerView to view and add constraints as above.
  [self addBannerViewToView:self.bannerView];
}

יצירת אנימציה למודעת באנר

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

Swift

func bannerViewDidReceiveAd(_ bannerView: BannerView) {
  bannerView.alpha = 0
  UIView.animate(withDuration: 1, animations: {
    bannerView.alpha = 1
  })
}

Objective-C

- (void)bannerViewDidReceiveAd:(GAMBannerView *)bannerView {
  bannerView.alpha = 0;
  [UIView animateWithDuration:1.0 animations:^{
    bannerView.alpha = 1;
  }];
}

השהיה והפעלה מחדש של האפליקציה

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

כדי לזהות את כל סוגי ההצגות של שכבות-על או הפעלות של דפדפנים חיצוניים, ולא רק כאלה שמגיעות מקליקים על מודעות, עדיף שהאפליקציה תאזין לשיטות המקבילות ב-UIViewController או ב-UIApplication. בטבלה הבאה מוצגות המתודות המקבילות ב-iOS שמופעלות בו-זמנית עם המתודות של GADBannerViewDelegate:

השיטה GADBannerViewDelegate שיטה ל-iOS
bannerViewWillPresentScreen: viewWillDisappear: של UIViewController
bannerViewWillDismissScreen: viewWillAppear: של UIViewController
bannerViewDidDismissScreen: ‫viewDidAppear: של UIViewController

ספירה ידנית של חשיפות

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

Swift

bannerView.enableManualImpressions = true

Objective-C

self.bannerView.enableManualImpressions = YES;

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

Swift

bannerView.recordImpression()

Objective-C

[self.bannerView recordImpression];

אירועים באפליקציה

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

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

Swift

// Set this property before making the request for an ad.
bannerView.appEventDelegate = self

Objective-C

// Set this property before making the request for an ad.
self.bannerView.appEventDelegate = self;

הדוגמה הבאה מראה איך לשנות את צבע הרקע של האפליקציה על ידי ציון הצבע מאירוע באפליקציה:

Swift

func bannerView(
  _ banner: AdManagerBannerView, didReceiveAppEvent name: String, withInfo info: String?
) {
  if name == "color" {
    if info == "green" {
      // Set background color to green.
      view.backgroundColor = UIColor.green
    } else if info == "blue" {
      // Set background color to blue.
      view.backgroundColor = UIColor.blue
    } else {
      // Set background color to black.
      view.backgroundColor = UIColor.black
    }
  }
}

Objective-C

- (void)bannerView:(GAMBannerView *)banner
    didReceiveAppEvent:(NSString *)name
              withInfo:(NSString *)info {
  if ([name isEqual:@"color"]) {
    if ([info isEqual:@"green"]) {
      // Set background color to green.
      self.view.backgroundColor = [UIColor greenColor];
    } else if ([info isEqual:@"blue"]) {
      // Set background color to blue.
      self.view.backgroundColor = [UIColor blueColor];
    } else {
      // Set background color to black.
      self.view.backgroundColor = [UIColor blackColor];
    }
  }
}

והנה הקריאייטיב התואם ששולח הודעות על אירועי צבע באפליקציה אל appEventDelegate:

<html>
<head>
  <script src="//www.gstatic.com/afma/api/v1/google_mobile_app_ads.js"></script>
  <script>
    document.addEventListener("DOMContentLoaded", function() {
      // Send a color=green event when ad loads.
      admob.events.dispatchAppEvent("color", "green");

      document.getElementById("ad").addEventListener("click", function() {
        // Send a color=blue event when ad is clicked.
        admob.events.dispatchAppEvent("color", "blue");
      });
    });
  </script>
  <style>
    #ad {
      width: 320px;
      height: 50px;
      top: 0px;
      left: 0px;
      font-size: 24pt;
      font-weight: bold;
      position: absolute;
      background: black;
      color: white;
      text-align: center;
    }
  </style>
</head>
<body>
  <div id="ad">Carpe diem!</div>
</body>
</html>

דוגמה להטמעה של אירועים באפליקציה זמינה באפליקציית ההדגמה של iOS API בנושא אירועים באפליקציה ב-Ad Manager.

Swift Objective-C

מקורות מידע נוספים

דוגמאות ב-GitHub

השלבים הבאים

מודעות באנר שאפשר לכווץ

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

מודעות באנר מותאמות שמוצגות בתוך הטקסט

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

נושאים נוספים