Skip to content

00. How To Use with PhoneGap Build

Jump to bottom
Raymond Xie edited this page Nov 17, 2015 · 14 revisions

Plugin can be used by configuring the plugin in the config.xml (for every app build with phonegap build service, you need have a config.xml in your root folder)

According to Cordova team announcement, the cordova registry is deprecated, and all plugins are moved to npm, and renamed as "cordova-plugin-xxx".

In your config.xml:

<gap:plugin name="cordova-plugin-admob" source="npm" />

Or,

<preference name="android-build-tool" value="gradle" /> 
<gap:plugin name="cordova-plugin-admobpro" source="npm" />

Which Plugin ID to Use?

Be aware that, there is some slight difference between the two plugins:

  • cordova-plugin-admobpro, it use default jar in your android SDK, and requires gradle to build android apk. See its plugin.xml:
<framework src="com.google.android.gms:play-services-ads:+" />
  • cordova-plugin-admob, it depends on a plugin contains google-play-services.jar, which can be used with those tools using ant instead of gradle. See its plugin.xml:
<dependency id="cordova-plugin-googleplayservices"/>

Does PhoneGap Build Support Gradle?

Please check news from PhoneGap Build from their twitter page: https://twitter.com/PhoneGapBuild

  • 2015/9/29: Android builds using PhoneGap 4+ are now using gradle on @phonegapbuild! View the blog at http://phonegap.com/blog/2015/09/28/android-using-gradle … for more info and caveats!

  • 2015/9/30: Having some issues with the new Android gradle builds! We've reverted to build with ant by default again. Sorry for the hassle.

  • 2015/9/30: @PhoneGapBuild Will update once the gradle issues are sorted.

Example

See full config.xml: https://github.com/floatinghotpot/phonegap-admob-demo/blob/master/config.xml

Then you can call AdMob plugin in your javascript code (after deviceready event fired)

Your index.html:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Hello</title>
<script type="text/javascript" src="cordova.js"></script>
</head>
<body>
<h1>Hello AdMob</h1>
</body>
<script>
var admobid = {};
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) {
        AdMob.createBanner({
            adId : admobid.banner,
            position : AdMob.AD_POSITION.BOTTOM_CENTER,
            autoShow : true
        });
    }
}

document.addEventListener('deviceready', initApp, false);
</script>
</html>

See the More Code

Build APP with PhoneGap Build

Put your code on github, add app in PhoneGap Build with source from github.

Here is a simple demo project for phonegap build (with index.html and config.xml): https://github.com/floatinghotpot/phonegap-admob-demo

Build and get your app package, if build pass.

PhoneGapBuild

Clone this wiki locally