تبلیغات بنری

پلتفرم مورد نظر: اندروید، iOS، یونیتی، فلاتر

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

این راهنما به شما نشان می‌دهد که چگونه با تبلیغات بنری تطبیقی ​​لنگر انداخته شده شروع به کار کنید، که با بهینه‌سازی اندازه تبلیغ برای هر دستگاه با استفاده از عرض تبلیغی که شما مشخص می‌کنید، عملکرد را به حداکثر می‌رساند.

بنر تطبیقی ​​لنگردار

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

پیش‌نیازها

همیشه با تبلیغات آزمایشی تست کنید

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

ساده‌ترین راه برای بارگذاری تبلیغات آزمایشی، استفاده از شناسه واحد تبلیغات آزمایشی اختصاصی ما برای بنرهای iOS است:

ca-app-pub-3940256099942544/2435281174

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

برای اطلاعات بیشتر در مورد نحوه عملکرد تبلیغات آزمایشی SDK تبلیغات موبایل، به بخش تبلیغات آزمایشی مراجعه کنید.

ایجاد یک GADBannerView

بنرهای تبلیغاتی در اشیاء GADBannerView نمایش داده می‌شوند، بنابراین اولین قدم برای ادغام بنرهای تبلیغاتی، گنجاندن یک GADBannerView در سلسله مراتب نمای شما است. این کار معمولاً یا به صورت برنامه‌نویسی یا از طریق Interface Builder انجام می‌شود.

از نظر برنامه‌نویسی

یک GADBannerView همچنین می‌تواند مستقیماً نمونه‌سازی شود. مثال زیر یک GADBannerView ایجاد می‌کند:

سویفت 

// Initialize the banner view.
bannerView = BannerView()

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),
])
BannerSnippets.swift

سویفت‌یو‌آی

برای استفاده از BannerView ، یک 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)
  }
BannerContentView.swift

UIViewRepresentable خود را به سلسله مراتب نما اضافه کنید و مقادیر height و width را مشخص کنید:

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

هدف-سی 

// Initialize the banner view.
self.bannerView = [[GADBannerView alloc] init];

self.bannerView.translatesAutoresizingMaskIntoConstraints = NO;
[self.view addSubview:self.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
    [self.bannerView.bottomAnchor constraintEqualToAnchor:self.view.safeAreaLayoutGuide.bottomAnchor],
    // Center the banner horizontally in the view
    [self.bannerView.centerXAnchor constraintEqualToAnchor:self.view.centerXAnchor],
]];
BannerSnippets.m

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

می‌توانید یک GADBannerView به یک فایل storyboard یا xib اضافه کنید. هنگام استفاده از این روش، مطمئن شوید که فقط محدودیت‌های موقعیت را روی بنر اضافه می‌کنید. برای مثال، هنگام نمایش یک بنر تطبیقی ​​در پایین صفحه، پایین نمای بنر را برابر با بالای Bottom Layout Guide تنظیم کنید و محدودیت centerX را برابر با centerX نمای بالا قرار دهید.

اندازه تبلیغ را تنظیم کنید

ساختار GADSize را روی یک نوع بنر تطبیقی ​​متصل با عرض مشخص تنظیم کنید:

سویفت 

// Request an anchored adaptive banner with a width of 375.
bannerView.adSize = currentOrientationAnchoredAdaptiveBanner(width: 375)
ViewController.swift

هدف-سی 

// Request an anchored adaptive banner with a width of 375.
self.bannerView.adSize = GADCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(375);
ViewController.m

بارگذاری یک تبلیغ

پس از اینکه GADBannerView در جای خود قرار گرفت و ویژگی‌های آن، مانند adUnitID ، پیکربندی شدند، زمان بارگذاری یک تبلیغ فرا می‌رسد. این کار با فراخوانی loadRequest: روی یک شیء GADRequest انجام می‌شود:

سویفت 

bannerView.load(Request())
ViewController.swift

سویفت‌یو‌آی 

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

هدف-سی 

[self.bannerView loadRequest:[GADRequest request]];
ViewController.m

اشیاء GADRequest یک درخواست تبلیغ واحد را نشان می‌دهند و حاوی ویژگی‌هایی برای مواردی مانند اطلاعات هدف‌گیری هستند.

تازه کردن یک آگهی

اگر واحد تبلیغاتی خود را برای به‌روزرسانی پیکربندی کرده‌اید، در صورت عدم بارگذاری تبلیغ، نیازی به درخواست تبلیغ دیگری ندارید. SDK تبلیغات موبایل گوگل هر نرخ به‌روزرسانی را که در رابط کاربری AdMob مشخص کرده‌اید، در نظر می‌گیرد. اگر به‌روزرسانی را فعال نکرده‌اید، یک درخواست جدید ارسال کنید. برای جزئیات بیشتر در مورد به‌روزرسانی واحد تبلیغاتی، مانند تنظیم نرخ به‌روزرسانی، به بخش «استفاده از به‌روزرسانی خودکار برای تبلیغات بنری» مراجعه کنید.

