広告 アプリ (AdMob)
この記事では、MonacaでAdMobを使 用してアプリに広告を表示する方法について説明します。
AdMobは、Googleによる広告サービスであり、Googleアカウントがあれば簡単に導入することができます。この記事を読むことで、AdMobを導入し、アプリに広告を表示することができるようになります。
解説するためのサンプルコードは、次のURLに配置しています。
この申請時に、アプリのIDが発行されますので、IDをコピーしておきます。 （ID 例：ca-app-pub-3089782807744052~xxxxxxxx）
申請が承認されると、広告IDが発行されます。このIDを表示する際に利用しますので、こちらも控えておきます。
なお、広告が表示されるまでに承認が必要となるため、開発中はGoogleが提供するテスト用広告を利用することをお勧めします。
次のプラグインをインストールしてください。
admob-plus-cordova
プラグインをインストール後、プラグインの設定画面で「APP_ID_ANDROID」を設定します。 この値は、AdMobで取得したアプリIDを指定します。これはAndroid向けの設定です。
また、iOS向けには、「APP_ID_IOS」の値を設定する必要があります。
次のコードはアプリ起動時に表示される広告を実行しています。
show( ) を実行したタイミングで広告が表示されます。
// アプリ起動時に表示される広告を表示
const ad = new admob.AppOpenAd({
adUnitId: 'ca-app-pub-3940256099942544/3419835294',
})
await ad.load()
await ad.show()
アプリの下にバナー広告を表示するには、次のコードのように「
admob.BannerAd」のオブジェクトを生成します。広告は、show( ) にて表示させます。// バナー広告を表示
const banner = new admob.BannerAd({
adUnitId: 'ca-app-pub-3940256099942544/6300978111',
position: 'bottom',
})
await banner.show()
AdMobに申請した直後や、開発中はバナーが表示されません。
広告フォーマット | デモ広告ユニットID |
|---|---|
アプリ起動 | ca-app-pub-3940256099942544/5662855259 |
バナー | ca-app-pub-3940256099942544/2934735716 |
インタースティシャル | ca-app-pub-3940256099942544/4411468910 |
インタースティシャル動画 | ca-app-pub-3940256099942544/5135589807 |
リワード | ca-app-pub-3940256099942544/1712485313 |
最終更新 3d ago