Asial Blog

Recruit! Asialで一緒に働きませんか?

Monacaアプリに広告SDKを入れてみよう(mMedia編)

カテゴリ :
Monaca
タグ :
JavaScript
広告

前回のAdMobに続いて今回はmMediaを使ってみたいと思います。こちらは公式に提供されている訳ではありませんが、コミュニティベースでmMedia用のプラグインが作られています。



プラグインのインストール



プラグインをインストールするので、floatinghotpot/cordova-plugin-mmediaのサイトからZipファイルとしてダウンロードします。そして、そのZipファイルをMonaca IDEの設定メニュー>Cordovaプラグインの管理からアップロードします。



プラグインアップロード



アップロード後の一覧



mMediaのユーザ登録と広告作成



mMediaのユーザ登録はとても簡単にできます。そして、それが終わったらアプリを作成します。



mMediaの管理画面



アプリを作成した後は、広告枠の設定を行います。用意されているのはバナーとインターティシャル広告になります。IDが生成されますので、それをコピーします。



Monacaアプリの修正



JavaScriptから呼び出す部分は次のようになります。



  1. var ad_units = {
  2.     ios : {
  3.         banner : "217477",
  4.         interstitial : "217478"
  5.     },
  6.     android : {
  7.         banner : "177367",
  8.         interstitial : "177369"
  9.     }
  10. };
  11.  
  12. var adid = ( /(android)/i.test(navigator.userAgent) ) ? ad_units.android : ad_units.ios;
  13.  
  14. if(mMedia) mMedia.createBanner({adId:adid.banner, autoShow:true});

バナー(banner)とインターティシャル(interstitial)のIDをそれぞれ入力してください。Android、iOSで出し分けされるのでそれぞれ用意します。後はバナーを表示する場合には mMedia.createBanner を実行すればOKです。



アプリのビルド



プラグインを使っていますので、試すのは実機のみになります。そのためビルドして確認するようにしてください。以下はプラグイン配布サイトからのスクリーンショットです。iPhone/iPad/Androidに対応しています。



広告表示例






アプリの収益化を考える上で広告の表示は大事な選択肢になるはずです。特にグローバルにアプリを提供する際には海外のパブリッシャーを選択する必要があるのではないでしょうか。ぜひお試しください。



floatinghotpot/cordova-plugin-mmedia