बैनर विज्ञापन

बैनर विज्ञापन, ऐप्लिकेशन के लेआउट में डिवाइस की स्क्रीन पर ऊपर या नीचे एक जगह ले लेते हैं. जब उपयोगकर्ता ऐप्लिकेशन पर इंटरैक्ट करते हैं, तब वे स्क्रीन पर बने रहते हैं और एक तय समय के बाद अपने-आप रीफ़्रेश हो जाते हैं. अगर आपको मोबाइल पर विज्ञापन दिखाना अभी-अभी शुरू नहीं हुआ है, तो शुरुआत करने के लिए यह सबसे सही जगह है. केस स्टडी.

इस गाइड में, बैनर विज्ञापनों कोAdMob से iOS ऐप्लिकेशन में इंटिग्रेट करने का तरीका बताया गया है. कोड स्निपेट और निर्देशों के अलावा, इसमें बैनर का साइज़ सही तरीके से बदलने के बारे में जानकारी भी दी गई है. साथ ही, यह अन्य संसाधनों के लिंक के बारे में भी जानकारी देती है.

ज़रूरी शर्तें

हमेशा टेस्ट विज्ञापनों से टेस्ट करें

अपने ऐप्लिकेशन बनाते और उनकी टेस्टिंग करते समय, पक्का करें कि आप लाइव, प्रोडक्शन विज्ञापनों के बजाय टेस्ट विज्ञापनों का इस्तेमाल करें. ऐसा न करने पर आपका खाता निलंबित किया जा सकता है.

टेस्ट विज्ञापनों को लोड करने का सबसे आसान तरीका, iOS बैनर के लिए बने हमारे टेस्ट विज्ञापन यूनिट आईडी का इस्तेमाल करना है: ca-app-pub-3940256099942544/2934735716

इसे हर अनुरोध पर टेस्ट विज्ञापन दिखाने के लिए खास तौर पर कॉन्फ़िगर किया गया है. साथ ही, कोडिंग, टेस्टिंग, और डीबग करने के दौरान, इसे अपने ऐप्लिकेशन में इस्तेमाल किया जा सकता है. बस यह पक्का कर लें कि अपना ऐप्लिकेशन पब्लिश करने से पहले, आपने इसे अपनी विज्ञापन यूनिट के आईडी से बदल दिया हो.

मोबाइल विज्ञापन SDK के टेस्ट विज्ञापन कैसे काम करते हैं, इस बारे में ज़्यादा जानकारी के लिए विज्ञापनों की जांच करना लेख पढ़ें.

GADBannerViewबनाएं

बैनर विज्ञापन GADBannerView ऑब्जेक्ट में दिखाए जाते हैं. इसलिए, बैनर विज्ञापनों को इंटिग्रेट करने के लिए सबसे पहले, अपने व्यू हैरारकी में GADBannerView को शामिल करें. आम तौर पर, ऐसा या तो इंटरफ़ेस बिल्डर की मदद से या प्रोग्राम के हिसाब से किया जाता है.

इंटरफ़ेस बिल्डर

GADBannerView को किसी भी सामान्य व्यू की तरह ही, स्टोरीबोर्ड या xib फ़ाइल में जोड़ा जा सकता है. इस तरीके का इस्तेमाल करते समय, विज्ञापन के साइज़ को अपने हिसाब से दिखाने के लिए चौड़ाई और ऊंचाई के प्रतिबंध ज़रूर जोड़ें. उदाहरण के लिए, बैनर (320x50) दिखाते समय, 320 पॉइंट की चौड़ाई की सीमा और 50 पॉइंट की ऊंचाई की सीमा इस्तेमाल करें.

प्रोग्राम के हिसाब से

GADBannerView को सीधे भी इंस्टैंशिएट किया जा सकता है. 320x50 के बैनर के साइज़ के साथ, स्क्रीन के सुरक्षित हिस्से के नीचे बीच में अलाइन किए गए GADBannerView को बनाने का तरीका यहां दिया गया है:

Swift

import GoogleMobileAds
import UIKit

class ViewController: UIViewController {

  var bannerView: GADBannerView!

  override func viewDidLoad() {
    super.viewDidLoad()
    
    // In this case, we instantiate the banner with desired ad size.
    bannerView = GADBannerView(adSize: GADAdSizeBanner)

    addBannerViewToView(bannerView)
  }

