![App Monetization: How To Add Google Ads In Flutter App | Iqonic Design](https://media.iqonic.design/iqonic-design/wp-content/uploads/2021/09/admob.webp)
App Monetization: How To Add Google Ads In Flutter App
The framework of Flutter mobile app development is fiercely flourishing in the development community with its mark as one of the leading cross-platform app development tools of this age. As more and more companies and development communities are choosing to use Flutter to create their mobile apps, you will be seeing a rapid rise in those apps in the market.
App monetization is the concept that was coined as the demand for creating mobile apps peaked. In this article, we will take you through steps for How To Add Google Ads In Flutter App and various major Ad formats, using which you can optimize the Ad revenue.
Google Ads Integration in Flutter
Google Mobile Ads integration in flutter app, is the first step towards displaying Admob ads and earning revenue. As the integration is complete, you can choose an Ad format to follow the detailed implementation steps.
Setup
- Firstly, in the pubspec.yaml of your flutter app, add the below-mentioned dependency:
![](https://media.iqonic.design/iqonic-design/wp-content/uploads/2021/09/Add-Dependencies1-1024x427.png)
2. Before loading your Google Ads, ensure that your app initializes the Mobile Ads SDK by calling this
![](https://media.iqonic.design/iqonic-design/wp-content/uploads/2021/09/Mobile-Ads-SDK1-1024x951.png)
Platform Specific Setup
iOS
Update the Info.plist file to add the 2 keys and value.
- Start by adding the GADApplicationIdentifier key with a string value of your Google Admob’s app ID in the info.plist file.
- Follow the next step by adding the SKAdNetworkItems key with Google’s SKAdNetworkIdentifier value of cstr6suwn9.skad network
- Open the info.plist file.
<key>GADApplicationIdentifier</key>
<string>Add your google admob App Id</string>
<key>SKAdNetworkItems</key>
<array>
<dict>
<key>SKAdNetworkIdentifier</key>
<string>cstr6suwn9.skadnetwork</string>
</dict> </array>
Android
- Open the Andoridmanifest.xml file.
- Add this line.
<manifest>
<application>
<meta-data
android:name=”com.google.android.gms.ads.APPLICATION_ID”
android:value=”Add your google admob app ID”/>
</application>
</manifest>
Type of Ads Format
- Banner Ads
- Interstitial Ads,
- Native Ads
- Rewarded Ads
1. Banner Ads
Banner Ads are those rectangular ads you see at the top or bottom of your smartphone screen. Banner ads remain on screen while your app users interact with the app. You can then refresh automatically after a while.
Instantiate a Banner Ad
a. Banner Ads requires the adUnitId, an AdSize, an AdRequest, and a BannerAdListener.
![Baner Ad | Iqonic Design](https://media.iqonic.design/iqonic-design/wp-content/uploads/2021/09/Banner-Ad1-1024x458.png)
Banner Ad Events
![](https://media.iqonic.design/iqonic-design/wp-content/uploads/2021/09/Banner-Ad-event1-1024x1012.png)
Load Banner Ad
![](https://media.iqonic.design/iqonic-design/wp-content/uploads/2021/09/Load-Banner-Ad1-1024x304.png)
Display Banner Ad
![Display banner Ad | Iqonic Design](https://media.iqonic.design/iqonic-design/wp-content/uploads/2021/09/Display-Banner-Ad1-1024x304.png)
2. Interstitial Ads
Interstitial Ads are full-screen Ads that cover the entire interface of an app until closed by the user for a full display of Ads.
Load an Interstitial Ad
![Load an Interestial Ad | Iqonic Design](https://media.iqonic.design/iqonic-design/wp-content/uploads/2021/09/Load-an-Interestial-Ad1-1024x643.png)
Interstitial Ad events
![Interstitial Ad events | Iqonic Design](https://media.iqonic.design/iqonic-design/wp-content/uploads/2021/09/Interstitial-Ad-events1-1024x766.png)
Display Interstitial Ads
![Display Interstitial Ads | Iqonic Design](https://media.iqonic.design/iqonic-design/wp-content/uploads/2021/09/Display-Interstitial-Ads1-1024x304.png)
3. Native Ads
Native Ads are typically customizable ads that you can match with the look and feel of your Flutter app.
Add Listener
![Add Listener | Iqonic Design](https://media.iqonic.design/iqonic-design/wp-content/uploads/2021/09/Add-Listener1-1024x971.png)
Load Native Ad
![Load Native Ad | Iqonic Design](https://media.iqonic.design/iqonic-design/wp-content/uploads/2021/09/Load-Native-Ad1.png)
Display Native Ad
![Display Native Ad | Iqonic Design](https://media.iqonic.design/iqonic-design/wp-content/uploads/2021/09/Display-Native-Ad1-1024x600.png)
4. Rewarded Ads
Rewarded Ads are those Ads that reward users for watching them. They are usually short videos and interact with playable ads, polls, and surveys.
Loaded Rewarded Ads
![Loaded Rewarded Ads | Iqonic Design](https://media.iqonic.design/iqonic-design/wp-content/uploads/2021/09/Loaded-Rewarded-Ads1-1024x648.png)
Rewarded Ad Events
![Rewarded Ad Events | Iqonic Design](https://media.iqonic.design/iqonic-design/wp-content/uploads/2021/09/Rewarded-Ad-Events1-1024x575.png)
Display a RewardedAd
![Display a RewardedAd | Iqonic Design](https://media.iqonic.design/iqonic-design/wp-content/uploads/2021/09/Display-a-RewardedAd1-1024x311.png)
Reference :- google_mobile_ads 0.13.4
Summary
There is no better way to monetize your mobile app than Google’s AdMob. Besides being the easiest way to monetize your app, the Flutter framework can let you integrate Google AdMob into your app’s development ecosystem. We are sure now you can integrate Google Ads properly on the screen. The main aim of this guide was to show how you can configure AdMob in your Flutter app project and then display various Banner Ads.