CordovaでAdMob Pro(広告)をインストールして使う方法について紹介します。
## AdMob登録の流れ
①AdMobの登録を行います。
②AdMobのトップページを開きます。
③「新しいアプリを収益化」をクリックします。
④アプリの状況によって以下の操作を行います。
状況 | 操作 |
---|---|
アプリ公開済の場合 | キーワードを入力してアプリを検索します。 |
アプリ未公開の場合 | 「アプリを手動で追加」でアプリ名を入力しプラットフォーム」は「Android」を選択して「アプリを追加」をクリックします。 |
⑤「バナー」もしくは「インタースティンシャル」を選択します。(広告タイプなどを設定)
⑥「保存」をクリックします。
⑦「完了」をクリックします。
⑧下記のような広告ユニットのIDをコピーします。
ca-app-pub-xxxxxxxxxxxxxxx/xxxxxxxxxx
⑨コマンドプロンプトを開きます。
⑩プロジェクトフォルダに移動します。
⑪以下のコマンドを入力し、Enterキーを押します。(AdMobプラグインをDL)
cordova plugin add cordova-plugin-admobpro
⑫プロジェクト名\www\jsフォルダにあるJSファイル(index.jsなど)を開きます。
⑬以下のコード(広告表示用)を追加します。
/*** これ以上は省略 ***/ onDeviceReady: function() { this.receivedEvent('deviceready'); onDeviceReady: function() { app.receivedEvent('deviceready'); //Admobの広告バナー表示コード AdMob.createBanner({ adId:'ca-app-pub-xxxxxxxxxxxxxxx/xxxxxxxxxx', position:AdMob.AD_POSITION.BOTTOM_CENTER, overlap: true, autoShow:true }); }, },
※広告ユニットIDの部分に先程コピーしたIDをいれます。
リリース前の動作テストをする場合は、下記のサンプル広告コードを利用します。
// Admobサンプル広告バナーコード AdMob.createBanner({ adId:'ca-app-pub-3940256099942544/6300978111', position:AdMob.AD_POSITION.BOTTOM_CENTER, overlap: true, autoShow:true });
⑭これで広告が表示されます。
⑮あと再度アプリをapkに変換し、GooglePlayにアップロードします。
– | 関連記事 |
---|---|
① | 【Cordova入門】Android向けハイブリッドアプリ開発 |
② | Javascript入門 サンプル集 |
③ | Java入門 |
④ | Node.js入門 |
コメント