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

اختيار النظام الأساسي: Android جديد Android iOS Unity Flutter

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

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

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

قبل المتابعة، عليك إعداد Google Mobile Ads Unity Plugin.

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

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

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

/21775744923/example/fixed-size-banner

إعداد Google Mobile Ads Unity Plugin

قبل تحميل الإعلانات، اطلب من تطبيقك إعداد Google Mobile Ads Unity Plugin من خلال استدعاء MobileAds.Initialize(). يجب إجراء ذلك مرة واحدة فقط، ويُفضّل عند تشغيل التطبيق.

using GoogleMobileAds;
using GoogleMobileAds.Api;

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

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

مثال على BannerView

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

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

الخطوة الأولى في استخدام طريقة عرض بانر هي إنشاء مثيل لطريقة عرض بانر.

// Create a 320x50 banner at top of the screen.
adManagerBannerView = new AdManagerBannerView("AD_UNIT_ID", AdSize.Banner, AdPosition.Top);

استبدِل AD_UNIT_ID برقم تعريف الوحدة الإعلانية.

يحتوي منشئ AdManagerBannerView على المَعلمات التالية:

  • adUnitId: رقم تعريف الوحدة الإعلانية لإعلان البانر الذي سيتم تحميله.
  • AdSize: حجم البانر الذي تريد استخدامه.
  • AdPosition: الموضع الذي يجب وضع طرق عرض البانر فيه.

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

للحصول على تحكّم أكبر في موضع طريقة عرض البانر على الشاشة مقارنةً بما توفّره قيم AdPosition، استخدِم المنشئ الذي يتضمّن الإحداثيات x وy كمعلَمات:

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

يتم وضع أعلى يسار طريقة عرض البانر عند قيمتَي x وy اللتين تم تمريرهما إلى المنشئ، حيث يكون الأصل هو أعلى يسار الشاشة.

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

بالإضافة إلى استخدام ثابت AdSize، يمكنك أيضًا تحديد حجم مخصّص لإعلانك:

// Create a 250x250 banner at the bottom of the screen.
AdSize adSize = new AdSize(250, 250);
adManagerBannerView = new AdManagerBannerView("AD_UNIT_ID", adSize, AdPosition.Bottom);

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

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

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

// Create a 250x250 banner at the bottom of the screen.
adManagerBannerView = new AdManagerBannerView("AD_UNIT_ID", AdSize.Banner, AdPosition.Top);

// Add multiple ad sizes.
adManagerBannerView.ValidAdSizes = new List<AdSize>
{
    AdSize.Banner,
    new AdSize(120, 20),
    new AdSize(250, 250),
};

إذا غيّر AdManagerAdView حجمه في وقت إعادة التحميل، يجب أن يكون بإمكان تصميمك التكيّف تلقائيًا مع الحجم الجديد. يتم ضبط AdManagerAdView تلقائيًا على الحجم الذي تم تمريره في المَعلمة الأولى إلى أن يتم عرض الإعلان التالي.

تحميل إعلان بانر

بعد وضع AdManagerBannerView في مكانه، انتقِل إلى تحميل إعلان باستخدام طريقة LoadAd() في فئة AdManagerBannerView. تأخذ هذه الطريقة مَعلمة تحتوي على معلومات وقت التشغيل، مثل معلومات الاستهداف وتصنيفات الاستبعاد ورقم تعريف الناشر.

لتحميل إعلان، أنشئ AdManagerAdRequest ومرِّره إلى طريقة LoadAd().

// Send a request to load an ad into the banner view.
adManagerBannerView.LoadAd(new AdManagerAdRequest());

الاستماع إلى أحداث طريقة عرض البانر

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

adManagerBannerView.OnBannerAdLoaded += () =>
{
    // Raised when an ad is loaded into the banner view.
};
adManagerBannerView.OnBannerAdLoadFailed += (LoadAdError error) =>
{
    // Raised when an ad fails to load into the banner view.
};
adManagerBannerView.OnAdPaid += (AdValue adValue) =>
{
    // Raised when the ad is estimated to have earned money.
};
adManagerBannerView.OnAdImpressionRecorded += () =>
{
    // Raised when an impression is recorded for an ad.
};
adManagerBannerView.OnAdClicked += () =>
{
    // Raised when a click is recorded for an ad.
};
adManagerBannerView.OnAdFullScreenContentOpened += () =>
{
    // Raised when an ad opened full screen content.
};
adManagerBannerView.OnAdFullScreenContentClosed += () =>
{
    // Raised when the ad closed full screen content.
};

محو طريقة عرض البانر

لإتلاف البانر، استدعِ طريقة Destroy() لإطلاق الموارد:

if (adManagerBannerView != null)
{
    // Always destroy the banner view when no longer needed.
    adManagerBannerView.Destroy();
    adManagerBannerView = null;
}

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

إعادة تحميل إعلان

إذا أعددت وحدتك الإعلانية لإعادة التحميل، ليس عليك طلب إعلان آخر عندما يتعذّر تحميل الإعلان. Google Mobile Ads Unity Plugin يأخذ في الاعتبار أي معدّل إعادة تحميل تحدّده في واجهة مستخدم "إدارة الإعلانات". إذا لم تفعِّل إعادة التحميل، أرسِل طلبًا جديدًا. لمزيد من التفاصيل حول إعادة تحميل الوحدة الإعلانية، مثل ضبط معدّل إعادة التحميل، يُرجى الاطّلاع على مقالة معدّل إعادة التحميل للإعلانات في التطبيقات على الأجهزة الجوّالة.

يعرض الجدول التالي أحجام البانر العادية:

الحجم بالوحدات المستقلة الكثافة (العرض × الارتفاع) الوصف مدى التوفّر ثابت AdSize
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. يمكن أن تحدث هذه الأحداث في أي وقت خلال مراحل نشاط الإعلان، حتى قبل استدعاء طريقة التحميل.

يتم عرض OnAppEventReceived عند حدوث حدث تطبيق في إعلان. في ما يلي مثال على كيفية معالجة هذا الحدث في الرمز البرمجي:

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

في ما يلي مثال يوضّح كيفية تغيير لون خلفية تطبيقك استنادًا إلى حدث تطبيق باسم اللون:

adManagerBannerView.OnAppEventReceived += (AppEvent args) =>
{
    if (args.Name == "color")
    {
        Color color;
        if (ColorUtility.TryParseHtmlString(args.Data, out color))
        {
            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: 0;
      left: 0;
      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>

مراجع إضافية