自訂原生廣告格式

自訂原生廣告格式

除了系統定義的原生格式外，Ad Manager 發布商還可以選擇透過定義素材資源的自訂清單，自行建立原生廣告格式。這些稱為自訂原生廣告格式，可搭配預留廣告使用。這可讓發布商將任意結構化資料傳遞至應用程式。這些廣告由 NativeCustomFormatAd 物件代表。

載入自訂原生廣告格式

本指南說明如何載入及顯示自訂原生廣告格式。

建構 AdLoader

如同原生廣告，您可以使用 AdLoader 類別載入自訂原生廣告格式：

Java

AdLoader adLoader = new AdLoader.Builder(context, "/21775744923/example/native")
    .forCustomFormatAd("10063170",
      new NativeCustomFormatAd.OnCustomFormatAdLoadedListener() {
          @Override
          public void onCustomFormatAdLoaded(NativeCustomFormatAd ad) {
              // Show the custom format and record an impression.
          }
      },
      new NativeCustomFormatAd.OnCustomClickListener() {
          @Override
          public void onCustomClick(NativeCustomFormatAd ad, String s) {
              // Handle the click action
          }
      })
    .withAdListener( ... )
    .withNativeAdOptions( ... )
    .build();

Kotlin

val adLoader = AdLoader.Builder(this, "/21775744923/example/native")
        .forCustomFormatAd("10063170",
            { ad ->
                // Show the custom format and record an impression.
            },
            { ad, s ->
            // Handle the click action
            })
        .withAdListener( ... )
        .withNativeAdOptions( ... )
        .build()

forCustomFormatAd 方法會設定 AdLoader，以便要求自訂原生廣告格式。有三個參數會傳遞至該方法：

  • AdLoader 應要求的自訂原生廣告格式 ID。每個自訂原生廣告格式都有一個相關聯的 ID。這個參數會指出應用程式希望 AdLoader 要求哪種格式。
  • 廣告載入成功時要叫用的 OnCustomFormatAdLoadedListener。
  • 使用者輕觸或點按廣告時要叫用的選用 OnCustomClickListener。如要進一步瞭解這個事件監聽器，請參閱下方的「處理點擊和曝光」一節。

由於單一廣告單元可設定為放送多種廣告素材格式，因此可多次呼叫 forCustomFormatAd，並使用不重複的格式 ID 為多種可能的自訂原生廣告格式準備廣告載入器。

自訂原生廣告格式 ID

您可以在 Ad Manager 使用者介面中找到用於識別自訂原生廣告格式的格式 ID，位於「Delivery」下拉式選單中的「Native」專區：

每個自訂原生廣告格式 ID 都會顯示在名稱旁邊。按一下其中一個名稱，就會看到顯示格式欄位相關資訊的詳細資料畫面：

您可以在這裡新增、編輯及移除個別欄位。請記下每項資產的名稱。名稱是顯示自訂原生廣告格式時，用來取得每個素材資源的資料的鍵。

顯示自訂原生廣告格式

自訂原生廣告格式與系統定義的廣告格式不同，因為發布商可以自行定義廣告的素材資源清單。因此，顯示這類格式的程序與系統定義的格式有幾個不同之處：

  1. 由於 NativeCustomFormatAd 類別旨在處理您在 Ad Manager 中定義的任何自訂原生廣告格式，因此沒有命名為「getter」的素材資源。而是提供 getText 和 getImage 等方法，這些方法會將欄位名稱做為參數。
  2. 沒有像 NativeAdView 這樣的專用廣告檢視畫面類別可搭配 NativeCustomFormatAd 使用。您可以自由使用任何對使用者體驗有意義的版面配置。
  3. 由於沒有專屬的 ViewGroup 類別，因此您不需要登錄用來顯示廣告素材資源的任何檢視畫面。這樣一來，您在顯示廣告時就能省下幾行程式碼，但也代表您之後需要額外處理點擊。

