How to add Admob to Cocos2d-x 3.7 JS

Welcome

I had google a lot tutorial about how to use AdMob with your Cocos2D-X 3.7 which are the version Cocos2d-JS is merged into Cocos2d-x, we are going to use Plugin-x to easily integrate with banner ads. The only nearest tutorial I can get is this which is Jan/2015 using Cocos 3.0. So I refer it and modify to 3.7.

Let’s take a look!

Tools Version Used :

Windows : 8.1 64bits

Android : 4.4W

Android SDK : adt-bundle-windows-x86_64-20140702 (android-20 only

NDK : android-ndk-r10e(64-bits) or NDK home

ANT : apache-ant-1.9.6
JDK : JDK1.7.0_55

Cocos : cocos2d-x-3.7 (Download from Cocos Site, not from Cocos Shop)

CocosForWin : v2.3.1.1
Cocos Code IDE : 2.0.0-beta

Python : 2.7.10

CgyWin : cygwin-setup-x86.exe must with Devel - MAKE

Cocos Code IDE Setting page

Cocos Setting

Cocos Framework Setting

New Cocos JS Project

Name it

Add Native Codes Support

SDK Manager
Go to adt-bundle-windows-x86_64-20140702/SDK Manager.exe download Google Play Services

Files / Folders we deal with ...
1. Frameworks \ Cocos2d-x
2. Frameworks \ runtime-src
3. Src \ app.js

1. Frameworks \ Cocos2d-x
Because I only install android-20 (API20) 4.4W, so I have to change the Admob plugin target to android-20. If you are downloading full android SDK, just ignore this.

frameworks/cocos2d-x/plugin/protocols/proj.android/
project.properties
frameworks/cocos2d-x/plugin/plugins/admob/proj.android/
project.properties


Open Cygwin cd frameworks/cocos2d-x/plugin/tools/
publish.sh

NDK Path

SDK Path

ANT Path

2. Frameworks \ runtime-src
frameworks/runtime-src/proj.android/jni/
Android.mk(25,29)
frameworks/runtime-src/proj.android/jni/hellojavascript/
main.cpp(8,19-21)

frameworks/runtime-src/Classes/
AppDelegate.cpp(16-19,24-27)

frameworks/runtime-src/proj.android/
build-cfg.json
ndk_module_path
copy_resources
build-cfg.json
frameworks/runtime-src/proj.android/src/org/cocos2dx/javascript/
AppActivity.java(36,66,67)
frameworks/runtime-src/proj.android/
AndroidManifest.xml(28,29,30)
Before </application> put

Full(28,29,30)
make sure got

LAST ONE !
3. Src \ app.js(68-76)

Location :
1- Top-center banner
2- Top-left banner
3- Top-right banner
4- Bottom-center banner
5- Bottom-left banner
6- Bottom-right banner

DONE !
Must compile the project to release mode, debug mode not working.

cocos run -p android -m release

Reference link