Capacitor setup

Setup

Requirements

Make sure you have Capacitor properly configured with the corresponding android or ios platform (see official docs).

Install

Install the plugin as a standard npm package:

npm install admob-capacitor

Depending on how you installed Capacitor, sync the project using the corresponding instruction:

npx cap sync
ionic cap sync

Android

Initialize the plugin

Register the plugin in Android app by editing the MainAcitivity.java, located at yourProject/android/app/src/main/java. It should look like the following one (see official docs):

package io.ionic.starter; // Mantain your own package here

import android.os.Bundle;
import com.getcapacitor.BridgeActivity;
import com.getcapacitor.Plugin;
import java.util.ArrayList;
import com.appfeel.ionic.plugin.capacitor.admob.AdMobAds;

public class MainActivity extends BridgeActivity {
  @Override
  public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    // Initializes the Bridge
    this.init(savedInstanceState, new ArrayList<Class<? extends Plugin>>() {{
      add(AdMobAds.class); // Add AdMobAds Capacitor Plugin
    }});
  }
}

Google AdMob configuration

Add AdMob application id inside AndroidManifest.xml, located at yourApp/android/app/src.

See how to get your app id here. If you don't have an admob account yet, you can use the official android demo application ID: ca-app-pub-3940256099942544~3347511713.

Place it inside meta-data tag (see official docs):

<meta-data
    android:name="com.google.android.gms.ads.APPLICATION_ID"
    android:value="ca-app-pub-3940256099942544~3347511713"/>

At the end, AndroidManifest.xml should look like this:

<?xml version="1.0" encoding="utf-8"?>
<application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">

    <meta-data
        android:name="com.google.android.gms.ads.APPLICATION_ID"
        android:value="ca-app-pub-3940256099942544~3347511713"/>

    <activity
        android:name=".MainActivity"
        android:label="@string/app_name" >
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
    </activity>
</application>

IOS

Update Info.plist

Add GADApplicationIdentifier key with the AdMob app id as string value inside Info.plist (see the official docs).

See how to get your app id here. If you don't have an admob account yet, you can use the official android demo application ID: ca-app-pub-3940256099942544~3347511713.

<key>GADApplicationIdentifier</key>
<string>ca-app-pub-3940256099942544~1458002511</string>

Note: No ads will be served on apps with package name io.ionic.starter. This is the default package name for new ionic apps. Make sure to rename the package name so ads can be displayed.