以下是顯示 NativeCustomFormatAd 的範例函式：

Java

public void displayCustomFormatAd (ViewGroup parent,
                                     NativeCustomFormatAd customFormatAd) {
    // Inflate a layout and add it to the parent ViewGroup.
    LayoutInflater inflater = (LayoutInflater) parent.getContext()
            .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    View adView = inflater.inflate(R.layout.custom_format_ad, parent);

    // Locate the TextView that will hold the value for "Headline" and
    // set its text.
    TextView myHeadlineView = (TextView) adView.findViewById(R.id.headline);
    myHeadlineView.setText(customFormatAd.getText("Headline"));

    // Locate the ImageView that will hold the value for "MainImage" and
    // set its drawable.
    Button myMainImageView = (ImageView) adView.findViewById(R.id.main_image);
    myMainImageView.setImageDrawable(
            customFormatAd.getImage("MainImage").getDrawable());

    ...
    // Continue locating views and displaying assets until finished.
    ...
}

Kotlin

public fun displayCustomFormatAd (parent: ViewGroup,
                                customFormatAd: NativeCustomFormatAd) {
    val adView = layoutInflater
            .inflate(R.layout.ad_simple_custom_format, null)

    val myHeadlineView = adView.findViewById<TextView>(R.id.headline)
    myHeadlineView.setText(customFormatAd.getText("Headline"));

    // Locate the ImageView that will hold the value for "MainImage" and
    // set its drawable.
    val myMainImageView = adView.findViewById(R.id.main_image);
    myMainImageView.setImageDrawable(
            customFormatAd.getImage("MainImage").drawable);

    ...
    // Continue locating views and displaying assets until finished.
    ...
}

顯示 AdChoices 圖示

為遵循《數位服務法》(DSA) 規定，在歐洲經濟區 (EEA) 放送的預訂廣告必須包含 AdChoices 圖示和 Google 的「關於這則廣告」頁面連結。導入自訂原生廣告時，您需負責顯示 AdChoices 圖示。顯示主要廣告素材資源時，建議您採取步驟來顯示及設定 AdChoices 圖示的點擊事件監聽器。

以下範例假設您已在檢視區塊階層中定義 <ImageView /> 元素來存放 AdChoices 標誌。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android">
    <ImageView
        android:id="@+id/adChoices"
        android:layout_width="15dp"
        android:layout_height="15dp"
        android:adjustViewBounds="true"
        android:contentDescription="AdChoices icon." />
</LinearLayout>

以下範例會算繪 AdChoices 圖示，並設定適當的點擊行為。

Java

private AdSimpleCustomTemplateBinding customTemplateBinding;

private void populateAdView(final NativeCustomFormatAd nativeCustomFormatAd) {
  // Render the AdChoices icon.
  String adChoicesKey = NativeAdAssetNames.ASSET_ADCHOICES_CONTAINER_VIEW;
  NativeAd.Image adChoicesAsset = nativeCustomFormatAd.getImage(adChoicesKey);
  if (adChoicesAsset == null) {
    customTemplateBinding.adChoices.setVisibility(View.GONE);
  } else {
    customTemplateBinding.adChoices.setVisibility(View.VISIBLE);
    customTemplateBinding.adChoices.setImageDrawable(adChoicesAsset.getDrawable());

    // Enable clicks on AdChoices.
    customTemplateBinding.adChoices.setOnClickListener(
        new View.OnClickListener() {
          @Override
          public void onClick(View v) {
            nativeCustomFormatAd.performClick(adChoicesKey);
          }
        });
  }
  ...
}

Kotlin

private lateinit var customTemplateBinding: AdSimpleCustomTemplateBinding

