راه‌اندازی آگهی‌های برنمایی

پلاتفرم را انتخاب کنید: Android iOS Unity Flutter Android (Legacy)

آگهی‌های برنما آگهی‌های مستطیلی هستند که بخشی از چیدمان برنامه را اشغال می‌کنند. برنماهای تطبیقی ثابت همیشه روی صفحه هستند و به بالا یا پایین صفحه با حداکثر ارتفاع ۲۰٪ اندازه صفحه با حداکثر ارتفاع ۱۵۰ پیکسل ثابت می‌شوند. برای بهینه‌سازی اندازه آگهی برای هر دستگاه، از برنماهای تطبیقی استفاده کنید.

این راهنما بار کردن آگهی بنری تطبیقی ثابت در برنامه 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)
}

آبجکتیو-سی

// 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;

سازنده میانای کاربری

می‌توانید GAMBannerView را به فایل xib یا storyboard اضافه کنید. هنگام استفاده از این روش، حتماً فقط محدودیت‌های موقعیت را به برنما اضافه کنید. برای مثال، وقتی برنمای تطبیقی در پایین صفحه نمایش داده می‌شود، پایین نمای برنما را برابر با بالای «راهنمای چیدمان پایین» تنظیم کنید، و قید centerX را برابر با centerX نمای فرادست تنظیم کنید.

تنظیم اندازه آگهی

برنماهای تطبیقی بزرگ قالب بزرگ‌تری را ارائه می‌کنند که برای چیدمان‌های بدون پیمایش طراحی شده است. در مقایسه با برنماهای تطبیقی ثابت استاندارد، این برنماها اجازه می‌دهند ارتفاع بیشینه بلندتری داشته باشند (تا ۲۰٪ ارتفاع صفحه، بین ۵۰ تا ۱۵۰ نقطه). این فضای افزایش‌یافته برای محتوای ویدیویی بهینه‌سازی شده است.

مثال زیر اندازه برنمای تطبیقی لنگرانداخته بزرگ را دریافت می‌کند:

Swift

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

آبجکتیو-سی

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

بار کردن آگهی

وقتی 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())

آبجکتیو-سی

// 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.
  })
}

آبجکتیو-سی

- (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

آبجکتیو-سی

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.")
}

آبجکتیو-سی

- (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");
}

برای پیاده‌سازی روش‌های نماینده برنمایی در برنامه iOS API Demo، مثال «نماینده آگهی» را ببینید.

Swift Objective-C

موارد استفاده

در اینجا چند نمونه مورد استفاده برای این روش‌های رویداد آگهی آورده شده است.

پس‌از دریافت آگهی، برنمایی به سلسله‌مراتب نما اضافه کنید

بهتر است افزودن GAMBannerView به سلسله مراتب نما را تا پس‌از دریافت آگهی به‌تأخیر بیندازید. با گوش دادن به رویداد bannerViewDidReceiveAd: می‌توانید این کار را انجام دهید:

Swift

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

آبجکتیو-سی

- (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
  })
}

آبجکتیو-سی

- (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

آبجکتیو-سی

self.bannerView.enableManualImpressions = YES;

وقتی تشخیص دادید که آگهی باموفقیت برگردانده شده است و روی صفحه است، می‌توانید ظهور را به‌صورت دستی راه‌اندازی کنید:

Swift

bannerView.recordImpression()

آبجکتیو-سی

[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

آبجکتیو-سی

// 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
    }
  }
}

آبجکتیو-سی

- (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

  • نمونه نمایشی ویژگی‌های پیشرفته: Swift | Objective-C

مراحل بعدی

برنماهای جمع‌شدنی

آگهی‌های برنمای جمع‌شدنی آگهی‌های برنمایی هستند که در ابتدا به‌عنوان یک هم‌پوشانی بزرگ‌تر ارائه می‌شوند و دکمه‌ای برای جمع کردن آگهی به اندازه کوچک‌تر دارند. برای بهینه‌سازی بیشتر عملکردتان، استفاده از آن را درنظر بگیرید. برای جزئیات بیشتر، آگهی‌های برنمای جمع‌شدنی را ببینید.

برنماهای تطبیقی درون‌خطی

برنماهای تطبیقی درون‌خطی در مقایسه با برنماهای تطبیقی لنگرشده بزرگ‌تر و بلندتر هستند. ارتفاع آن‌ها متغیر است و می‌تواند به‌اندازه ارتفاع صفحه‌نمایش دستگاه باشد. برنماهای تطبیقی درون‌خطی نسبت‌به آگهی‌های برنمای تطبیقی لنگردار برای برنامه‌هایی که آگهی‌های برنما را در محتوای پیمایشی قرار می‌دهند توصیه می‌شود. برای جزئیات بیشتر، برنماهای تطبیقی درخط را ببینید.

کاوش موضوعات دیگر