מודעות באנר הן מודעות מלבניות שתופסות חלק מהפריסה של האפליקציה. הם נשארים במסך בזמן שהמשתמשים יוצרים אינטראקציה עם האפליקציה. הם מעוגנים בחלק העליון או התחתון של המסך, או שהם מחוברים לתוכן בזמן שהמשתמש גולל. יכול להיות שיתבצע רענון אוטומטי של מודעות באנר אחרי פרק זמן מסוים. למידע נוסף, ראו סקירה כללית על מודעות באנר.
במדריך הזה מוסבר איך להתחיל להשתמש במודעות באנר מותאמות ומעוגנות, כדי למקסם את הביצועים על ידי אופטימיזציה של גודל המודעה בכל מכשיר בהתאם לרוחב המודעה שציינתם.
מודעת באנר מותאמת ומעוגנת
מודעות באנר מותאמות ומעוגנות הן מודעות עם יחס גובה-רוחב קבוע ולא מודעות בגודל קבוע רגיל. יחס הגובה-רוחב דומה לפורמט המקובל בתחום של 320*50. אחרי שתציינו את הרוחב המלא הזמין, תוחזר מודעה עם גובה אופטימלי לאותו רוחב. הגובה האופטימלי לא משתנה בבקשות מאותו מכשיר, והתצוגות שמסביב לא צריכות לזוז כאשר המודעה מתעדכנת.
דרישות מוקדמות
- מבצעים את ההוראות במדריך לתחילת העבודה.
ביצוע בדיקות באמצעות מודעות בדיקה תמיד
כשאתם יוצרים ובודקים את האפליקציות שלכם, חשוב לוודא שאתם משתמשים במודעות בדיקה ולא במודעות פעילות בסביבת הייצור. אם לא תעשו זאת, ייתכן שהחשבון שלכם יושעה.
הדרך הקלה ביותר לטעון מודעות בדיקה היא להשתמש במזהה הייעודי של יחידת מודעות לבדיקה עבור מודעות באנר ל-iOS:
/6499/example/adaptive-banner
היא מוגדרת במיוחד להחזרת מודעות בדיקה בכל בקשה, ואפשר להשתמש בה באפליקציות משלכם בזמן התכנות, הבדיקה וניפוי הבאגים. רק הקפידו להחליף אותו במזהה של יחידת המודעות שלכם לפני פרסום האפליקציה.
במאמר מודעות בדיקה מוסבר איך פועלות מודעות הבדיקה של Mobile Ads SDK.
יצירת GAMBannerView
מודעות באנר מוצגות באובייקטים GAMBannerView
, לכן השלב הראשון בשילוב של מודעות באנר הוא לכלול GAMBannerView
בהיררכיית התצוגות. בדרך כלל אפשר לעשות זאת באופן פרוגרמטי או באמצעות ה-API Builder.
באופן פרוגרמטי
אפשר גם ליצור מופע ישיר של GAMBannerView
.
הנה דוגמה ליצירת GAMBannerView
, המותאם למרכז התחתון של האזור הבטוח במסך:
Swift
import GoogleMobileAds import UIKit class ViewController: UIViewController { var bannerView: GAMBannerView! override func viewDidLoad() { super.viewDidLoad() let viewWidth = view.frame.inset(by: view.safeAreaInsets).width // Here the current interface orientation is used. Use // GADLandscapeAnchoredAdaptiveBannerAdSizeWithWidth or // GADPortraitAnchoredAdaptiveBannerAdSizeWithWidth if you prefer to load an ad of a // particular orientation, let adaptiveSize = GADCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(viewWidth) bannerView = GAMBannerView(adSize: adaptiveSize) addBannerViewToView(bannerView) } func addBannerViewToView(_ bannerView: GAMBannerView) { bannerView.translatesAutoresizingMaskIntoConstraints = false view.addSubview(bannerView) view.addConstraints( [NSLayoutConstraint(item: bannerView, attribute: .bottom, relatedBy: .equal, toItem: view.safeAreaLayoutGuide, attribute: .bottom, multiplier: 1, constant: 0), NSLayoutConstraint(item: bannerView, attribute: .centerX, relatedBy: .equal, toItem: view, attribute: .centerX, multiplier: 1, constant: 0) ]) } }
Objective-C
@import GoogleMobileAds; @interface ViewController () @property(nonatomic, strong) GAMBannerView *bannerView; @end @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; // Here safe area is taken into account, hence the view frame is used after the // view has been laid out. CGRect frame = UIEdgeInsetsInsetRect(self.view.frame, self.view.safeAreaInsets); CGFloat viewWidth = frame.size.width; // Here the current interface orientation is used. If the ad is being preloaded // for a future orientation change or different orientation, the function for the // relevant orientation should be used. GADAdSize adaptiveSize = GADCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(viewWidth); // In this case, we instantiate the banner with desired ad size. self.bannerView = [[GAMBannerView alloc] initWithAdSize:adaptiveSize]; [self addBannerViewToView:self.bannerView]; } - (void)addBannerViewToView:(UIView *)bannerView { bannerView.translatesAutoresizingMaskIntoConstraints = NO; [self.view addSubview:bannerView]; [self.view addConstraints:@[ [NSLayoutConstraint constraintWithItem:bannerView attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self.view.safeAreaLayoutGuide attribute:NSLayoutAttributeBottom multiplier:1 constant:0], [NSLayoutConstraint constraintWithItem:bannerView attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeCenterX multiplier:1 constant:0] ]]; } @end
שים לב שבמקרה זה לא תגדירו מגבלות רוחב או גובה, כי גודל המודעה שסופק יספק לבאנר תוכן פנימי בהתאם לגודל התצוגה.
הכלי לבניית ממשקים
אפשר להוסיף GAMBannerView
לסטוריבורד או לקובץ xib. כשמשתמשים בשיטה הזו, חשוב להוסיף מגבלות מיקום רק בבאנר. לדוגמה, כשמציגים מודעת באנר מותאמת בתחתית המסך, מגדירים את החלק התחתון של תצוגת הבאנר כך ששווה לחלק העליון של המדריך לפריסה למטה, ומגדירים את ה-X המרכזי כך ששווה למרכז של תצוגת העל.
גודל המודעה של הבאנר עדיין מוגדר באופן פרוגרמטי:
Swift
bannerView.adSize = GADCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(viewWidth)
Objective-C
self.bannerView.adSize = GADCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(viewWidth);
טעינת מודעה
אחרי הגדרת המאפיין GAMBannerView
והמאפיינים שלו, הגיע הזמן לטעון מודעה. כדי לעשות זאת, מפעילים את הפקודה loadRequest:
באובייקט GAMRequest
:
Swift
override func viewDidLoad() { super.viewDidLoad() ... // Set the ad unit ID and view controller that contains the GAMBannerView. bannerView.adUnitID = "/6499/example/adaptive-banner" bannerView.rootViewController = self bannerView.load(GAMRequest()) }
Objective-C
- (void)viewDidLoad { [super viewDidLoad]; ... // Set the ad unit ID and view controller that contains the GAMBannerView. self.bannerView.adUnitID = @"/6499/example/adaptive-banner"; self.bannerView.rootViewController = self; [self.bannerView loadRequest:[GAMRequest request]]; }
האובייקטים של GAMRequest מייצגים בקשה יחידה להצגת מודעה, ומכילים מאפיינים לדברים כמו מידע לטירגוט.
אם הטעינה של המודעה נכשלת, אין צורך לבקש מודעה נוספת באופן מפורש כל עוד הגדרתם רענון של יחידת המודעות. Google Mobile Ads SDK מכבד כל קצב רענון שציינתם בממשק המשתמש של Ad Manager. אם לא הפעלתם את הרענון, תצטרכו לשלוח בקשה חדשה.
אירועי מודעות
באמצעות GADBannerViewDelegate
אפשר להאזין לאירועים במחזור החיים, למשל כשסוגרים מודעה או כשהמשתמש עוזב את האפליקציה.
הרשמה לאירועי באנר
כדי להירשם לאירועים של מודעות באנר, צריך להגדיר את המאפיין delegate
ב-GAMBannerView
לאובייקט שמטמיע את הפרוטוקול GADBannerViewDelegate
. באופן כללי, המחלקה שמטמיעה מודעות באנר משמשת גם כמחלקה של בעל הגישה. במקרה כזה, אפשר להגדיר את המאפיין delegate
ל-self
.
Swift
import GoogleMobileAds import UIKit class ViewController: UIViewController, GADBannerViewDelegate { var bannerView: GAMBannerView! override func viewDidLoad() { super.viewDidLoad() ... bannerView.delegate = self } }
Objective-C
@import GoogleMobileAds; @interface ViewController () <GADBannerViewDelegate> @property(nonatomic, strong) GAMBannerView *bannerView; @end @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; ... self.bannerView.delegate = self; }
הטמעה של אירועים במודעות באנר
כל אחת מהשיטות ב-GADBannerViewDelegate
מסומנת כאופציונלית, לכן צריך רק להטמיע את ה-methods הרצויות. הדוגמה הבאה מממשת כל method ורושמת הודעה במסוף:
Swift
func bannerViewDidReceiveAd(_ bannerView: GADBannerView) { print("bannerViewDidReceiveAd") } func bannerView(_ bannerView: GADBannerView, didFailToReceiveAdWithError error: Error) { print("bannerView:didFailToReceiveAdWithError: \(error.localizedDescription)") } func bannerViewDidRecordImpression(_ bannerView: GADBannerView) { print("bannerViewDidRecordImpression") } func bannerViewWillPresentScreen(_ bannerView: GADBannerView) { print("bannerViewWillPresentScreen") } func bannerViewWillDismissScreen(_ bannerView: GADBannerView) { print("bannerViewWillDIsmissScreen") } func bannerViewDidDismissScreen(_ bannerView: GADBannerView) { print("bannerViewDidDismissScreen") }
Objective-C
- (void)bannerViewDidReceiveAd:(GADBannerView *)bannerView { NSLog(@"bannerViewDidReceiveAd"); } - (void)bannerView:(GADBannerView *)bannerView didFailToReceiveAdWithError:(NSError *)error { NSLog(@"bannerView:didFailToReceiveAdWithError: %@", [error localizedDescription]); } - (void)bannerViewDidRecordImpression:(GADBannerView *)bannerView { NSLog(@"bannerViewDidRecordImpression"); } - (void)bannerViewWillPresentScreen:(GADBannerView *)bannerView { NSLog(@"bannerViewWillPresentScreen"); } - (void)bannerViewWillDismissScreen:(GADBannerView *)bannerView { NSLog(@"bannerViewWillDismissScreen"); } - (void)bannerViewDidDismissScreen:(GADBannerView *)bannerView { NSLog(@"bannerViewDidDismissScreen"); }
ראו את הדוגמה להענקת גישה למודעות כדי להטמיע שיטות להענקת גישה למודעות באנר באפליקציית ההדגמה ל-API ל-iOS.
תרחישים לדוגמה
ריכזנו כאן כמה תרחישים לדוגמה של שיטות לאירועי מודעות כאלה.
הוספת באנר להיררכיית התצוגות אחרי שהמודעה מתקבלת
מומלץ להשהות את ההוספה של GAMBannerView
להיררכיית התצוגות עד לאחר קבלת המודעה. אפשר לעשות זאת על ידי האזנה לאירוע bannerViewDidReceiveAd:
:
Swift
func bannerViewDidReceiveAd(_ bannerView: GADBannerView) { // Add banner to view and add constraints as above. 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: GADBannerView) { 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
יש שיטות להודיע לכם על אירועים, למשל כשקליק גורם להצגה או לסגירה של שכבת-על. אם אתם רוצים לבדוק אם האירועים האלה נבעו ממודעות, אתם צריכים להירשם ל-methods GADBannerViewDelegate
.
כדי לצפות בכל הסוגים של מצגות שכבת-על או הפעלות של הדפדפן החיצוני, ולא רק את אלה שמקורן בקליקים על מודעות, עדיף להשתמש באפליקציה כדי להאזין לשיטות המקבילות ב-UIViewController
או ב-UIApplication
. כך למשל מוצגות השיטות המקבילות ל-iOS שמופעלות באותו זמן כמו ה-methods 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];
אירועים באפליקציה
אירועי אפליקציה מאפשרים לכם ליצור מודעות שיכולות לשלוח הודעות לקוד האפליקציה שלהן. לאחר מכן האפליקציה תוכל לבצע פעולות בהתאם להודעות האלה.
אפשר להאזין לאירועים באפליקציה שהם ספציפיים ל-Ad Manager באמצעות GADAppEventDelegate
.
האירועים האלה יכולים להתרחש בכל שלב במחזור החיים של המודעה, עוד לפני הקריאה ל-bannerViewDidReceiveAd:
של האובייקט GADBannerViewDelegate
.
Swift
// Implement your app event within this method. The delegate will be // notified when the SDK receives an app event message from the ad. // Called when the banner receives an app event. optional public func bannerView(_ banner: GAMBannerView, didReceiveAppEvent name: String, withInfo info: String?)
Objective-C
// Implement your app event within this method. The delegate will be // notified when the SDK receives an app event message from the ad. @optional // Called when the banner receives an app event. - (void)bannerView:(GAMBannerView *)banner didReceiveAppEvent:(NSString *)name withInfo:(NSString *)info;
ניתן להטמיע את השיטות של אירועי האפליקציה בבקר תצוגה מפורטת:
Swift
import GoogleMobileAds class ViewController: UIViewController, GADAppEventDelegate { }
Objective-C
@import GoogleMobileAds; @interface ViewController : UIViewController <GADAppEventDelegate> { } @end
זכרו להגדיר את בעל הגישה באמצעות הנכס appEventDelegate
לפני שליחת בקשה להצגת מודעה.
Swift
bannerView.appEventDelegate = self
Objective-C
self.bannerView.appEventDelegate = self;
הדוגמה הבאה מראה איך לשנות את צבע הרקע של האפליקציה על ידי ציון הצבע באמצעות אירוע באפליקציה:
Swift
func bannerView(_ banner: GAMBannerView, didReceiveAppEvent name: String, withInfo info: String?) { if name == "color" { guard let info = info else { return } switch info { case "green": // Set background color to green. view.backgroundColor = UIColor.green case "blue": // Set background color to blue. view.backgroundColor = UIColor.blue default: // 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>
ראו את הדוגמה 'אירועים באפליקציה של Ad Manager' להטמעה של אירועי אפליקציה באפליקציית ההדגמה ל-iOS API.
מקורות מידע נוספים
דוגמאות ב-GitHub
- דוגמה למודעות באנר מותאמות ומעוגנות: Swift | Objective-C
- הדגמה של תכונות מתקדמות: Swift | Objective-C
השלבים הבאים
מודעות באנר שאפשר לכווץ
מודעות באנר שאפשר לכווץ הן מודעות באנר שמוצגות בהתחלה כשכבת-על גדולה יותר, עם לחצן לכיווץ המודעה. כדאי להשתמש בהם כדי לבצע אופטימיזציה נוספת של הביצועים. פרטים נוספים זמינים במאמר בנושא מודעות באנר שאפשר לכווץ.
מודעות באנר מותאמות שמוצגות בתוך הטקסט
מודעות באנר מותאמות שמוצגות בתוך הטקסט הן מודעות באנר גדולות וגבוהות יותר בהשוואה למודעות באנר מותאמות ומעוגנות. הגובה שלהם משתנה, והם יכולים להגיע לגובה של מסך המכשיר. באפליקציות שמציבים מודעות באנר בתוכן שאפשר לגלול, מומלץ להשתמש במודעות באנר מותאמות שמוצגות בתוך הטקסט, ולא במודעות באנר מותאמות ומעוגנות. למידע נוסף, ראו מודעות באנר מותאמות שמוצגות בתוך הטקסט.