private fun populateAdView(nativeCustomFormatAd: NativeCustomFormatAd) {
  // Render the AdChoices icon.
  val adChoicesKey = NativeAdAssetNames.ASSET_ADCHOICES_CONTAINER_VIEW
  val adChoicesAsset = nativeCustomFormatAd.getImage(adChoicesKey)
  if (adChoicesAsset == null) {
    customTemplateBinding.adChoices.visibility = View.GONE
  } else {
    customTemplateBinding.adChoices.setImageDrawable(adChoicesAsset.drawable)
    customTemplateBinding.adChoices.visibility = View.VISIBLE

    // Enable clicks on AdChoices.
    customTemplateBinding.adChoices.setOnClickListener {
      nativeCustomFormatAd.performClick(adChoicesKey)
    }
  }
  ...
}

自訂原生廣告格式的原生影片

建立自訂格式時，您可以選擇是否讓格式符合影片資格。

在應用程式實作中，您可以使用 NativeCustomFormatAd.getMediaContent() 取得媒體內容。接著呼叫 setMediaContent()，將媒體內容設為媒體檢視區塊。如果廣告不包含影片內容，請制定替代計劃，在沒有影片的情況下顯示廣告。

以下範例會檢查廣告是否含有影片內容，並在無法觀看影片時顯示圖片：

Java

// Called when a custom native ad loads.
@Override
public void onCustomFormatAdLoaded(final NativeCustomFormatAd ad) {

  MediaContent mediaContent = ad.getMediaContent();

  // Assumes you have a FrameLayout in your view hierarchy with the id media_placeholder.
  FrameLayout mediaPlaceholder = (FrameLayout) findViewById(R.id.media_placeholder);

  // Apps can check the MediaContent's hasVideoContent property to determine if the
  // NativeCustomFormatAd has a video asset.
  if (mediaContent != null && mediaContent.hasVideoContent()) {
    MediaView mediaView = new MediaView(mediaPlaceholder.getContext());
    mediaView.setMediaContent(mediaContent);
    mediaPlaceholder.addView(mediaView);

    // Create a new VideoLifecycleCallbacks object and pass it to the VideoController. The
    // VideoController will call methods on this object when events occur in the video
    // lifecycle.
    VideoController vc = mediaContent.getVideoController();
    vc.setVideoLifecycleCallbacks(
        new VideoController.VideoLifecycleCallbacks() {
          @Override
          public void onVideoEnd() {
            // Publishers should allow native ads to complete video playback before
            // refreshing or replacing them with another ad in the same UI location.
            super.onVideoEnd();
          }
        });
  } else {
    ImageView mainImage = new ImageView(this);
    mainImage.setAdjustViewBounds(true);
    mainImage.setImageDrawable(ad.getImage("MainImage").getDrawable());
    mediaPlaceholder.addView(mainImage);
    mainImage.setOnClickListener(
        new View.OnClickListener() {
          @Override
          public void onClick(View view) {
            ad.performClick("MainImage");
          }
        });
  }
}

Kotlin

// Called when a custom native ad loads.
NativeCustomFormatAd.OnCustomFormatAdLoadedListener { ad ->

  val mediaContent = ad.mediaContent

  // Apps can check the MediaContent's hasVideoContent property to determine if the
  // NativeCustomFormatAd has a video asset.
  if (mediaContent != null && mediaContent.hasVideoContent()) {
    val mediaView = MediaView(mediaPlaceholder.getContest())
    mediaView.mediaContent = mediaContent

    val videoController = mediaContent.videoController

    // Create a new VideoLifecycleCallbacks object and pass it to the VideoController. The
    // VideoController will call methods on this object when events occur in the video
    // lifecycle.
    if (videoController != null) {
      videoController.videoLifecycleCallbacks =
        object : VideoController.VideoLifecycleCallbacks() {
          override fun onVideoEnd() {
            // Publishers should allow native ads to complete video playback before refreshing
            // or replacing them with another ad in the same UI location.
            super.onVideoEnd()
          }
        }
    }
  } else {
    val mainImage = ImageView(this)
    mainImage.adjustViewBounds = true
    mainImage.setImageDrawable(ad.getImage("MainImage")?.drawable)

    mainImage.setOnClickListener { ad.performClick("MainImage") }
    customTemplateBinding.simplecustomMediaPlaceholder.addView(mainImage)
  }
}

