原生樣式

選取平台: Android iOS Flutter

透過原生樣式設定,Google Ad Manager 能依照您在產品中指定的樣式,自動呈現原生廣告。您只需先設定好廣告大小和目標對象,再加入 HTML、CSS 和 JavaScript 定義程式碼,就能打造出在各種螢幕上出色呈現的回應式廣告。您無需自行設定廣告的顯示方式,Ad Manager 會自動根據放送位置套用合適的原生樣式。原生樣式和橫幅廣告一樣是用 AdManagerAdView 導入,可以使用預先設定的固定廣告大小,也可以採用在執行階段動態調整的彈性大小。

必備條件

  • Google Mobile Ads Flutter 外掛程式 0.13.6 以上版本

本指南假設您對 Google Mobile Ads SDK 已有基本瞭解。如果您還不熟悉這個 SDK,建議先參閱「開始使用」指南。

固定大小

採用固定大小的原生樣式時,您可以控制廣告的寬度和高度。如要設定固定大小,請按照下列步驟操作:

  1. 在 Ad Manager 使用者介面中建立委刊項,然後從 Size 欄位下拉式選單中選取一個預先定義的大小。

  2. 載入符合步驟 1 所設大小的 AdManagerBannerAd。如要瞭解如何例項化及載入廣告,請參閱「橫幅廣告」說明文件。在「橫幅大小」一節,您可以查看各種大小和對應的 AdSize 常數。

以下示範如何指定固定大小,例如 MEDIUM_RECTANGLE (300x250) 廣告大小:

AdManagerBannerAd ad = AdManagerBannerAd(
  adUnitId: '<your-ad-unit>',
  sizes: <AdSize>[AdSize.mediumRectangle],
  request: AdManagerAdRequest(),
);

自動調整大小

有時候,固定大小的廣告可能不太適用。舉例來說,您可能希望廣告寬度與應用程式內容一致,但高度能依廣告內容動態調整。如有這種需求,您可以在 Ad Manager 使用者介面中將廣告大小設為 Fluid,代表廣告大小會在應用程式執行階段決定。SDK 提供特殊的 AdSize 常數 FLUID,專門用於處理這種情況。自動調整大小的廣告會根據發布商設定的寬度動態調整,讓平台廣告檢視區塊的高度與廣告素材一致。

自動調整請求

FluidAdManagerBannerAd 可用於請求自動調整廣告:

final fluidAd = FluidAdManagerBannerAd(
  adUnitId: '<your-ad-unit>',
  request: AdManagerAdRequest(),
  listener: AdManagerBannerAdListener(
    onAdLoaded: (Ad ad) {
      print('$_fluidAd loaded.');
    },
    onAdFailedToLoad: (Ad ad, LoadAdError error) {
      print('$_fluidAd failedToLoad: $error');
      ad.dispose();
    },
  ),

顯示自動調整廣告

廣告載入後,可使用 FluidAdWidget 來顯示自動調整廣告。這類廣告會配合所在平台的廣告檢視區塊,自動調整高度:

FluidAdWidget(
  width: <your-width>,
  ad: fluidAd,
);

如需導入 Ad Manager 自動調整廣告的例子,請參考 GitHub 的範例應用程式。