First of all, create the flutter app by this command
flutter create --org com.yourdomain appname
Then install the google_mobile_ads package from the pub.dev
flutter pub add google_mobile_ads
Create your Google AdMob account from there.
Possibility error: “you can’t sign up for AdMob because your google account is associated with multiple google ads accounts” If you face this issue just go to your Google Ads account and remove the existing account. If it does not allow you to remove then simply Add your another Gmail on it first then remove yourself.
If your AdMob account is ready then create your App on AdMob.
From the left-side menu Select Apps>Create New App.
Choose Platform: (iOS or Android)
Select App status (Select Yes if your app is already on Play/App store)
Then you will see this screen, Set a custom name if you want to rename it. and click on ADD APP button.
Yes, I hope you are done to add your app on AdMob. If everything is good you will see the below screen.
Click on the DONE button then you will automatically redirect to the App Preview page. If not then go to manually on the App Preview page App>App Preview.
Now it’s time to ADD AD UNIT. Click on ADD AD UNIT button.
It will open a new page from where you can select the Add format.
For test purposes let’s create a banner format Add by selecting Banner.
Now, we have to set a Name for the Add Unit. I’m giving the name “Dashboard Banner” cause I’m planning to show this banner on my App Dashboard. No need to put anything inside the Advanced settings section for now. Finally, click on Create Ad Unit button from the bottom side.
If all is good you can see a success message “√ Ad unit successfully created” also you will get some important instructions about this added unit. Keep them in a secure place cause it will need to show the ads on our App.
On the next screen, you can see you create an Ad Unit.
Now it’s time to write code on our flutter App. So don’t forget to follow this document.
Now we have to put some code on your AndroidManifest.xml which is located at ‘android/app/src/main/AndroidManifest.xml’. Copy the below code and put it inside your AndroidManifest.xml
<manifest>
<application>
<!-- Sample AdMob app ID: ca-app-pub-3940256099942544~3347511713 -->
<meta-data
android:name="com.google.android.gms.ads.APPLICATION_ID"
android:value="ca-app-pub-xxxxxxxxxxxxxxxx~yyyyyyyyyy"/>
<application>
<manifest>
Replace the android:value with your own Ad IS, You can find your Ad Unit ID from AdMob. See the below screenshot. But for the test, you should pick a sample Ap Unit ID. Find Test Ads Code here.
Your AndroidManifest.xml file will look like this.
Now write your own code to display the ads. I’m easily using this GitHub repository. You can replace your lib folder with this PR folder. then replace the Banner Add ID on “lib/helper/ad_helper.dart” on this file.
Now, run your app.
Yes! you are done! And you should see this awesome screen on your App.
Thanks for reading the full article, Happy coding 🙂