Konfigurowanie banerów reklamowych

Wybierz platformę: Android Android iOS Unity Flutter

Banery reklamowe to prostokątne reklamy graficzne lub tekstowe, które zajmują miejsce na ekranie. Pozostają na ekranie, gdy użytkownicy wchodzą w interakcję z aplikacją, i mogą być automatycznie odświeżane po upływie określonego czasu. Jeśli dopiero zaczynasz korzystać z reklam mobilnych, banery reklamowe są dobrym punktem wyjścia.

Z tego przewodnika dowiesz się, jak zintegrować banery reklamowe z aplikacją Unity. Oprócz fragmentów kodu i instrukcji znajdziesz tu też informacje o prawidłowym rozmiarze banerów i linki do dodatkowych materiałów.

Wymagania wstępne

Zanim przejdziesz dalej, skonfiguruj Google Mobile Ads Unity Plugin.

Zawsze testuj reklamy testowe

Poniższy przykładowy kod zawiera identyfikator jednostki reklamowej, którego możesz użyć do żądania reklam testowych. Został on specjalnie skonfigurowany tak, aby przy każdym żądaniu zwracać reklamy testowe, a nie reklamy produkcyjne, dzięki czemu można go bezpiecznie używać.

Gdy zarejestrujesz aplikację w interfejsie internetowym Ad Managera i utworzysz własne identyfikatory jednostek reklamowych do użycia w aplikacji, podczas programowania wyraźnie skonfiguruj urządzenie jako urządzenie testowe.

/21775744923/example/fixed-size-banner

Inicjowanie Google Mobile Ads Unity Plugin

Zanim aplikacja wczyta reklamy, musi zainicjować Google Mobile Ads Unity Plugin, wywołując MobileAds.Initialize(). Należy to zrobić tylko raz, najlepiej przy uruchomieniu aplikacji.

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.
        });
    }
}

Jeśli używasz zapośredniczenia, przed wczytaniem reklam poczekaj na wywołanie zwrotne. Dzięki temu wszystkie adaptery zapośredniczenia zostaną zainicjowane.

Przykład BannerView

Poniższy przykładowy kod zawiera szczegółowe informacje o tym, jak używać banera reklamowego. W tym przykładzie tworzymy instancję banera reklamowego, używamy AdManagerAdRequest, aby wczytać reklamę do banera reklamowego, a następnie rozszerzamy jego możliwości, obsługując zdarzenia cyklu życia.

Tworzenie banera reklamowego

Pierwszym krokiem w korzystaniu z banera reklamowego jest utworzenie jego instancji.

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

Zastąp AD_UNIT_ID identyfikatorem jednostki reklamowej.

Konstruktor AdManagerBannerView ma te parametry:

• adUnitId: identyfikator jednostki reklamowej banera reklamowego, który ma zostać wczytany.
• AdSize: Rozmiar banera, którego chcesz użyć.
• AdPosition: pozycja, w której mają się znajdować banery reklamowe.

(Opcjonalnie) Tworzenie banera reklamowego z niestandardową pozycją

Aby mieć większą kontrolę nad tym, gdzie baner jest umieszczany na ekranie, niż oferują wartości AdPosition, użyj konstruktora, który ma współrzędne x i y jako parametry:

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

Lewy górny róg widoku banera jest umieszczony w wartościach x i y przekazanych do konstruktora, gdzie początek to lewy górny róg ekranu.

(Opcjonalnie) Tworzenie banera reklamowego o niestandardowym rozmiarze

Oprócz używania stałej AdSize możesz też określić niestandardowy rozmiar reklamy:

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

(Opcjonalnie) Reklamy w kilku rozmiarach

Ad Manager umożliwia określenie kilku rozmiarów reklam, które mogą być wyświetlane w AdManagerBannerView. Zanim zaimplementujesz tę funkcję w pakiecie SDK, utwórz element zamówienia kierowany na te same jednostki reklamowe powiązane z kreacjami o różnych rozmiarach.

W aplikacji przekaż kilka parametrów AdSize do 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

Jeśli AdManagerAdView zmieni rozmiar w momencie odświeżania, układ powinien automatycznie dostosować się do nowego rozmiaru. Domyślnie AdManagerAdView ma rozmiar przekazany w pierwszym parametrze, dopóki nie zostanie zwrócona następna reklama.

Wczytywanie banera reklamowego

Gdy AdManagerBannerView jest już na miejscu, wczytaj reklamę za pomocą metody LoadAd() w klasie AdManagerBannerView. Przyjmuje ona parametr , który zawiera informacje o czasie działania, takie jak informacje o kierowaniu, etykiety wykluczeń i identyfikator podany przez wydawcę.

Aby wczytać reklamę, utwórz AdManagerAdRequest i przekaż go do metody LoadAd().

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

Nasłuchiwanie zdarzeń banera reklamowego

Aby dostosować działanie reklamy, możesz połączyć się z różnymi zdarzeniami w cyklu życia reklamy, takimi jak wczytywanie, otwieranie czy zamykanie. Aby nasłuchiwać tych zdarzeń, zarejestruj delegata:

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

Niszczenie banera reklamowego

Aby zniszczyć baner, wywołaj metodę Destroy() , aby zwolnić zasoby:

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

W przypadku banerów, których nie udało się wczytać, zalecamy odświeżenie banera zamiast niszczenia i tworzenia nowego. Więcej informacji znajdziesz w artykule Odświeżanie reklamy.

Odświeżanie reklamy

Jeśli jednostka reklamowa jest skonfigurowana do odświeżania, nie musisz wysyłać kolejnego żądania reklamy, gdy nie uda się jej wczytać. Google Mobile Ads Unity Plugin uwzględnia częstotliwość odświeżania określoną w interfejsie Ad Managera. Jeśli odświeżanie nie jest włączone, wyślij nowe żądanie. Więcej informacji o odświeżaniu jednostek reklamowych, np. o ustawianiu częstotliwości odświeżania, znajdziesz w artykule Częstotliwość odświeżania reklam w aplikacjach mobilnych.

Rozmiary banerów

W tabeli poniżej znajdziesz standardowe rozmiary banerów:

Zdarzenia w aplikacjach

Zdarzenia w aplikacjach umożliwiają tworzenie reklam, które mogą wysyłać wiadomości do kodu aplikacji. Aplikacja może następnie podejmować działania na podstawie tych wiadomości.

Możesz nasłuchiwać zdarzeń w aplikacjach specyficznych dla Ad Managera za pomocą AppEvent. Te zdarzenia mogą wystąpić w dowolnym momencie cyklu życia reklamy, nawet przed wywołaniem wczytania.

Gdy w reklamie wystąpi zdarzenie w aplikacji, wywoływane jest zdarzenie OnAppEventReceived. Oto przykład, jak obsługiwać to zdarzenie w kodzie:

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

Oto przykład, jak zmienić kolor tła aplikacji w zależności od zdarzenia w aplikacji o nazwie color:

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

A oto odpowiednia kreacja, która wysyła zdarzenie w aplikacji 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>
AppEventSnippets.html

Dodatkowe materiały

• Przykład HelloWorld: minimalna implementacja wszystkich formatów reklam.