Quảng cáo biểu ngữ

Chế độ xem biểu ngữ là quảng cáo dạng văn bản hoặc quảng cáo dạng hình ảnh hình chữ nhật chiếm một vị trí trên màn hình. Quảng cáo biểu ngữ vẫn hiển thị trên màn hình trong khi người dùng tương tác với ứng dụng và có thể làm mới tự động sau một khoảng thời gian nhất định. Nếu bạn mới sử dụng quảng cáo trên thiết bị di động, thì đây là loại quảng cáo rất phù hợp để bắt đầu.

Tài liệu hướng dẫn này trình bày cách tích hợp thành phần hiển thị biểu ngữ vào ứng dụng Unity. Ngoài các đoạn mã và thông tin hướng dẫn, bài viết này còn cung cấp thông tin về cách xác định kích thước biểu ngữ sao cho phù hợp và đường liên kết đến các tài nguyên khác.

Điều kiện tiên quyết

• Xem hết Hướng dẫn bắt đầu sử dụng.

Luôn thử nghiệm bằng quảng cáo thử nghiệm

Mã mẫu sau đây chứa một mã đơn vị quảng cáo mà bạn có thể sử dụng để yêu cầu quảng cáo thử nghiệm. Mã này được định cấu hình đặc biệt để trả về quảng cáo thử nghiệm thay vì quảng cáo thực tế cho mọi yêu cầu, giúp đảm bảo an toàn khi sử dụng.

Tuy nhiên, sau khi đăng ký một ứng dụng trong Giao diện web Ad Manager và tạo đơn vị quảng cáo của riêng bạn Mã nhận dạng để sử dụng trong ứng dụng của bạn, hãy định cấu hình thiết bị của bạn làm quá trình kiểm tra một cách rõ ràng thiết bị trong khoảng thời gian phát triển ứng dụng.

/21775744923/example/adaptive-banner

Chạy SDK quảng cáo trên thiết bị di động

Trước khi tải quảng cáo, hãy để ứng dụng của bạn chạy SDK quảng cáo trên thiết bị di động bằng cách gọi MobileAds.Initialize(). Bạn chỉ cần thực hiện việc này một lần, tốt nhất là khi khởi chạy ứng dụng.

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

Nếu bạn đang sử dụng tính năng dàn xếp, hãy đợi cho đến khi lệnh gọi lại xảy ra trước khi tải quảng cáo dưới dạng điều này sẽ đảm bảo rằng tất cả các bộ chuyển đổi dàn xếp đều được khởi chạy.

Ví dụ về BannerView

Mã mẫu bên dưới nêu chi tiết cách sử dụng chế độ xem biểu ngữ. Trong ví dụ này, bạn hãy tạo một bản sao của chế độ xem biểu ngữ, hãy sử dụng AdManagerAdRequest để tải một quảng cáo vào chế độ xem biểu ngữ, và sau đó mở rộng khả năng bằng cách xử lý các sự kiện trong vòng đời.

Tạo chế độ xem biểu ngữ

Bước đầu tiên để sử dụng chế độ xem biểu ngữ là tạo một bản sao của chế độ xem biểu ngữ trong tập lệnh C# được đính kèm vào GameObject.

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

Hàm khởi tạo cho AdManagerBannerView có các thông số sau:

• adUnitId: Mã đơn vị quảng cáo mà từ đó AdManagerBannerView sẽ tải quảng cáo.
• AdSize: Kích thước quảng cáo mà bạn muốn sử dụng. Tham khảo phần Kích thước biểu ngữ để biết thông tin chi tiết.
• AdPosition: Vị trí mà bạn nên đặt thành phần hiển thị biểu ngữ. Chiến lược phát hành đĩa đơn Enum AdPosition liệt kê các giá trị vị trí quảng cáo hợp lệ.

Hãy lưu ý cách sử dụng các đơn vị quảng cáo khác nhau, tuỳ thuộc vào nền tảng. Bạn cần sử dụng đơn vị quảng cáo dành cho iOS để tạo các yêu cầu quảng cáo trên iOS và một đơn vị quảng cáo dành cho Android để thực hiện trên Android.

(Không bắt buộc) Tạo chế độ xem biểu ngữ có vị trí tuỳ chỉnh

Để kiểm soát tốt hơn vị trí của AdManagerBannerView được đặt trên màn hình so với những gì do giá trị AdPosition cung cấp, hãy sử dụng hàm khởi tạo có toạ độ x và y làm tham số:

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

Góc trên cùng bên trái của AdManagerBannerView được định vị theo các giá trị x và y được truyền đến hàm khởi tạo, còn gốc toạ độ sẽ nằm ở phía trên cùng bên trái của màn hình.

(Không bắt buộc) Tạo chế độ xem biểu ngữ có kích thước tuỳ chỉnh

Ngoài việc sử dụng hằng số AdSize, bạn cũng có thể chỉ định kích thước tuỳ chỉnh cho quảng cáo của bạn:

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

(Không bắt buộc) Nhiều kích thước quảng cáo

Ad Manager cho phép bạn chỉ định nhiều kích thước quảng cáo có thể đủ điều kiện phân phát trong AdManagerBannerView. Trước khi triển khai tính năng này trong SDK, hãy tạo một mục hàng nhắm đến cùng đơn vị quảng cáo được liên kết với các mẫu quảng cáo có kích thước khác nhau.

