Inserindo AdMod em seu app IONIC 3

1. Requisitos

  • Conta ativa no admob.com
  • Código do aplicativo no admob

2. Tutorial

Efetue a instalação do plugin utilizando a linha de comando abaixo para ionic 3:

cordova plugin add cordova-plugin-admob-free --save --variable ADMOB_APP_ID="YOUR_ANDROID_ADMOB_APP_ID_AS_FOUND_IN_ADMOB"
npm install @ionic-native/admob-free@4 --save

Importe em seu arquivo .ts que deseja exibir o anúncio o a linha abaixo:

import { AdMobFree, AdMobFreeBannerConfig } from '@ionic-native/admob-free';

É necessário importar o provider na página que irá exibir o anúncio:

@Component({
  selector: 'Login',
  templateUrl: 'login.html',
  providers: [AdMobFree]
})

Em seu construtor utilize a injeção de idependência abaixo:

constructor(private navCtrl: NavController,
              private adMob: AdMobFree
  ) {}

Adicione em seu código para chamada no método desejado as instruções abaixo, lembre-se de adicionar o ID gerado pelo ADMOB ca-app-pub para produção:

ionViewDidLoad() {
    const bannerConfig: AdMobFreeBannerConfig = {
      // add your config here
      // for the sake of this example we will just use the test config
      isTesting: false,
      autoShow: true,
      id: "ID gerado pelo ADMOB ca-app-pub para produção."
    };
    this.adMob.banner.config(bannerConfig);

    this.adMob.banner.prepare()
      .then(() => {
        // banner Ad is ready
        // if we set autoShow to false, then we will need to call the show method here
      })
      .catch(e => console.log(e));
  }

Feito isto basta efetuar a publicação de seu aplicativo e seu anúncio estará monetizando.

Fonte: Ionic Framework

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *