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

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

इस गाइड में, Unity ऐप्लिकेशन में बैनर व्यू को इंटिग्रेट करने का तरीका बताया गया है. इसके अलावा स्निपेट और निर्देशों को कोड करने के लिए किया जाता है, तो इसमें साइज़ सही बैनर और अतिरिक्त संसाधनों के लिंक शामिल होते हैं.

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

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

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

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

/21775744923/example/adaptive-banner

Mobile Ads SDK को शुरू करना

विज्ञापन लोड करने से पहले, कॉल करके अपने ऐप्लिकेशन को Mobile Ads SDK शुरू करने के लिए कहें MobileAds.Initialize(). इसे सिर्फ़ एक बार करना होगा. आम तौर पर, ऐप्लिकेशन लॉन्च करते समय ऐसा करना चाहिए.

using GoogleMobileAds;
using GoogleMobileAds.Api;

public class GoogleMobileAdsDemoScript : MonoBehaviour
{
    public void Start()
    {
        // Initialize the Google Mobile Ads SDK.
        MobileAds.Initialize((InitializationStatus initStatus) =>
        {
            // This callback is called once the MobileAds SDK is initialized.
        });
    }
}

अगर मीडिएशन का इस्तेमाल किया जा रहा है, तो विज्ञापनों को इस तौर पर लोड करने से पहले कॉलबैक होने तक इंतज़ार करें इससे यह पक्का होगा कि सभी मीडिएशन अडैप्टर शुरू हो गए हैं.

BannerView का उदाहरण

नीचे दिए गए सैंपल कोड में, बैनर व्यू को इस्तेमाल करने का तरीका बताया गया है. उदाहरण में, आपने बैनर व्यू का एक इंस्टेंस बनाया है. साथ ही, बैनर व्यू में विज्ञापन लोड करने के लिए AdManagerAdRequest का इस्तेमाल किया है. इसके बाद, लाइफ़साइकल इवेंट को मैनेज करके, इसकी सुविधाओं को बढ़ाया है.

बैनर व्यू बनाना

बैनर व्यू को इस्तेमाल करने का पहला चरण है, बैनर व्यू का इंस्टेंस बनाना GameObject से अटैच की गई C# स्क्रिप्ट में.


  // This ad unit is configured to always serve test ads.
  private string _adUnitId = "/21775744923/example/adaptive-banner";

  AdManagerBannerView _bannerView;

  /// <summary>
  /// Creates a 320x50 banner view at top of the screen.
  /// </summary>
  public void CreateBannerView()
  {
      Debug.Log("Creating banner view");

      // If we already have a banner, destroy the old one.
      if (_bannerView != null)
      {
          DestroyAd();
      }

      // Create a 320x50 banner at top of the screen
      _bannerView = new AdManagerBannerView(_adUnitId, AdSize.Banner, AdPosition.Top);
  }

AdManagerBannerView के कंस्ट्रक्टर में ये चीज़ें शामिल हैं पैरामीटर:

  • adUnitId: वह विज्ञापन यूनिट आईडी जिससे AdManagerBannerView पर विज्ञापन लोड होने चाहिए.
  • AdSize: विज्ञापन का वह साइज़, जिसका आपको इस्तेमाल करना है. बैनर के साइज़ देखें देखें.
  • AdPosition: वह पोज़ीशन जहां बैनर व्यू डाले जाने चाहिए. AdPosition एनम में, विज्ञापन की रैंक की मान्य वैल्यू की सूची होती है.

ध्यान दें कि अलग-अलग प्लैटफ़ॉर्म के हिसाब से, अलग-अलग विज्ञापन यूनिट का इस्तेमाल कैसे किया जाता है. iOS पर विज्ञापन अनुरोध करने के लिए, आपको iOS विज्ञापन यूनिट का इस्तेमाल करना होगा. वहीं, Android पर अनुरोध करने के लिए, आपको Android विज्ञापन यूनिट का इस्तेमाल करना होगा.

(ज़रूरी नहीं) कस्टम पोज़िशन के साथ बैनर व्यू बनाना

AdPosition वैल्यू की तुलना में, स्क्रीन पर AdManagerBannerView को बेहतर तरीके से प्लेस करने के लिए, उस कॉन्स्ट्रक्टर का इस्तेमाल करें जिसमें पैरामीटर के तौर पर x- और y-कोऑर्डिनेट हों:

// Create a 320x50 banner views at coordinate (0,50) on screen.
_bannerView = new AdManagerBannerView(_adUnitId, AdSize.Banner, 0, 50);

AdManagerBannerView के सबसे ऊपर बाएं कोने को, कॉन्स्ट्रक्टर में दी गई x और y वैल्यू पर रखा गया है. यहां ऑरिजिन, स्क्रीन के सबसे ऊपर बाईं ओर होता है.

(ज़रूरी नहीं) कस्टम साइज़ वाला बैनर व्यू बनाना

AdSize कॉन्स्टेंट का इस्तेमाल करने के अलावा, अपने हिसाब से साइज़ भी तय किया जा सकता है आपके विज्ञापन के लिए:

// Use the AdSize argument to set a custom size for the ad.
AdSize adSize = new AdSize(250, 250);
_bannerView = new AdManagerBannerView(_adUnitId, adSize, AdPosition.Bottom);

(वैकल्पिक) कई विज्ञापन आकार

Ad Manager की मदद से, विज्ञापन के ऐसे कई साइज़ तय किए जा सकते हैं जिन्हें दिखाया जा सकता है AdManagerBannerView में. SDK में यह सुविधा लागू करने से पहले, बनाएं अलग-अलग साइज़ के क्रिएटिव से जुड़ी एक ही विज्ञापन यूनिट को टारगेट करने वाला लाइन आइटम.

अपने ऐप्लिकेशन में, ValidAdSizes में कई AdSize पैरामीटर पास करें:

var adView = new AdManagerBannerView(_adUnitId, AdSize.Banner, AdPosition.Top);
adView.ValidAdSizes = new List<AdSize>
{
    AdSize.Banner, new AdSize(120, 20), new AdSize(250, 250),
};

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

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

AdManagerBannerView तय होने के बाद, लोड करना शुरू करें AdManagerBannerView में LoadAd() तरीके का इस्तेमाल करने वाला विज्ञापन क्लास. इसमें, पैरामीटर की ज़रूरत होती है, जिस पर रनटाइम की जानकारी, जैसे कि टारगेटिंग की जानकारी, एक्सक्लूज़न लेबल, और पब्लिशर आईडी दी गई है.

/// <summary>
/// Creates the banner view and loads a banner ad.
/// </summary>
public void LoadAd()
{
    // create an instance of a banner view first.
    if(_bannerView == null)
    {
        CreateAdManagerBannerView();
    }

    // create our request used to load the ad.
    var adRequest = new AdManagerAdRequest();

    // send the request to load the ad.
    Debug.Log("Loading banner ad.");
    _bannerView.LoadAd(adRequest);
}

बैनर व्यू इवेंट सुनना

अपने विज्ञापन के व्यवहार को पसंद के मुताबिक बनाने के लिए, कई इवेंट जोड़े जा सकते हैं विज्ञापन का लाइफ़साइकल, जैसे कि लोड करना, खोलना या बंद करना. इन्हें सुनने के लिए इवेंट, प्रतिनिधि के तौर पर रजिस्टर करने के लिए:

/// <summary>
/// listen to events the banner view may raise.
/// </summary>
private void ListenToAdEvents()
{
    // Raised when an ad is loaded into the banner view.
    _bannerView.OnBannerAdLoaded += () =>
    {
        Debug.Log("Banner view loaded an ad with response : "
            + _bannerView.GetResponseInfo());
    };
    // Raised when an ad fails to load into the banner view.
    _bannerView.OnBannerAdLoadFailed += (LoadAdError error) =>
    {
        Debug.LogError("Banner view failed to load an ad with error : "
            + error);
    };
    // Raised when the ad is estimated to have earned money.
    _bannerView.OnAdPaid += (AdValue adValue) =>
    {
        Debug.Log(String.Format("Banner view paid {0} {1}.",
            adValue.Value,
            adValue.CurrencyCode));
    };
    // Raised when an impression is recorded for an ad.
    _bannerView.OnAdImpressionRecorded += () =>
    {
        Debug.Log("Banner view recorded an impression.");
    };
    // Raised when a click is recorded for an ad.
    _bannerView.OnAdClicked += () =>
    {
        Debug.Log("Banner view was clicked.");
    };
    // Raised when an ad opened full screen content.
    _bannerView.OnAdFullScreenContentOpened += () =>
    {
        Debug.Log("Banner view full screen content opened.");
    };
    // Raised when the ad closed full screen content.
    _bannerView.OnAdFullScreenContentClosed += () =>
    {
        Debug.Log("Banner view full screen content closed.");
    };
}