Trong ứng dụng của bạn, hãy truyền nhiều tham số AdSize vào 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),
};

Nếu AdManagerAdView thay đổi kích thước tại thời điểm làm mới, bố cục của bạn có thể tự động điều chỉnh cho phù hợp với kích thước mới. Kích thước mặc định của AdManagerAdView được chuyển vào thông số đầu tiên cho đến khi quảng cáo tiếp theo trả về.

Tải quảng cáo biểu ngữ

Sau khi AdManagerBannerView được đưa vào vị trí, hãy tiếp tục tải một quảng cáo có phương thức LoadAd() trong AdManagerBannerView . Phương thức này sẽ lấy một tham số chứa thông tin về thời gian chạy, chẳng hạn như thông tin nhắm mục tiêu, nhãn loại trừ và nhà xuất bản ID được cung cấp.

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

Lưu ý: Bạn có thể sử dụng lệnh gọi tải quảng cáo để tạo bộ nhớ đệm cho các quảng cáo được tải trước trước khi dự định hiển thị các quảng cáo đó để quảng cáo có thể được hiển thị với độ trễ bằng 0 khi cần. Vì quảng cáo hết hạn sau một giờ, nên bạn nên xoá bộ nhớ đệm này và tải lại bằng quảng cáo mới mỗi giờ.

Theo dõi các sự kiện về lượt xem biểu ngữ

Để tuỳ chỉnh hoạt động của quảng cáo, bạn có thể dựa vào một số sự kiện trong vòng đời của quảng cáo, chẳng hạn như tải, mở hoặc đóng. Để nghe những cụm từ này sự kiện, đăng ký người được uỷ quyền:

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

Huỷ chế độ xem biểu ngữ

Khi sử dụng xong chế độ xem biểu ngữ, hãy nhớ gọi Destroy() để huỷ bỏ của chúng tôi.

/// <summary>
/// Destroys the banner view.
/// </summary>
public void DestroyAd()
{
    if (_bannerView != null)
    {
        Debug.Log("Destroying banner view.");
        _bannerView.Destroy();
        _bannerView = null;
    }
}

Vậy là xong! Bây giờ, ứng dụng của bạn đã sẵn sàng hiển thị quảng cáo biểu ngữ.

Kích thước biểu ngữ

Bảng bên dưới liệt kê các kích thước biểu ngữ chuẩn.

Kích thước tính bằng dp (RxC)	Mô tả	Phạm vi cung cấp	Hằng số AdSize
320x50	Biểu ngữ chuẩn	Điện thoại và máy tính bảng	BANNER
320x100	Biểu ngữ lớn	Điện thoại và máy tính bảng	LARGE_BANNER
300x250	Hình chữ nhật Trung bình IAB	Điện thoại và máy tính bảng	MEDIUM_RECTANGLE
468x60	Biểu ngữ kích thước đầy đủ theo IAB	Máy tính bảng	FULL_BANNER
728x90	Hình chữ nhật dài IAB	Máy tính bảng	LEADERBOARD
Chiều rộng đã cung cấp x Chiều cao thích ứng	Biểu ngữ thích ứng	Điện thoại và máy tính bảng	Không áp dụng
Chiều rộng màn hình x 32|50|90	Biểu ngữ thông minh	Điện thoại và máy tính bảng	SMART_BANNER
Tìm hiểu thêm về Biểu ngữ thích ứng, nhằm thay thế Biểu ngữ thông minh.

Lưu ý: Nếu ứng dụng Android cố gắng tải một biểu ngữ quá lớn so với bố cục của ứng dụng, thì SDK sẽ không hiển thị biểu ngữ đó mà sẽ ghi lại thông báo lỗi.

Sự kiện ứng dụng

Sự kiện ứng dụng cho phép bạn tạo những quảng cáo có thể gửi tin nhắn đến mã ứng dụng của sự kiện đó. Ứng dụng thì có thể hành động dựa trên các tin nhắn này.

Bạn có thể theo dõi các sự kiện ứng dụng cụ thể của Ad Manager bằng cách sử dụng AppEvent. Những sự kiện này có thể xảy ra bất cứ lúc nào trong vòng đời của quảng cáo, ngay cả trước khi hệ thống gọi lệnh tải.

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 được kích hoạt khi một sự kiện ứng dụng xảy ra trong quảng cáo. Dưới đây là một ví dụ về cách xử lý sự kiện này trong mã của bạn:

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

Dưới đây là ví dụ minh hoạ cách thay đổi màu nền của ứng dụng tuỳ thuộc vào sự kiện ứng dụng kèm theo tên màu:

_bannerview.OnAppEventReceived += (AppEvent args) =>
{
  if (args.Name == "color")
  {
    Color color;
    if (ColorUtility.TryParseColor(arg.Value, out color))
    {
      gameObject.GetComponent<Renderer>().material.color = color;
    }
  }
};

Đây là mẫu quảng cáo tương ứng sẽ gửi sự kiện ứng dụng màu:

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

Tài nguyên khác

• Ví dụ về HelloWorld: Cách triển khai tối giản cho tất cả định dạng quảng cáo.