مدیریت تغییرات جهت گیری

وقتی جهت صفحه نمایش برنامه شما تغییر می‌کند، مثلاً از حالت portrait به افقی، عرض موجود برای بنر نیز اغلب تغییر می‌کند. برای اطمینان از اینکه تبلیغی با اندازه مناسب برای طرح جدید نمایش می‌دهید، درخواست یک بنر جدید کنید. اگر عرض بنر شما ثابت است، یا اگر محدودیت‌های طرح شما می‌تواند تغییر اندازه را تحمل کند، از این مرحله صرف نظر کنید.

سویفت 

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

هدف-سی 

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

رویدادهای تبلیغاتی

با استفاده از GADBannerViewDelegate ، می‌توانید به رویدادهای چرخه عمر، مانند زمانی که یک تبلیغ بسته می‌شود یا کاربر برنامه را ترک می‌کند، گوش دهید.

برای رویدادهای بنری ثبت نام کنید

برای ثبت رویدادهای تبلیغات بنری، ویژگی delegate را در GADBannerView روی شیء‌ای که پروتکل GADBannerViewDelegate را پیاده‌سازی می‌کند، تنظیم کنید. به‌طورکلی، کلاسی که تبلیغات بنری را پیاده‌سازی می‌کند، به‌عنوان کلاس delegate نیز عمل می‌کند، در این صورت، ویژگی delegate را می‌توان روی self تنظیم کرد.

سویفت 

bannerView.delegate = self
ViewController.swift

سویفت‌یو‌آی 

banner.delegate = context.coordinator
BannerContentView.swift

هدف-سی 

self.bannerView.delegate = self;
ViewController.m

رویدادهای بنری را پیاده‌سازی کنید

هر یک از متدهای موجود در GADBannerViewDelegate به عنوان اختیاری علامت گذاری شده اند، بنابراین شما فقط باید متدهایی را که می خواهید پیاده سازی کنید. این مثال هر متد را پیاده سازی کرده و پیامی را در کنسول ثبت می کند:

سویفت 

func bannerViewDidReceiveAd(_ bannerView: BannerView) {
  print(#function)
}

func bannerView(_ bannerView: BannerView, didFailToReceiveAdWithError error: Error) {
  print(#function + ": " + error.localizedDescription)
}

func bannerViewDidRecordClick(_ bannerView: BannerView) {
  print(#function)
}

func bannerViewDidRecordImpression(_ bannerView: BannerView) {
  print(#function)
}

func bannerViewWillPresentScreen(_ bannerView: BannerView) {
  print(#function)
}

func bannerViewWillDismissScreen(_ bannerView: BannerView) {
  print(#function)
}

func bannerViewDidDismissScreen(_ bannerView: BannerView) {
  print(#function)
}
ViewController.swift

هدف-سی 

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

برای پیاده‌سازی متدهای نماینده بنر در برنامه iOS API Demo، به مثال نماینده تبلیغات مراجعه کنید.

سوئیفت آبجکتیو-سی

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

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

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

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

سویفت 

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

هدف-سی 

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

متحرک سازی یک بنر تبلیغاتی

همچنین می‌توانید از رویداد bannerViewDidReceiveAd: برای متحرک‌سازی یک بنر تبلیغاتی پس از دریافت آن استفاده کنید، همانطور که در مثال زیر نشان داده شده است:

سویفت 

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

هدف-سی 

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

مکث و از سرگیری برنامه

پروتکل GADBannerViewDelegate متدهایی برای اطلاع‌رسانی به شما در مورد رویدادها دارد، مانند زمانی که یک کلیک باعث نمایش یا رد یک overlay می‌شود. اگر می‌خواهید ردیابی کنید که آیا این رویدادها به دلیل تبلیغات بوده‌اند یا خیر، برای این متدهای GADBannerViewDelegate ثبت‌نام کنید.

برای دریافت انواع نمایش‌های روی هم افتاده یا فراخوانی‌های مرورگر خارجی، نه فقط آن‌هایی که از کلیک‌های تبلیغاتی می‌آیند، بهتر است برنامه شما به دنبال متدهای معادل در UIViewController یا UIApplication باشد. در اینجا جدولی وجود دارد که متدهای معادل iOS را که همزمان با متدهای GADBannerViewDelegate فراخوانی می‌شوند، نشان می‌دهد:

متد GADBannerViewDelegate روش iOS
bannerViewWillPresentScreen: viewWillDisappear:
bannerViewWillDismissScreen: viewWillAppear:
bannerViewDidDismissScreen: viewDidAppear:

منابع اضافی

مثال‌ها در گیت‌هاب

مراحل بعدی

بنرهای تاشو

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

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

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

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