Search code examples
javascriptionic-frameworkadmobcordova-admob

How to implement Admob into Ionic?


I followed the instructions of this post: AdMob not loading ads in ionic/angular app

When I run the app via "ionic build ios && ionic emulate ios" I get no ads, no black bar nothing.

What did I miss?

Thanks


Solution

  • You can follow the instructions at https://github.com/appfeel/admob-google-cordova/wiki/Angular.js,-Ionic-apps:

    • Install the plugin as usual (see here):

      ionic plugin add cordova-admob
      
    • Include the following script in your index.html (just it, no need to copy any file: the plugin is in charge to copy the script when the app is prepared):

      <script src="lib/angular-admob/angular-admob.js"></script>
      
    • Call AdMob from your Ionic app.

    Here is a quick example:

    var app = angular.module('myApp', ['admobModule']);
    
    app.config(['admobSvcProvider', function (admobSvcProvider) {
      // Optionally you can configure the options here:
      admobSvcProvider.setOptions({
        publisherId:          "ca-app-pub-XXXXXXXXXXXXXXXX/BBBBBBBBBB",  // Required
        interstitialAdId:     "ca-app-pub-XXXXXXXXXXXXXXXX/IIIIIIIIII",  // Optional
      });
    }]);
    
    
    app.run(['admobSvc', function (admobSvc) {
      // Also you could configure the options here (or in any controller):
      // admobSvcProvider.setOptions({ ... });
    
      admobSvc.createBannerView();
      // You could also call admobSvc.createBannerView(options);
    
    
      // Handle events:
      $rootScope.$on(admobSvc.events.onAdOpened, function onAdOpened(evt, e) {
        console.log('adOpened: type of ad:' + e.adType);
      });
    }]);