  func addBannerViewToView(_ bannerView: GADBannerView) {
    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) GADBannerView *bannerView;

@end

@implementation ViewController

- (void)viewDidLoad {
  [super viewDidLoad];
  
  // In this case, we instantiate the banner with desired ad size.
  self.bannerView = [[GADBannerView alloc]
      initWithAdSize:GADAdSizeBanner];

  [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

ध्यान दें कि इस मामले में हम चौड़ाई या ऊंचाई की सीमा का इस्तेमाल नहीं करते, क्योंकि विज्ञापन का साइज़ तय करने से बैनर, कॉन्टेंट के साइज़ के हिसाब से दिखेगा.

अगर आपको किसी कॉन्स्टेंट के आधार पर तय किए गए स्टैंडर्ड साइज़ का इस्तेमाल नहीं करना है, तो GADAdSizeFromCGSize का इस्तेमाल करके पसंद के मुताबिक साइज़ सेट करें. ज़्यादा जानकारी के लिए, बैनर के साइज़ का सेक्शन देखें.

प्रॉपर्टी GADBannerView कॉन्फ़िगर करें

विज्ञापनों को लोड करने और दिखाने के लिए, GADBannerView को कुछ प्रॉपर्टी सेट करनी होंगी.

  • rootViewController - इस व्यू कंट्रोलर का इस्तेमाल, विज्ञापन को क्लिक किए जाने पर ओवरले प्रज़ेंट करने के लिए किया जाता है. आम तौर पर, इसे उस व्यू कंट्रोलर पर सेट किया जाना चाहिए जिसमें GADBannerView होता है.
  • adUnitID - यह वह विज्ञापन यूनिट आईडी है जिससे GADBannerView विज्ञापन लोड करना चाहिए.

यहां दिए गए कोड के उदाहरण में, यूज़र इंटरफ़ेस (यूआई) कंट्रोलर के viewDidLoad तरीके में, दो ज़रूरी प्रॉपर्टी को सेट करने का तरीका बताया गया है:

Swift

override func viewDidLoad() {
  super.viewDidLoad()
  ...

  bannerView.adUnitID = "ca-app-pub-3940256099942544/2934735716"
  bannerView.rootViewController = self
}

Objective-C

- (void)viewDidLoad {
  [super viewDidLoad];
  ...

  self.bannerView.adUnitID = @"ca-app-pub-3940256099942544/2934735716";
  self.bannerView.rootViewController = self;
}

विज्ञापन लोड करें

GADBannerView की जगह तय करने और उसकी प्रॉपर्टी कॉन्फ़िगर करने के बाद, विज्ञापन लोड किया जा सकता है. ऐसा करने के लिए, loadRequest: को GADRequest ऑब्जेक्ट पर कॉल किया जाता है:

Swift

override func viewDidLoad() {
  super.viewDidLoad()
  ...

  bannerView.adUnitID = "ca-app-pub-3940256099942544/2934735716"
  bannerView.rootViewController = self
  bannerView.load(GADRequest())
}

Objective-C

- (void)viewDidLoad {
  [super viewDidLoad];
  ...

  self.bannerView.adUnitID = @"ca-app-pub-3940256099942544/2934735716";
  self.bannerView.rootViewController = self;
  [self.bannerView loadRequest:[GADRequest request]];
}

GADRequest ऑब्जेक्ट एक ही विज्ञापन अनुरोध दिखाते हैं और इनमें टारगेटिंग की जानकारी जैसी चीज़ों के लिए प्रॉपर्टी होती हैं.

अगर आपका विज्ञापन लोड नहीं हो पाता है, तो आपको दूसरे विज्ञापन का अनुरोध करने की ज़रूरत नहीं है, बशर्ते आपने विज्ञापन यूनिट को रीफ़्रेश करने के लिए कॉन्फ़िगर किया हो. Google Mobile Ads SDK,AdMob यूज़र इंटरफ़ेस में आपकी तय की गई रीफ़्रेश दर का पालन करता है. अगर आपने रीफ़्रेश करने की सुविधा को चालू नहीं किया है, तो आपको एक नया अनुरोध जारी करना होगा.

विज्ञापन इवेंट

GADBannerViewDelegate का इस्तेमाल करके, लाइफ़साइकल इवेंट की जानकारी देखी जा सकती है. जैसे, जब कोई विज्ञापन बंद हो या उपयोगकर्ता ऐप्लिकेशन से बाहर निकल गया हो.

बैनर इवेंट के लिए रजिस्टर करना

बैनर विज्ञापन इवेंट के लिए रजिस्टर करने के लिए, GADBannerView पर delegate प्रॉपर्टी को किसी ऐसे ऑब्जेक्ट पर सेट करें जो GADBannerViewDelegate प्रोटोकॉल लागू करता हो. आम तौर पर, बैनर विज्ञापन लागू करने वाली क्लास, डेलिगेट क्लास के तौर पर भी काम करती है. इस मामले में, delegate प्रॉपर्टी को self पर सेट किया जा सकता है.

Swift

import GoogleMobileAds
import UIKit

class ViewController: UIViewController, GADBannerViewDelegate {

  var bannerView: GADBannerView!

  override func viewDidLoad() {
    super.viewDidLoad()
    ...
    bannerView.delegate = self
  }
}

Objective-C

@import GoogleMobileAds;

@interface ViewController () <GADBannerViewDelegate>

@property(nonatomic, strong) GADBannerView *bannerView;

@end

@implementation ViewController

- (void)viewDidLoad {
  [super viewDidLoad];
  ...
  self.bannerView.delegate = self;
}

बैनर इवेंट लागू करना

GADBannerViewDelegate में दिए गए हर तरीके को 'ज़रूरी नहीं' के तौर पर मार्क किया गया है. इसलिए, आपको सिर्फ़ अपनी पसंद के तरीके लागू करने होंगे. इस उदाहरण में, हर तरीके को लागू किया गया है और कंसोल में मैसेज लॉग किया गया है:

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

iOS API डेमो ऐप्लिकेशन में बैनर डेलिगेट तरीकों को लागू करने के बारे में जानने के लिए, 'विज्ञापन डेलिगेट' का उदाहरण देखें.

स्विफ़्ट मकसद-सी

इस्तेमाल के उदाहरण

यहां विज्ञापन इवेंट के इन तरीकों के इस्तेमाल के कुछ उदाहरण दिए गए हैं.

विज्ञापन मिलने के बाद, व्यू की हैरारकी में बैनर जोड़ना

हो सकता है कि कोई विज्ञापन मिलने के बाद ही, आप व्यू हैरारकी में GADBannerView को जोड़ना चाहें. ऐसा करने के लिए, bannerViewDidReceiveAd: इवेंट को सुनें:

Swift

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

Objective-C

- (void)bannerViewDidReceiveAd:(GADBannerView *)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:(GADBannerView *)bannerView {
  bannerView.alpha = 0;
  [UIView animateWithDuration:1.0 animations:^{
    bannerView.alpha = 1;
  }];
}

ऐप्लिकेशन को रोकना और फिर से शुरू करना

GADBannerViewDelegate प्रोटोकॉल में आपको इवेंट की सूचना देने के तरीके मौजूद हैं. जैसे, किसी क्लिक की वजह से ओवरले दिखाना या उसे खारिज करना. अगर आपको यह पता लगाना है कि ये इवेंट विज्ञापनों की वजह से हुए थे या नहीं, तो इन GADBannerViewDelegate तरीकों को रजिस्टर करें.

विज्ञापन पर क्लिक करने से ही नहीं बल्कि सभी तरह के ओवरले प्रज़ेंटेशन या बाहरी ब्राउज़र पर आने वाले कॉल को समझने के लिए, आपके ऐप्लिकेशन में UIViewController या UIApplication पर इसी तरह के तरीकों का इस्तेमाल करना बेहतर होगा. यहां एक टेबल दी गई है. इसमें iOS के एक जैसे तरीके दिखाए गए हैं, जिन्हें एक ही समय पर GADBannerViewDelegate तरीकों से शुरू किया गया है:

GADBannerViewDelegate का तरीका iOS का तरीका
bannerViewWillPresentScreen: UIViewController का viewWillDisappear:
bannerViewWillDismissScreen: UIViewController का viewWillAppear:
bannerViewDidDismissScreen: UIViewController का viewDidAppear:

नीचे दी गई टेबल में, बैनर के स्टैंडर्ड साइज़ दिए गए हैं.

पॉइंट में साइज़ (WxH) ब्यौरा उपलब्धता AdSize कॉन्स्टेंट
320x50 बैनर फ़ोन और टैबलेट GADAdSizeBanner
320x100 बड़ा बैनर फ़ोन और टैबलेट GADAdSizeLargeBanner
300x250 IAB मीडियम रेक्टैंगल फ़ोन और टैबलेट GADAdSizeMediumRectangle
468x60 IAB का फ़ुल साइज़ बैनर टैबलेट GADAdSizeFullBanner
728x90 IAB लीडरबोर्ड टैबलेट GADAdSizeLeaderboard
बताई गई चौड़ाई x ज़रूरत के हिसाब से ऊंचाई अडैप्टिव बैनर फ़ोन और टेबलेट लागू नहीं

कस्टम विज्ञापन आकार

पसंद के मुताबिक बैनर का साइज़ तय करने के लिए, GADAdSizeFromCGSize का इस्तेमाल करके अपनी पसंद का साइज़ सेट करें, जैसा कि यहां दिखाया गया है:

Swift

let adSize = GADAdSizeFromCGSize(CGSize(width: 300, height: 50))

Objective-C

GADAdSize size = GADAdSizeFromCGSize(CGSizeMake(300, 50));

अन्य संसाधन

GitHub पर उदाहरण

  • बैनर विज्ञापनों का उदाहरण: Swift | Objective-C

  • बेहतर सुविधाओं का डेमो: Swift | Objective-C

  • GitHub पर बैनर UITableView का उदाहरण: Swift | Objective-C

मोबाइल विज्ञापन गैराज के वीडियो ट्यूटोरियल

सफलता की कहानियां

अगले चरण

उपयोगकर्ता की निजता के बारे में ज़्यादा जानें.