बैनर व्यू मिटाएं

बैनर व्यू का इस्तेमाल करने के बाद, Destroy() को कॉल करके रिलीज़ करना न भूलें संसाधन.

/// <summary>
/// Destroys the banner view.
/// </summary>
public void DestroyAd()
{
    if (_bannerView != null)
    {
        Debug.Log("Destroying banner view.");
        _bannerView.Destroy();
        _bannerView = null;
    }
}

हो गया! अब आपका ऐप्लिकेशन, बैनर विज्ञापन दिखाने के लिए तैयार है.

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

dp में साइज़ (WxH) ब्यौरा उपलब्धता AdSize कॉन्सटेंट
320x50 स्टैंडर्ड बैनर फ़ोन और टेबलेट BANNER
320x100 बड़ा बैनर फ़ोन और टेबलेट LARGE_BANNER
300x250 IAB मीडियम रेक्टैंगल फ़ोन और टेबलेट MEDIUM_RECTANGLE
468x60 IAB के फ़ुल-साइज़ बैनर टैबलेट FULL_BANNER
728x90 IAB लीडरबोर्ड टैबलेट LEADERBOARD
दी गई चौड़ाई x ज़रूरत के हिसाब से ऊंचाई अडैप्टिव बैनर फ़ोन और टेबलेट लागू नहीं
स्क्रीन की चौड़ाई x 32|50|90 स्मार्ट बैनर फ़ोन और टेबलेट SMART_BANNER
अडैप्टिव बैनर के बारे में ज़्यादा जानें. जिसे Smart Banners की जगह इस्तेमाल किया जा सकता है.

ऐप्लिकेशन इवेंट

ऐप्लिकेशन इवेंट की मदद से, ऐसे विज्ञापन बनाए जा सकते हैं जिनसे उनके ऐप्लिकेशन कोड पर मैसेज भेजा जा सकता है. ऐप्लिकेशन तो इन मैसेज के आधार पर कार्रवाइयां की जा सकती हैं.

AppEvent का इस्तेमाल करके, Ad Manager के खास ऐप्लिकेशन इवेंट को सुना जा सकता है. ये इवेंट, विज्ञापन के लाइफ़साइकल के दौरान कभी भी हो सकते हैं. भले ही, लोड होने से पहले ही ऐसा हो.

namespace GoogleMobileAds.Api.AdManager;

/// The App event message sent from the ad.
public class AppEvent
{
    // Name of the app event.
    string Name;
    // Argument passed from the app event.
    string Value;
}

किसी विज्ञापन में ऐप्लिकेशन इवेंट होने पर, OnAppEventReceived बढ़ जाता है. यहाँ है अपने कोड में इस इवेंट को मैनेज करने के तरीके का उदाहरण:

_bannerview.OnAppEventReceived += (AppEvent args) =>
{
    Debug.Log($"Received app event from the ad: {args.Name}, {args.Value}.");
};

यहां एक उदाहरण दिया गया है, जिसमें आपके ऐप्लिकेशन के बैकग्राउंड का रंग बदलने का तरीका बताया गया है रंग के नाम वाले ऐप्लिकेशन इवेंट के आधार पर:

_bannerview.OnAppEventReceived += (AppEvent args) =>
{
  if (args.Name == "color")
  {
    Color color;
    if (ColorUtility.TryParseColor(arg.Value, out color))
    {
      gameObject.GetComponent<Renderer>().material.color = color;
    }
  }
};

यहां उस क्रिएटिव का उदाहरण दिया गया है जो कलर ऐप्लिकेशन इवेंट भेजता है:

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

अन्य संसाधन

  • HeyWorld का उदाहरण: सभी विज्ञापन फ़ॉर्मैट को कम से कम तरीके से लागू करना चाहिए.