ネイティブ スタイルの設定を使用すると、Google アド マネージャーで指定したネイティブ スタイルに基づいてネイティブ広告のレンダリングが処理されます。まず、サイズとターゲティングを指定します。そのうえで、HTML、CSS、JavaScript を追加して、あらゆる画面で適切に表示されるレスポンシブな広告を定義します。アド マネージャーでは、レンダリングの処理を行わなくても、配信先に適したネイティブ スタイルが自動的に適用されます。ネイティブ スタイルは、バナー広告と同じように AdManagerAdView
を使用して実装します。事前に決定される固定の広告サイズか、実行時に決定される Fluid 広告サイズのネイティブ スタイルを使用できます。
前提条件
- Google Mobile Ads Flutter プラグイン バージョン 0.13.6 以降
このガイドは、Google Mobile Ads SDK に関する実践的な知識がある方を対象としています。そうでない場合は、事前にスタートガイドをご確認いただくことをおすすめします。
固定サイズ
固定サイズのネイティブ スタイルを使用すると、ネイティブ広告の幅と高さを制御できます。固定サイズを設定する手順は次のとおりです。
アド マネージャーの管理画面で広告申込情報を作成し、
Size
フィールドのプルダウンから定義済みサイズのいずれかを選択します。ステップ 1 で設定したサイズで
AdManagerBannerAd
を読み込みます。広告をインスタンス化して読み込む方法については、バナー広告に関するドキュメントをご覧ください。サイズおよび対応するAdSize
定数のリストについては、バナーサイズのセクションをご覧ください。
MEDIUM_RECTANGLE
(300x250)広告サイズなどの固定サイズを指定する方法の例を次に示します。
AdManagerBannerAd ad = AdManagerBannerAd(
adUnitId: '<your-ad-unit>',
sizes: <AdSize>[AdSize.mediumRectangle],
request: AdManagerAdRequest(),
);
Fluid サイズ
場合によっては、固定サイズが適さないことがあります。たとえば、広告の幅はアプリのコンテンツと同じサイズにして、高さは広告のコンテンツに合わせて動的に調整する場合などです。このようなケースに対処するには、アド マネージャーの管理画面で広告サイズとして Fluid
を指定し、アプリの実行時に広告のサイズが決定されるようにします。SDK には、このケースを処理するための特別な AdSize
定数である FLUID
が用意されています。
Fluid 広告サイズの高さは、パブリッシャーが定義した幅に基づいて動的に決定されるため、プラットフォームの広告ビューの高さはクリエイティブの高さに合わせて調整されます。
Fluid リクエスト
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();
},
),
Fluid 広告を表示する
広告が読み込まれたら、FluidAdWidget
を使用して Fluid 広告を表示します。高さは、基盤となるプラットフォームの広告ビューに合わせて調整されます。
FluidAdWidget(
width: <your-width>,
ad: fluidAd,
);
アド マネージャーの Fluid 広告サイズの実装例については、GitHub のサンプルアプリをご覧ください。