DEV Community

How to make money with Google AdMob ads in Ionic framework 3

Nikola Brežnjak on August 16, 2017

Originally posted on my blog. In case you're looking for a way to implement Google AdMob ads in Ionic framework 1, then check out this tutorial...
Collapse
 
chykay7 profile image
ChykayAlpha 🔥

i keep getting this error "ERROR Error: Uncaught (in promise): TypeError: Object(...) is not a function", each time i try to test the app. Please help!

Collapse
 
nikola profile image
Nikola Brežnjak

Which version of Ionic are you using?

Collapse
 
chykay7 profile image
ChykayAlpha 🔥

Ionic 3 sir.

{ name: 'myapp',
integrations: { cordova: {} },
type: 'ionic-angular',
pro_id: 'b23db1a6',
id: 'b23db1a6' }

Thread Thread
 
nikola profile image
Nikola Brežnjak

I'm suspecting you're using the new version of this plugin, or the plugin changed something, as I can't reproduce the error :(

Thread Thread
 
chykay7 profile image
ChykayAlpha 🔥

Yes i am using a new version. i implemented it 2 days ago and i've been trying to debug but no success yet. Your thoughts? any solution? should i use the old version? what do you recommend? :(

Thread Thread
 
nikola profile image
Nikola Brežnjak

I recommend trying to run the demo that's in the official docs of the plugin: github.com/floatinghotpot/cordova-... and seeing if that works. Good luck!

Thread Thread
 
chykay7 profile image
ChykayAlpha 🔥

Thanks. i did the exact same thing and no success :(

Thread Thread
 
chykay7 profile image
ChykayAlpha 🔥

Hi, @Nikola Breznjak, i later figured it out. The app i wanted to apply admobpro on was built with ionic 3 so i downgraded the plugin and it work perfectly. Thanks :)

Thread Thread
 
nikola profile image
Nikola Brežnjak

Great, glad to hear you managed to solve it 👍

Collapse
 
kennrll18 profile image
Kenn Lipa

Does this work in with the beta react-ionic?

Collapse
 
nikola profile image
Nikola Brežnjak

Have you tried?

Collapse
 
kennrll18 profile image
Kenn Lipa • Edited

yes i tried Admob pro and nothing shows up. I tried admob-free as well and nothing is working.

Thread Thread
 
nikola profile image
Nikola Brežnjak

Did you get any errors in the console?

Thread Thread
 
kennrll18 profile image
Kenn Lipa

no errors. it compiles fine. when i alert(this.admob) its empty

Thread Thread
 
kennrll18 profile image
Kenn Lipa

i tried this one as well npmjs.com/package/cordova-admob

Thread Thread
 
nikola profile image
Nikola Brežnjak

I'm guessing then that this won't work with that.

Collapse
 
mazumder profile image
Imran • Edited

Thank you so much for this amazing post. I am following this post to inject ads in my ionic 3 android app. How can I initialize the interstitial ads on app load instead of calling the ad via a button ?

Collapse
 
nikola profile image
Nikola Brežnjak

Thank you, I'm glad it was useful to you.

You can set autoShow to true:

    this.admob.prepareInterstitial({
        adId: admobid.interstitial,
        isTesting: true,
        autoShow: false
    })
Collapse
 
mazumder profile image
Imran

I already did that and it worked but thank you for replying. Please accept my sincere gratitude.

Thread Thread
 
nikola profile image
Nikola Brežnjak

Thank you!

Collapse
 
diyandoychev profile image
DiyanDoychev

Hello guys,
I have implemented the admob-pro plugin as you written in the comment.
I'm using ionic 3.
When i call admob.createBanner(options) and then admob.showBanner(), the banner is shown but is black. isTesting = true;
The error is:{"isTrusted":false,"adNetwork":"AdMob","adType":"banner","adEvent":"onAdFailLoad","error":3,"reason":"No fill"}

Thank you

Collapse
 
nikola profile image
Nikola Brežnjak

Hey Diyan,

Sorry for a late reply - were you able to make any progress on this?

Collapse
 
suspedro profile image
Jesús

Thanks for the post, my doubt is ..

The app id has no use?
Why do you save it?

Collapse
 
nikola profile image
Nikola Brežnjak

You mean this App id:

var admobid = {
                banner: 'ca-app-pub-7957971173858308/5068937357',
                interstitial: 'ca-app-pub-7957971173858308/5667703151'
            };

?

Collapse
 
suspedro profile image
Jesús

No no, sorry.

At this point:

Save the App ID somewhere and proceed to create the Ad unit.

This Id: ca-app-pub-7957971173858308~2308232012

Thread Thread
 
nikola profile image
Nikola Brežnjak

Hmm, you're right, it does seem they're different, which is a bit weird, as it should be the same when you think about it - as it's the same id as when you click the copy button. Ah well, if it's not, then my bad :)
Thanks for pointing it out!

Collapse
 
rahmat_coin profile image
rahmat paudi

ca-app-pub-1850264549449468~1381215573

Collapse
 
estevamdf2 profile image
Marcos Estevam

Hi friend. I've been cloned your project and create one banner app in admob but when i run the app in my device, motorola X play with android don't show banner.
After i runned with debug mode and i saw this error in console. See the image:

For solve the error i've done this stack

So this solve this error although the banner don't show. How can i fix this ?

Collapse
 
nikola profile image
Nikola Brežnjak

Hi Marcos,

Sorry for a rather late reply. Did you find the solution in the end? This indicates that you may have not added the plugin - could this be the case?

Collapse
 
monarathi15 profile image
mona rathi • Edited

Hi
I am using admob pro. I want to achieve that my banner ads should show inside the ion-content using x and y coordinate. When I gave it a try I got issues.
Actually I tried to get the offsetTop by putting the id attribute on div which is inside of ion-content.
But it is not placing my banner ads at specific position inside web view. On different mobile it is showing at different position.

Can you please help me in this?
Thanks

Collapse
 
polarpug profile image
polarpug

Hi Nikola, you should make the same detailed article on how to make money with globalhop.net app monetizing platform :)