如要進一步瞭解如何自訂自訂原生廣告的影片體驗，請參閱「MediaContent」。

下載 Ad Manager 自訂顯示範例，瞭解原生影片的實際運作範例。

自訂原生廣告格式的點擊和曝光

使用自訂原生廣告格式時，應用程式會負責記錄曝光，並將點擊事件回報給 Google Mobile Ads SDK。

記錄曝光

如要記錄自訂格式廣告的曝光次數，請在對應的 NativeCustomFormatAd 上呼叫 recordImpression 方法：

myCustomFormatAd.recordImpression();

如果應用程式不小心對同一個廣告呼叫方法兩次，SDK 會自動避免為單一請求記錄重複曝光。

回報點擊

如要向 SDK 回報資產檢視畫面發生點擊事件，請在對應的 NativeCustomFormatAd 上呼叫 performClick 方法，並傳入點選的資產名稱。舉例來說，如果您有自訂格式資產「MainImage」，且想要回報與該資產相對應的 ImageView 點擊次數，程式碼會如下所示：

myCustomFormatAd.performClick("MainImage");

請注意，您不需要為與廣告相關聯的每個檢視畫面都呼叫此方法。如果您有另一個名為「Caption」的欄位，且該欄位是用於顯示，但使用者不會點選或輕觸，則應用程式就不需要為該資產的檢視畫面呼叫 performClick。

回應自訂點擊動作

當使用者點選自訂格式廣告時，SDK 可能會依序嘗試下列三種回應：

  1. 從 AdLoader 叫用 OnCustomClickListener (如果有提供的話)。
  2. 針對每個廣告的深層連結網址，嘗試找出內容解析器，並啟動第一個解析器。
  3. 開啟瀏覽器，瀏覽至廣告傳統的到達網頁網址。

forCustomFormatAd 方法接受 OnCustomClickListener。如果傳入事件監聽器物件，SDK 會改為叫用其 onCustomClick 方法，且不會採取進一步動作。不過，如果您將空值做為事件監聽器傳遞，SDK 就會改回使用向廣告註冊的深層連結和/或到達網頁網址。

自訂點擊事件監聽器可讓應用程式決定如何回應點擊事件，例如更新 UI、啟動新活動，或僅記錄點擊事件。以下是只記錄點擊事件的範例：

Java

AdLoader adLoader = new AdLoader.Builder(context, "/21775744923/example/native")
    .forCustomFormatAd("10063170",
      new NativeCustomFormatAd.OnCustomFormatAdLoadedListener() {
        // Display the ad.
      },
      new NativeCustomFormatAd.OnCustomClickListener() {
          @Override
          public void onCustomClick(NativeCustomFormatAd ad, String assetName) {
            Log.i("MyApp", "A custom click just happened for " + assetName + "!");
          }
      }).build();

Kotlin

val adLoader = AdLoader.Builder(this, "/21775744923/example/native")
    .forCustomFormatAd("10063170",
        { ad ->
            // Display the ad.
        },
        { ad, assetName ->
                Log.i("MyApp", "A custom click just happened for $assetName!")
    }).build()

一開始，您可能會覺得自訂點擊事件監聽器很奇怪。畢竟您的應用程式只是告訴 SDK 發生了點擊，為何 SDK 要反過來向應用程式回報這項資訊？

這項資訊流程相當實用，原因有幾個，但最重要的是，這可讓 SDK 持續控管對點擊的回應。例如，它可以自動對為廣告素材設定的第三方追蹤網址進行封包傳送，並在幕後處理其他工作，完全不需要任何額外程式碼。