تبلیغات بنری

پلتفرم را انتخاب کنید: Android iOS Unity Flutter

نماهای بنر، تبلیغات تصویری یا متنی مستطیلی هستند که نقطه ای روی صفحه را اشغال می کنند. در حالی که کاربران در حال تعامل با برنامه هستند، روی صفحه می مانند و می توانند پس از مدت زمان مشخصی به طور خودکار بازخوانی شوند. اگر در زمینه تبلیغات موبایلی تازه کار هستید، آنها مکان خوبی برای شروع هستند.

این راهنما به شما نشان می دهد که چگونه نماهای بنر را در یک برنامه یونیتی ادغام کنید. علاوه بر تکه‌های کد و دستورالعمل‌ها، اطلاعاتی در مورد اندازه‌بندی صحیح بنرها و پیوندهایی به منابع اضافی نیز دارد.

پیش نیازها

همیشه با تبلیغات آزمایشی تست کنید

کد نمونه زیر حاوی شناسه واحد تبلیغاتی است که می توانید از آن برای درخواست تبلیغات آزمایشی استفاده کنید. این به طور ویژه برای بازگرداندن تبلیغات آزمایشی به جای تبلیغات تولیدی برای هر درخواست پیکربندی شده است و استفاده از آن را ایمن می کند.

با این حال، پس از اینکه برنامه‌ای را در رابط وب Ad Manager ثبت کردید و شناسه‌های واحد تبلیغاتی خود را برای استفاده در برنامه خود ایجاد کردید، دستگاه خود را به صراحت به عنوان یک دستگاه آزمایشی در حین توسعه پیکربندی کنید .

/21775744923/example/adaptive-banner

SDK تبلیغات موبایل را راه اندازی کنید

قبل از بارگیری تبلیغات، از برنامه خود بخواهید با فراخوانی MobileAds.Initialize() SDK تبلیغات موبایل را مقداردهی اولیه کند. این کار باید فقط یک بار انجام شود، ایده آل در هنگام راه اندازی برنامه.

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 برای بارگذاری یک آگهی در نمای بنر استفاده کنید و سپس با مدیریت رویدادهای چرخه حیات، قابلیت های آن را گسترش دهید.

یک نمای بنر ایجاد کنید

اولین قدم در استفاده از نمای بنر، ایجاد یک نمونه از نمای بنر است. 

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

شناسه واحد تبلیغات خود را جایگزین 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);
AdManagerBannerViewSnippets.cs

گوشه سمت چپ بالای نمای بنر در مقادیر 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);
AdManagerBannerViewSnippets.cs

(اختیاری) چند اندازه تبلیغات

Ad Manager به شما امکان می دهد چندین اندازه تبلیغات را مشخص کنید که می توانند برای ارائه در 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),
};
AdManagerBannerViewSnippets.cs

اگر اندازه AdManagerAdView در زمان تازه‌سازی تغییر می‌کند، طرح‌بندی شما باید بتواند به‌طور خودکار با اندازه جدید سازگار شود. AdManagerAdView به طور پیش‌فرض به اندازه ارسال شده در پارامتر اول تا زمان بازگشت آگهی بعدی است.

بارگذاری یک بنر تبلیغاتی

بعد از اینکه AdManagerBannerView در جای خود قرار گرفت، اقدام به بارگذاری آگهی با متد LoadAd() در کلاس AdManagerBannerView کنید. طول می کشد پارامتری که اطلاعات زمان اجرا، مانند اطلاعات هدف، برچسب های حذف، و شناسه ارائه شده ناشر را در خود نگه می دارد.

برای بارگذاری یک تبلیغ، یک AdManagerAdRequest ایجاد کنید و آن را به متد LoadAd() ارسال کنید.

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

به رویدادهای نمایش بنر گوش دهید

برای سفارشی کردن رفتار تبلیغ خود، می‌توانید به تعدادی از رویدادها در چرخه عمر تبلیغ، مانند بارگیری، باز کردن یا بسته شدن، متصل شوید. برای گوش دادن به این رویدادها، یک نماینده ثبت نام کنید:

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.
};
AdManagerBannerViewSnippets.cs

نمای بنر را از بین ببرید

پس از اتمام استفاده از نمای بنر، حتماً Destroy() برای انتشار منابع فراخوانی کنید.

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

همین! اکنون برنامه شما برای نمایش تبلیغات بنری آماده است.

یک آگهی را تازه کنید

اگر واحد تبلیغات خود را برای بازخوانی پیکربندی کرده‌اید، نیازی به درخواست آگهی دیگری در صورت عدم بارگیری آگهی ندارید. Google Mobile Ads SDK به نرخ تازه‌سازی که در رابط کاربری Ad Manager مشخص کرده‌اید احترام می‌گذارد. اگر بازخوانی را فعال نکرده‌اید، درخواست جدیدی صادر کنید. برای جزئیات بیشتر در مورد بازخوانی واحد تبلیغات، مانند تنظیم نرخ تازه‌سازی، به نرخ تازه‌سازی برای تبلیغات در برنامه‌های تلفن همراه مراجعه کنید.

جدول زیر اندازه های استاندارد بنر را فهرست می کند:

اندازه بر حسب dp (WxH) توضیحات در دسترس بودن AdSize ثابت
320x50 بنر استاندارد گوشی و تبلت BANNER
320x100 بنر بزرگ گوشی و تبلت LARGE_BANNER
300x250 مستطیل متوسط ​​IAB گوشی و تبلت MEDIUM_RECTANGLE
468x60 بنر سایز کامل IAB قرص FULL_BANNER
728x90 تابلوی امتیازات IAB قرص LEADERBOARD
عرض ارائه شده x ارتفاع تطبیقی بنر تطبیقی گوشی و تبلت N/A
عرض صفحه x 32|50|90 بنر هوشمند گوشی و تبلت SMART_BANNER
درباره بنرهای تطبیقی ​​که برای جایگزینی بنرهای هوشمند در نظر گرفته شده است، بیشتر بیاموزید.

رویدادهای برنامه

رویدادهای برنامه به شما امکان می‌دهند تبلیغاتی ایجاد کنید که می‌توانند به کد برنامه‌شان پیام ارسال کنند. سپس برنامه می تواند بر اساس این پیام ها اقداماتی را انجام دهد.

می‌توانید با استفاده از AppEvent به رویدادهای برنامه Ad Manager گوش دهید. این رویدادها می توانند در هر زمانی در طول چرخه عمر تبلیغ، حتی قبل از فراخوانی بار، رخ دهند.

OnAppEventReceived هنگامی که یک رویداد برنامه در یک تبلیغ رخ می دهد، افزایش می یابد. در اینجا مثالی از نحوه مدیریت این رویداد در کد شما آورده شده است:

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

در اینجا یک مثال نشان می دهد که چگونه رنگ پس زمینه برنامه خود را بسته به یک رویداد برنامه با نام رنگ تغییر دهید: 

adManagerBannerView.OnAppEventReceived += (AppEvent args) =>
{
    if (args.Name == "color")
    {
        Color color;
        if (ColorUtility.TryParseHtmlString(args.Data, out color))
        {
            renderer.material.color = color;
        }
    }
};
AdManagerBannerViewSnippets.cs

و، در اینجا خلاقیت مربوطه است که رویداد برنامه رنگی را ارسال می کند: 

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

AppEventSnippets.html

منابع اضافی

،
پلتفرم را انتخاب کنید: Android iOS Unity Flutter

نماهای بنر، تبلیغات تصویری یا متنی مستطیلی هستند که نقطه ای روی صفحه را اشغال می کنند. در حالی که کاربران در حال تعامل با برنامه هستند، روی صفحه می مانند و می توانند پس از مدت زمان مشخصی به طور خودکار بازخوانی شوند. اگر در زمینه تبلیغات موبایلی تازه کار هستید، آنها مکان خوبی برای شروع هستند.

این راهنما به شما نشان می دهد که چگونه نماهای بنر را در یک برنامه یونیتی ادغام کنید. علاوه بر تکه‌های کد و دستورالعمل‌ها، اطلاعاتی در مورد اندازه‌بندی صحیح بنرها و پیوندهایی به منابع اضافی نیز دارد.

پیش نیازها

همیشه با تبلیغات آزمایشی تست کنید

کد نمونه زیر حاوی شناسه واحد تبلیغاتی است که می توانید از آن برای درخواست تبلیغات آزمایشی استفاده کنید. این به طور ویژه برای بازگرداندن تبلیغات آزمایشی به جای تبلیغات تولیدی برای هر درخواست پیکربندی شده است و استفاده از آن را ایمن می کند.

با این حال، پس از اینکه برنامه‌ای را در رابط وب Ad Manager ثبت کردید و شناسه‌های واحد تبلیغاتی خود را برای استفاده در برنامه خود ایجاد کردید، دستگاه خود را به صراحت به عنوان یک دستگاه آزمایشی در حین توسعه پیکربندی کنید .

/21775744923/example/adaptive-banner

SDK تبلیغات موبایل را راه اندازی کنید

قبل از بارگیری تبلیغات، از برنامه خود بخواهید با فراخوانی MobileAds.Initialize() SDK تبلیغات موبایل را مقداردهی اولیه کند. این کار باید فقط یک بار انجام شود، ایده آل در هنگام راه اندازی برنامه.

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 برای بارگذاری یک آگهی در نمای بنر استفاده کنید و سپس با مدیریت رویدادهای چرخه حیات، قابلیت های آن را گسترش دهید.

یک نمای بنر ایجاد کنید

اولین قدم در استفاده از نمای بنر، ایجاد یک نمونه از نمای بنر است. 

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

شناسه واحد تبلیغات خود را جایگزین 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);
AdManagerBannerViewSnippets.cs

گوشه سمت چپ بالای نمای بنر در مقادیر 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);
AdManagerBannerViewSnippets.cs

(اختیاری) چند اندازه تبلیغات

Ad Manager به شما امکان می دهد چندین اندازه تبلیغات را مشخص کنید که می توانند برای ارائه در 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),
};
AdManagerBannerViewSnippets.cs

اگر اندازه AdManagerAdView در زمان تازه‌سازی تغییر می‌کند، طرح‌بندی شما باید بتواند به‌طور خودکار با اندازه جدید سازگار شود. AdManagerAdView به طور پیش‌فرض به اندازه ارسال شده در پارامتر اول تا زمان بازگشت آگهی بعدی است.

بارگذاری یک بنر تبلیغاتی

بعد از اینکه AdManagerBannerView در جای خود قرار گرفت، اقدام به بارگذاری آگهی با متد LoadAd() در کلاس AdManagerBannerView کنید. طول می کشد پارامتری که اطلاعات زمان اجرا، مانند اطلاعات هدف، برچسب های حذف، و شناسه ارائه شده ناشر را در خود نگه می دارد.

برای بارگذاری یک تبلیغ، یک AdManagerAdRequest ایجاد کنید و آن را به متد LoadAd() ارسال کنید.

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

به رویدادهای نمایش بنر گوش دهید

برای سفارشی کردن رفتار تبلیغ خود، می‌توانید به تعدادی از رویدادها در چرخه عمر تبلیغ، مانند بارگیری، باز کردن یا بسته شدن، متصل شوید. برای گوش دادن به این رویدادها، یک نماینده ثبت نام کنید:

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.
};
AdManagerBannerViewSnippets.cs

نمای بنر را از بین ببرید

پس از اتمام استفاده از نمای بنر، حتماً Destroy() برای انتشار منابع فراخوانی کنید.

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

همین! اکنون برنامه شما برای نمایش تبلیغات بنری آماده است.

یک آگهی را تازه کنید

اگر واحد تبلیغات خود را برای بازخوانی پیکربندی کرده‌اید، نیازی به درخواست آگهی دیگری در صورت عدم بارگیری آگهی ندارید. Google Mobile Ads SDK به نرخ تازه‌سازی که در رابط کاربری Ad Manager مشخص کرده‌اید احترام می‌گذارد. اگر بازخوانی را فعال نکرده‌اید، درخواست جدیدی صادر کنید. برای جزئیات بیشتر در مورد بازخوانی واحد تبلیغات، مانند تنظیم نرخ تازه‌سازی، به نرخ تازه‌سازی برای تبلیغات در برنامه‌های تلفن همراه مراجعه کنید.

جدول زیر اندازه های استاندارد بنر را فهرست می کند:

اندازه بر حسب dp (WxH) توضیحات در دسترس بودن AdSize ثابت
320x50 بنر استاندارد گوشی و تبلت BANNER
320x100 بنر بزرگ گوشی و تبلت LARGE_BANNER
300x250 مستطیل متوسط ​​IAB گوشی و تبلت MEDIUM_RECTANGLE
468x60 بنر سایز کامل IAB قرص FULL_BANNER
728x90 تابلوی امتیازات IAB قرص LEADERBOARD
عرض ارائه شده x ارتفاع تطبیقی بنر تطبیقی گوشی و تبلت N/A
عرض صفحه x 32|50|90 بنر هوشمند گوشی و تبلت SMART_BANNER
درباره بنرهای تطبیقی ​​که برای جایگزینی بنرهای هوشمند در نظر گرفته شده است، بیشتر بیاموزید.

رویدادهای برنامه

رویدادهای برنامه به شما امکان می‌دهند تبلیغاتی ایجاد کنید که می‌توانند به کد برنامه‌شان پیام ارسال کنند. سپس برنامه می تواند بر اساس این پیام ها اقداماتی را انجام دهد.

می‌توانید با استفاده از AppEvent به رویدادهای برنامه Ad Manager گوش دهید. این رویدادها می توانند در هر زمانی در طول چرخه عمر تبلیغ، حتی قبل از فراخوانی بار، رخ دهند.

OnAppEventReceived هنگامی که یک رویداد برنامه در یک تبلیغ رخ می دهد، افزایش می یابد. در اینجا مثالی از نحوه مدیریت این رویداد در کد شما آورده شده است:

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

در اینجا یک مثال نشان می دهد که چگونه رنگ پس زمینه برنامه خود را بسته به یک رویداد برنامه با نام رنگ تغییر دهید: 

adManagerBannerView.OnAppEventReceived += (AppEvent args) =>
{
    if (args.Name == "color")
    {
        Color color;
        if (ColorUtility.TryParseHtmlString(args.Data, out color))
        {
            renderer.material.color = color;
        }
    }
};
AdManagerBannerViewSnippets.cs

و، در اینجا خلاقیت مربوطه است که رویداد برنامه رنگی را ارسال می کند: 

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

AppEventSnippets.html

منابع اضافی