{"id":1464,"date":"2024-04-06T11:01:04","date_gmt":"2024-04-06T05:31:04","guid":{"rendered":"http:\/\/codetheory.in\/?p=1464---3af4a8f4-82c2-491b-9ce0-66ef09690bcd"},"modified":"2024-04-06T11:01:04","modified_gmt":"2024-04-06T05:31:04","slug":"admob-native-android-sdk-integration-with-phonegap-cordova-without-plugins","status":"publish","type":"post","link":"https:\/\/codetheory.in\/admob-native-android-sdk-integration-with-phonegap-cordova-without-plugins\/","title":{"rendered":"Admob Native Android SDK Integration with Phonegap\/Cordova without Plugins"},"content":{"rendered":"<p>Just like we&#8217;ve Google&#8217;s <a href=\"http:\/\/www.google.com\/adsense\" target=\"_blank\" rel=\"noopener\">AdSense<\/a> program for all web publishers to generate revenue off their content, for mobile app developers there&#8217;s Google&#8217;s <a href=\"http:\/\/www.google.com\/ads\/admob\/\" target=\"_blank\" rel=\"noopener\">AdMob<\/a> ads platform to monetize and promote their web app. PhoneGap is a great tool to convert JavaScript rich web apps to native mobile app. But when it comes to monetizing via ads, just putting Adsense code is not the solution as its meant for web usage only and is against Google&#8217;s terms and conditions. We&#8217;ll go through a simple process that I came across to integrate the native admob android sdk to our cordova apps and games without using any phonegap plugins.<\/p>\n<p><!--more--><\/p>\n<p>Let&#8217;s just follow these few steps.<\/p>\n<h2>Install the Native Android SDK<\/h2>\n<p>Download the <a href=\"https:\/\/developers.google.com\/mobile-ads-sdk\/download#downloadandroid\" target=\"_blank\" rel=\"noopener\">Android Admob SDK<\/a>, extract it and copy <code>GoogleAdMobAdsSdk-*.*.*.jar<\/code> to the PhoneGap project&#8217;s <code>libs<\/code> directory.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1470\" title=\"eclipse_project_structure\" src=\"http:\/\/codetheory.in\/wp-content\/uploads\/2013\/07\/eclipse_project_structure1.png\" alt=\"Admob jar SDK in the project\" width=\"257\" height=\"323\" \/><\/p>\n<p>Now refresh your project directory in Eclipse and add the newly downloaded SDK&#8217;s jar file to the project&#8217;s build path. You can do this by following these simple steps:<\/p>\n<ul>\n<li>Right click on the project (in the project browser) and choose &#8216;Build Path&#8217; -&gt; &#8216;Configure Build Path&#8217; from the context menu.<\/li>\n<li>Now select the &#8216;Libraries&#8217; tab and click on &#8216;Add Jars&#8217; button.<\/li>\n<li>Select <code>yourProject\/libs\/GoogleAdMobAdsSdk-*.*.*.jar<\/code><\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"http:\/\/puu.sh\/3Vd6A.png\" alt=\"\" width=\"528\" height=\"458\" \/><\/p>\n<h2>Include Admob&#8217;s Library<\/h2>\n<p>Add the following lines in your <code>MainActivity.java<\/code> right below other imports. <\/p>\n<pre class=\"brush: java; title: ; notranslate\" title=\"\">\r\nimport com.google.ads.*;\r\nimport android.widget.LinearLayout;\r\n<\/pre>\n<p>Here, the first import contains the functions related to ads while the second one will help us in inserting the ads into the screen.<\/p>\n<h2>Configure your AdMob ad unit ID<\/h2>\n<p>Now, inside the main class of your <code>MainActivity.java<\/code> file, create a new private string <code>AdMob_Ad_Unit<\/code> like this:<\/p>\n<pre class=\"brush: java; title: ; notranslate\" title=\"\">\r\nprivate static final String AdMob_Ad_Unit = &quot;xxxxxxxxxxxxxxx&quot;;\r\n<\/pre>\n<p>Make sure to replace <code>xxxxxxxxxxxxxxx<\/code> with your own ID as putting incorrect ID there will result in no ads showing up. Now we are ready to show the ads in our app!<\/p>\n<h2>Create the Ad View<\/h2>\n<p>Below the newly added string, add one more private variable <code>adView<\/code> of AdView type like this:<\/p>\n<pre class=\"brush: java; title: ; notranslate\" title=\"\">\r\nprivate AdView adView;\r\n<\/pre>\n<p>This will be the container for the ad. Now, inside the <code>onCreate<\/code> function, add the following lines at the bottom:<\/p>\n<pre class=\"brush: java; title: ; notranslate\" title=\"\">\r\nadView = new AdView(this, AdSize.BANNER, AdMob_Ad_Unit); \r\nLinearLayout layout = super.root; \r\nlayout.addView(adView); \r\nAdRequest request = new AdRequest();\r\n\r\nadView.loadAd(request); \r\n<\/pre>\n<p>This should be enough for the ads to show up in a real device. However, if you want to test the ads on a Android Virtual Machine, then you&#8217;ll have to add this line above <code>adView.loadAd(request);<\/code> and ads will start showing up in the AVDs.<\/p>\n<pre class=\"brush: java; title: ; notranslate\" title=\"\">\r\nrequest.addTestDevice(AdRequest.TEST_EMULATOR);\r\n<\/pre>\n<p>Make sure to comment out the above added line before publishing the app for obvious reasons!<\/p>\n<p>So the entire code file should look like this:<\/p>\n<pre class=\"brush: java; title: ; notranslate\" title=\"\">\r\n\/*\r\n       Licensed to the Apache Software Foundation (ASF) under one\r\n       or more contributor license agreements.  See the NOTICE file\r\n       distributed with this work for additional information\r\n       regarding copyright ownership.  The ASF licenses this file\r\n       to you under the Apache License, Version 2.0 (the\r\n       &quot;License&quot;); you may not use this file except in compliance\r\n       with the License.  You may obtain a copy of the License at\r\n\r\n         http:\/\/www.apache.org\/licenses\/LICENSE-2.0\r\n\r\n       Unless required by applicable law or agreed to in writing,\r\n       software distributed under the License is distributed on an\r\n       &quot;AS IS&quot; BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\r\n       KIND, either express or implied.  See the License for the\r\n       specific language governing permissions and limitations\r\n       under the License.\r\n *\/\r\n\r\npackage com.project.android;\r\n\r\nimport android.os.Bundle; \r\nimport org.apache.cordova.*;\r\nimport com.google.ads.*;\r\nimport android.widget.LinearLayout;\r\n\r\npublic class MainActivity extends DroidGap\r\n{\r\n\tprivate static final String AdMob_Ad_Unit = &quot;xxxxxxxxxxxxxxx&quot;;\r\n\tprivate AdView adView;\r\n\r\n    @Override\r\n    public void onCreate(Bundle savedInstanceState)\r\n    {\r\n    \t\r\n        super.onCreate(savedInstanceState);\r\n        \/\/ Set by &lt;content src=&quot;index.html&quot; \/&gt; in config.xml\r\n        super.loadUrl(Config.getStartUrl());\r\n        \/\/super.loadUrl(&quot;file:\/\/\/android_asset\/www\/index.html&quot;)\r\n        \r\n        adView = new AdView(this, AdSize.BANNER, AdMob_Ad_Unit); \r\n        LinearLayout layout = super.root; \r\n        layout.addView(adView); \r\n        AdRequest request = new AdRequest();\r\n        \r\n        \/\/ Comment this out before publishing.\r\n        \/\/ request.addTestDevice(AdRequest.TEST_EMULATOR);\r\n        adView.loadAd(request); \r\n \r\n    }\r\n}\r\n<\/pre>\n<h2>Final Steps<\/h2>\n<p>The last step is to define the newly created Ads activity into the <code>AndroidManifest.xml<\/code> file. Add this line in your manifest file after the closing tag of your main activity.<\/p>\n<pre class=\"brush: xml; title: ; notranslate\" title=\"\">\r\n&lt;activity android:name=&quot;com.google.ads.AdActivity&quot;\r\n  android:configChanges=&quot;keyboard|keyboardHidden|orientation|screenLayout|uiMode|screenSize|smallestScreenSize&quot;\/&gt;\r\n<\/pre>\n<p>Now you must be able to see the ads when running the app in an emulator or on a real device. If you run into a problem or doesn&#8217;t get it to work then drop us a comment here and we&#8217;ll help you! \ud83d\ude42<\/p>\n<p>Reference: <a href=\"https:\/\/github.com\/sainttex\/PhoneGap-Android-Native-AdMob\" target=\"_blank\" rel=\"noopener\">https:\/\/github.com\/sainttex\/PhoneGap-Android-Native-AdMob<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Just like we&#8217;ve Google&#8217;s AdSense program for all web publishers to generate revenue off their content, for mobile app developers there&#8217;s Google&#8217;s AdMob ads platform to monetize and promote their web app. PhoneGap is a great tool to convert JavaScript rich web apps to native mobile app. But when it comes to monetizing via ads, &hellip; <a href=\"https:\/\/codetheory.in\/admob-native-android-sdk-integration-with-phonegap-cordova-without-plugins\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Admob Native Android SDK Integration with Phonegap\/Cordova without Plugins&#8221;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[40],"tags":[105,110,109],"_links":{"self":[{"href":"https:\/\/codetheory.in\/wp-json\/wp\/v2\/posts\/1464"}],"collection":[{"href":"https:\/\/codetheory.in\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/codetheory.in\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/codetheory.in\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/codetheory.in\/wp-json\/wp\/v2\/comments?post=1464"}],"version-history":[{"count":30,"href":"https:\/\/codetheory.in\/wp-json\/wp\/v2\/posts\/1464\/revisions"}],"predecessor-version":[{"id":1535,"href":"https:\/\/codetheory.in\/wp-json\/wp\/v2\/posts\/1464\/revisions\/1535"}],"wp:attachment":[{"href":"https:\/\/codetheory.in\/wp-json\/wp\/v2\/media?parent=1464"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/codetheory.in\/wp-json\/wp\/v2\/categories?post=1464"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/codetheory.in\/wp-json\/wp\/v2\/tags?post=1464"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}