अडैप्टिव बैनर, रिस्पॉन्सिव (स्क्रीन के हिसाब से आकार बदलने वाले) विज्ञापनों की अगली पीढ़ी हैं. ये हर डिवाइस के लिए विज्ञापन के साइज़ को ऑप्टिमाइज़ करके, परफ़ॉर्मेंस को बेहतर बनाते हैं. अडैप्टिव बैनर की मदद से, विज्ञापनों की चौड़ाई तय की जा सकती है और विज्ञापन के लिए सबसे सही साइज़ तय करने के लिए, इन बैनर का इस्तेमाल किया जा सकता है. इन बैनर में सिर्फ़ तय ऊंचाई के हिसाब से बैनर का इस्तेमाल किया जा सकता है.
सबसे अच्छे विज्ञापन साइज़ को चुनने के लिए, अडैप्टिव बैनर तय ऊंचाई के बजाय, तय किए गए आसपेक्ट रेशियो का इस्तेमाल करते हैं. इससे ऐसे बैनर विज्ञापन बन जाते हैं जो सभी डिवाइस की स्क्रीन पर एक जैसे हिस्से में दिखते हैं और बेहतर परफ़ॉर्मेंस के अवसर देते हैं.
ध्यान रखें कि अडैप्टिव बैनर के साथ काम करते समय, ये हमेशा किसी दिए गए डिवाइस और चौड़ाई के लिए, एक जैसा साइज़ दिखाएंगे. किसी डिवाइस पर अपने लेआउट की जांच कर लेने पर, आप यह पक्का कर सकते हैं कि विज्ञापन का साइज़ नहीं बदलेगा. हालांकि, बैनर क्रिएटिव का साइज़ अलग-अलग डिवाइस पर बदल सकता है. नतीजतन, हम सुझाव देते हैं कि आपके लेआउट को विज्ञापन की ऊंचाई में अलग-अलग होना चाहिए. बहुत कम मामलों में, ऐसा हो सकता है कि अडैप्टिव बैनर का पूरा साइज़ न भरा जाए. इसके बजाय, स्टैंडर्ड साइज़ वाले क्रिएटिव को इस स्लॉट में सेंटर में रखा जाएगा.
ज़रूरी बातें
- मोबाइल विज्ञापन यूनिट प्लग इन को इंपोर्ट करने और मोबाइल विज्ञापन SDK टूल शामिल करने के तरीके के बारे में शुरू करने के लिए गाइड के निर्देशों का पालन करें.
अडैप्टिव बैनर इस्तेमाल करने का समय
अडैप्टिव बैनर को इस तरह डिज़ाइन किया गया है कि यह, इंडस्ट्री स्टैंडर्ड 320x50 बैनर साइज़ और स्मार्ट बैनर फ़ॉर्मैट, दोनों के लिए आसान हो जाए.
आम तौर पर, बैनर साइज़ का इस्तेमाल ऐंकर बैनर के तौर पर किया जाता है. आम तौर पर, इनका इस्तेमाल स्क्रीन के सबसे ऊपर या सबसे नीचे किया जाता है.
ऐसे ऐंकर बैनर के लिए, अडैप्टिव बैनर का इस्तेमाल करने का आसपेक्ट रेशियो (चौड़ाई-ऊंचाई का अनुपात), 320x50 साइज़ के स्टैंडर्ड विज्ञापन से मिलता-जुलता होगा. जैसा कि नीचे दिए गए तीन उदाहरणों में देखा गया है:
![]() 320x50 बैनर |
![]() अडैप्टिव बैनर |
![]() स्मार्ट बैनर |
अडैप्टिव बैनर, मौजूद स्क्रीन साइज़ को बेहतर तरीके से इस्तेमाल करता है. इसके अलावा, स्मार्ट बैनर की तुलना में, अडैप्टिव बैनर एक बेहतर विकल्प है, क्योंकि:
यह चौड़ाई को फ़ुल-स्क्रीन में बदलने के बजाय, आपकी दी गई किसी भी चौड़ाई का इस्तेमाल करता है. इससे, आपको Android पर सुरक्षित इलाके को ध्यान में रखते हुए और Android पर डिसप्ले कटआउट दिखाने में मदद मिलती है.
यह अलग-अलग साइज़ के डिवाइस में एक जैसी ऊंचाई रखने के बजाय, उस खास डिवाइस के लिए सबसे अच्छी ऊंचाई चुनता है, जिससे डिवाइस फ़्रैगमेंटेशन का असर कम होता है.
लागू करने के बारे में नोट
अपने ऐप्लिकेशन में अडैप्टिव बैनर लागू करते समय इन बातों का ध्यान रखें:
- आपको उस व्यू की चौड़ाई पता होनी चाहिए जिस पर विज्ञापन डाला जाना चाहिए. साथ ही, इसमें डिवाइस की चौड़ाई और लागू होने वाले किसी भी सुरक्षित इलाके या कटआउट को ध्यान में रखा जाना चाहिए.
- यह पक्का करें कि जब विज्ञापन स्लॉट छोटे विज्ञापन साइज़ के साथ न दिखें, तो आपका विज्ञापन बैकग्राउंड, AdMob की नीतियों के मुताबिक न हो.
- पक्का करें कि आप Google मोबाइल विज्ञापन यूनिट प्लग इन के सबसे नए वर्शन का इस्तेमाल कर रहे हैं. मीडिएशन के लिए, हर मीडिएशन अडैप्टर के सबसे नए वर्शन का इस्तेमाल करें.
- अडैप्टिव बैनर के साइज़ इस तरह से डिज़ाइन किए जाते हैं, ताकि वे पूरी चौड़ाई में उपलब्ध हों. ज़्यादातर मामलों में, यह इस्तेमाल किए जा रहे डिवाइस की स्क्रीन की पूरी चौड़ाई होगी. लागू होने वाली सुरक्षित जगहों को ध्यान में रखें.
- Google मोबाइल विज्ञापन SDK, अडैप्टिव विज्ञापन साइज़ एपीआई का इस्तेमाल करते समय, दी गई चौड़ाई के लिए ऑप्टिमाइज़ किए गए विज्ञापन की ऊंचाई वाले बैनर को साइज़ देगा.
- अडैप्टिव विज्ञापनों के लिए विज्ञापन का साइज़ तीन तरीकों से बदला जा सकता है:
लैंडस्केप के लिए
AdSize.GetLandscapeAnchoredAdaptiveBannerAdSizeWithWidth
, पोर्ट्रेट के लिएAdSize.GetPortraitAnchoredAdaptiveBannerAdSizeWithWidth
, और कार्रवाई के समय मौजूदा ओरिएंटेशन के लिएAdSize.GetCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth
. - किसी डिवाइस पर दी गई चौड़ाई के लिए दिया गया साइज़ हमेशा एक जैसा रहेगा. इसलिए, जब आप किसी डिवाइस पर अपने लेआउट की जांच कर लें, तो आप भरोसा कर सकते हैं कि विज्ञापन का साइज़ नहीं बदलेगा.
- ऐंकर बैनर की ऊंचाई कभी भी 15% से कम डिवाइस की ऊंचाई या 90 डेंसिटी इंडिपेंडेंट पिक्सल से कम या 50 डेंसिटी इंडिपेंडेंट पिक्सल से कम नहीं होती है.
- पूरी चौड़ाई वाले बैनर के लिए, आप कोई खास चौड़ाई देने के बजाय
AdSize.FullWidth
फ़्लैग का इस्तेमाल कर सकते हैं.
क्विकस्टार्ट
एक साधारण अडैप्टिव ऐंकर बैनर को लागू करने के लिए, नीचे दिया गया तरीका अपनाएं.
- अडैप्टिव बैनर विज्ञापन का साइज़ छोटा करें. आपको जो साइज़ मिलेगा उसे आपके अडैप्टिव बैनर के लिए अनुरोध करने के लिए इस्तेमाल किया जाएगा. अडैप्टिव विज्ञापन साइज़ पाने के लिए, पक्का करें कि:
- डिवाइस की चौड़ाई को डेंसिटी वाले स्वतंत्र पिक्सल में इस्तेमाल करें या अगर आप स्क्रीन की पूरी चौड़ाई का इस्तेमाल नहीं करना चाहते हैं, तो अपनी चौड़ाई सेट करें.
Screen.width
जैसे यूनिटी एपीआई पूरे पिक्सल दिखाते हैं, इसलिए आपको डिवाइस स्केल के आधार पर डिवाइड करना होगा (MobileAds.Utils.GetDeviceScale()
से लिया जा सकेगा). - पूरी चौड़ाई वाले बैनर के लिए,
AdSize.FullWidth
फ़्लैग का इस्तेमाल करें. - विज्ञापन की साइज़ क्लास में सही स्टैटिक तरीकों का इस्तेमाल करें, जैसे कि
AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(width)
मौजूदा ओरिएंटेशन के लिए अडैप्टिवAdSize
ऑब्जेक्ट पाने के लिए.
- डिवाइस की चौड़ाई को डेंसिटी वाले स्वतंत्र पिक्सल में इस्तेमाल करें या अगर आप स्क्रीन की पूरी चौड़ाई का इस्तेमाल नहीं करना चाहते हैं, तो अपनी चौड़ाई सेट करें.
- अपने विज्ञापन यूनिट आईडी, अडैप्टिव साइज़, और अपने विज्ञापन के लिए सही जगह के साथ
BannerView
ऑब्जेक्ट बनाएं. - विज्ञापन अनुरोध का ऑब्जेक्ट बनाएं और अपने विज्ञापन के तैयार किए गए व्यू पर
LoadAd()
तरीके का इस्तेमाल करके बैनर लोड करें. यह ठीक वैसा ही है जैसा बैनर बैनर के लिए किया जाता है.
कोड का उदाहरण
यहां एक उदाहरण स्क्रिप्ट दी गई है, जो स्क्रीन की चौड़ाई के हिसाब से अडैप्टिव बैनर को लोड और फिर से लोड करने के लिए, सुरक्षित इलाके को ध्यान में रखती है:
using UnityEngine;
using System;
using GoogleMobileAds.Api;
public class NewMonoBehaviour : MonoBehaviour
{
private BannerView bannerView;
// Use this for initialization
void Start()
{
RequestBanner();
}
public void OnGUI()
{
GUI.skin.label.fontSize = 60;
Rect textOutputRect = new Rect(
0.15f * Screen.width,
0.25f * Screen.height,
0.7f * Screen.width,
0.3f * Screen.height);
GUI.Label(textOutputRect, "Adaptive Banner Example");
}
private void RequestBanner()
{
// These ad units are configured to always serve test ads.
#if UNITY_EDITOR
string adUnitId = "unused";
#elif UNITY_ANDROID
string adUnitId = "ca-app-pub-3212738706492790/6113697308";
#elif UNITY_IPHONE
string adUnitId = "ca-app-pub-3212738706492790/5381898163";
#else
string adUnitId = "unexpected_platform";
#endif
// Clean up banner ad before creating a new one.
if (this.bannerView != null)
{
this.bannerView.Destroy();
}
AdSize adaptiveSize =
AdSize.GetCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(AdSize.FullWidth);
this.bannerView = new BannerView(adUnitId, adaptiveSize, AdPosition.Bottom);
// Register for ad events.
this.bannerView.OnAdLoaded += this.HandleAdLoaded;
this.bannerView.OnAdFailedToLoad += this.HandleAdFailedToLoad;
this.bannerView.OnAdOpening += this.HandleAdOpening;
this.bannerView.OnAdClosed += this.HandleAdClosed;
AdRequest adRequest = new AdRequest.Builder()
.AddTestDevice(AdRequest.TestDeviceSimulator)
.AddTestDevice("0123456789ABCDEF0123456789ABCDEF")
.Build();
// Load a banner ad.
this.bannerView.LoadAd(adRequest);
}
#region Banner callback handlers
public void HandleAdLoaded(object sender, EventArgs args)
{
MonoBehaviour.print("HandleAdLoaded event received");
MonoBehaviour.print(String.Format("Ad Height: {0}, width: {1}",
this.bannerView.GetHeightInPixels(),
this.bannerView.GetWidthInPixels()));
}
public void HandleAdFailedToLoad(object sender, AdFailedToLoadEventArgs args)
{
MonoBehaviour.print(
"HandleFailedToReceiveAd event received with message: " + args.Message);
}
public void HandleAdOpening(object sender, EventArgs args)
{
MonoBehaviour.print("HandleAdOpening event received");
}
public void HandleAdClosed(object sender, EventArgs args)
{
MonoBehaviour.print("HandleAdClosed event received");
}
#endregion
}
यहां फ़ंक्शन AdSize.GetCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth
का इस्तेमाल मौजूदा इंटरफ़ेस ओरिएंटेशन के लिए ऐंकर पोज़िशन पर बैनर का साइज़ पाने के लिए किया जाता है. किसी खास ओरिएंटेशन में ऐंकर बैनर को पहले से लोड करने के लिए, AdSize.GetPortraitAnchoredAdaptiveBannerAdSizeWithWidth
और AdSize.GetLandscapeAnchoredAdaptiveBannerAdSizeWithWidth
में मौजूद सही फ़ंक्शन का इस्तेमाल करें.