إعلانات البانر

عروض إعلانات البانر هي إعلانات مصوّرة أو نصية مستطيلة تشغل موضعًا على الشاشة. وتظل معروضة على الشاشة أثناء تفاعل المستخدمين مع التطبيق، ويمكنهم تحديثها. تلقائيًا بعد فترة زمنية معينة. إذا كنت مبتدئًا في مجال استخدام الأجهزة الجوّالة الإعلانية، فهي مكان رائع للبدء.

يوضِّح لك هذا الدليل كيفية دمج طرق عرض إعلانات البانر في تطبيق Unity. بالإضافة إلى ذلك إلى مقتطفات الرمز والتعليمات، فإنها تتضمن أيضًا معلومات حول مقاسات إعلانات البانر بشكل صحيح وترتبط بموارد إضافية.

المتطلبات الأساسية

الاختبار دائمًا باستخدام الإعلانات الاختبارية

يحتوي نموذج الرمز التالي على رقم تعريف وحدة إعلانية يمكنك استخدامه لطلب اختبار الإعلانات. تم إعدادها خصيصًا لعرض إعلانات اختبارية بدلاً من لكل طلب، مما يجعلها آمنة للاستخدام.

ومع ذلك، بعد تسجيل تطبيق في واجهة "مدير الإعلانات" على الويب وأنشأت وحدتك الإعلانية الخاصة أرقام التعريف التي سيتم استخدامها في تطبيقك، يجب ضبط جهازك كاختبار بشكلٍ صريح الجهاز أثناء والتطوير.

/6499/example/banner

إعداد حزمة تطوير البرامج (SDK) لعرض الإعلانات للأجهزة الجوّالة

قبل تحميل الإعلانات، يجب أن يُعِدّ تطبيقك حزمة تطوير البرامج (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 لتحميل إعلان في طريقة عرض البانر ومن ثم توسيع إمكاناتها من خلال التعامل مع أحداث مراحل النشاط

إنشاء طريقة عرض بانر

تتمثل الخطوة الأولى لاستخدام طريقة عرض بانر في إنشاء مثيل لعرض بانر في نص برمجي C# مرفق بـ GameObject.


  // This ad unit is configured to always serve test ads.
  private string _adUnitId = "/6499/example/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.

(اختياري) إنشاء طريقة عرض بانر بموضع مخصّص

لمزيد من التحكّم في مكان ظهور AdManagerBannerView موضوعة على الشاشة أكثر مما تقدمه قيم AdPosition، استخدم الدالة الإنشائية التي تحتوي على إحداثيي س وص كمعاملين:

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

(اختياري) أحجام الإعلانات المتعددة

يتيح لك "مدير الإعلانات" تحديد أحجام إعلانات متعددة يمكن أن تكون مؤهَّلة للعرض. في AdManagerBannerView. قبل تنفيذ هذه الميزة في SDK، قم بإنشاء بند يستهدف الوحدات الإعلانية نفسها المرتبطة بتصاميم إعلانات بأحجام مختلفة.

في تطبيقك، أدخِل معلَمات AdSize متعددة إلى ValidAdSizes:

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" في مكانه، تابِع عملية التحميل. إعلان يستخدم طريقة LoadAd() في AdManagerBannerView الصف. يتطلب الأمر معلمة يمكن الاحتفاظ بها معلومات وقت التشغيل، مثل معلومات الاستهداف وتصنيفات الاستبعاد وناشر المعرف المُقدم.

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

هذا كل شيء! تطبيقك جاهز الآن لعرض إعلانات البانر.

يسرد الجدول التالي الأحجام العادية لإعلانات البانر.

الحجم بوحدات بكسل مستقلة الكثافة (عرض × ارتفاع) الوصف مدى التوفّر ثابت حجم الإعلان
320×50 بانر عادي الهواتف والأجهزة اللوحية BANNER
100x320 بانر كبير الهواتف والأجهزة اللوحية LARGE_BANNER
300×250 مستطيل متوسط IAB الهواتف والأجهزة اللوحية MEDIUM_RECTANGLE
468×60 إعلان بانر بالحجم الكامل لمكتب الإعلانات التفاعلية (IAB) الأجهزة اللوحية FULL_BANNER
728×90 قائمة الإعلانات المتصدِّرة من مكتب الإعلانات التفاعلية (IAB) الأجهزة اللوحية LEADERBOARD
العرض المقدم × الارتفاع التكيُّفي بانر تكيُّفي الهواتف والأجهزة اللوحية لا ينطبق
عرض الشاشة × 32|50|90 بانر ذكي الهواتف والأجهزة اللوحية SMART_BANNER
وتعرّف على مزيد من المعلومات حول إعلانات البانر التكيُّفية، لاستبدال إعلانات البانر الذكية.

أحداث التطبيقات

تتيح لك أحداث التطبيقات إنشاء إعلانات يمكنها إرسال رسائل إلى رمز التطبيق. التطبيق ويمكنهم بعد ذلك اتخاذ إجراءات استنادًا إلى هذه الرسائل.

يمكنك الاستماع إلى أحداث تطبيقات معيّنة في "مدير الإعلانات" باستخدام AppEvent. هذه الأحداث يمكن أن تحدث في أي وقت خلال دورة حياة الإعلان، حتى قبل طلب التحميل.

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>

مراجع إضافية