I have recently implemented Google Ads for Mobile Application using AdMob by Google in cordova. Google gives nice doc about Google Ads implementations. I will explain you how to integrate google-ads using AdMobPro plugin.
Admob portal setup Instructions:
Step 1: Singup and Create App
Go to Admob login page and create an account. Click on Monetize new app button, Under Monitize a new app click Add Your App Manually. Refer the below screenshot.
Note: There are two types of Ad format available – Banner and interstitial (Pop-up ad). Select banner, name it and submit the information, If you prefer Pop-up Ads, click new ad unit button on the same page.
Step 2: Create New Ad Unit
Step 3: Create New Interstitial Ad
Fill in the unit name and no of times the pop-up to be shown per minute
It will now list the banner unit-id and interstitial unit-id, as in the screenshot below.
We are now done with the AdMob set-up instructions.
Note: Suppose we need to block some Ads or allow particular ads, click the Allow & block ads tab it will show the option for us.
Cordova plugin Implementation
Next, we will be implementing the google ads for Cordova application.
Steps to integrate:
1. Go to Application root folder.
2. Execute command : Cordova plugin add cordova-plugin-admobpro
3. Create the js file called admob.js and add the ad Unit id for our banner id and interstitial id given in the AdMob portal.
The above code will display a banner ad in the bottom of the mobile screen, It also provides a different method for the banner ads and api’s.
There are apis to display pop-up ads in full screen, Refer above code, also refer this link API methods for other api methods.
Include admob.js in the application.
To remove or hide the ads from other pages use: Admob.removeBanner or Admob.hideBanner .
After implementing this, It will show the Banner Ads at the bottom of the screen and Pop-up ads . Refer below screenshot.
Thanks for reading my blog, Share if you find this useful.