Sunday, 5 June 2016

Post 53: Add AdMob to your ionic project

Add this plugin:

cordova plugin add cordova-plugin-admobpro

create another JS file with this content and put it into the JS folder (replace the key with your keys):
var admobid = {};
// TODO: replace the following ad units with your own
if( /(android)/i.test(navigator.userAgent) ) {
admobid = { // for Android
banner: 'ca-app-pub-6869992474017983/9375997553',
interstitial: 'ca-app-pub-6869992474017983/1657046752'
};
} else if(/(ipod|iphone|ipad)/i.test(navigator.userAgent)) {
admobid = { // for iOS
banner: 'ca-app-pub-6869992474017983/4806197152',
interstitial: 'ca-app-pub-6869992474017983/7563979554'
};
} else {
admobid = { // for Windows Phone
banner: 'ca-app-pub-6869992474017983/8878394753',
interstitial: 'ca-app-pub-6869992474017983/1355127956'
};
}
function initApp() {
if (! AdMob ) { alert( 'admob plugin not ready' ); return; }
// this will create a banner on startup
AdMob.createBanner( {
adId: admobid.banner,
position: AdMob.AD_POSITION.BOTTOM_CENTER,
isTesting: true, // TODO: remove this line when release
overlap: false,
offsetTopBar: false,
bgColor: 'black'
} );
// this will load a full screen ad on startup
AdMob.prepareInterstitial({
adId: admobid.interstitial,
isTesting: true, // TODO: remove this line when release
autoShow: false
});
AdMob.showInterstitial(); // can be used to show later,e.g. after the end of the game
}
if(( /(ipad|iphone|ipod|android|windows phone)/i.test(navigator.userAgent) )) {
document.addEventListener('deviceready', initApp, false);
} else {
initApp();
}
Now go to your index.html file and add a reference to that JS file above:
    <script type="text/javascript" src="js/myAdmobFile.js"></script>

Tweet