行動裝置投放廣告Google AdMob
一、前言
1. 介紹Google AdMob
為google提供開發者一個平台投放廣告並從中得到收益
使用Google AdMob的好處有前面提到的廣告收益、由於其原生性帶給使用者更好的體驗、
快速的廣告擴散速度及有提供相關的報告來檢視廣告成效
整個系統就靠Google Mobile Ads SDK這個關鍵的東西來運行。
2. Ads種類
有四個,以它們功能性及排版來區分
①橫幅廣告 ②插頁式廣告
③獎勵廣告 ④原生進階
二、申請服務流程
首先,要先創一個廣告投放商的帳號
網址:https://apps.admob.com/signup/create-account
登入隨便一個帳號後他就會要你填一些東西,然後就可以開始匯入廣告
在你創造第一個廣告前他會需要一個名字一個平台(Android或iOS)
點完大概會長這樣
下一步會讓你選要投放哪種廣告(上方Ads種類那四種)
一些基本資料輸入後要記得①應用程式ID及②廣告ID
下一步導入SDK會用到
三、導入SDK
1. 導入元件
(Android)使用AdMob必要條件
①Android Studio 3.2 以上的版本
②minSdkVersion
1 6 以上的版本
③compileSdkVersion
28 以上的版本
第一步:在build.gradle(project)檔的allprojects加入repositories>>google()
allprojects {
repositories {
google()
}
}
第二步:在build.gradle(app)檔的dependencies implementation library
dependencies {
implementation 'com.google.android.gms:play-services-ads:19.2.0'
}
第三步:在AndroidManifest.xml的<application>tag裡面加入一筆meta-data 並附上①應用程式ID
<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>
(iOS)使用AdMob必要條件
①Xcode 11 以上的版本
②搭載iOS 8.0以上的裝置
第一步:用CocoaPods安裝SDK
pod 'Google-Mobile-Ads-SDK'
pod install --repo-update
第二步:在Info.plist檔加一個 GADApplicationIdentifier 的key
<key>GADApplicationIdentifier</key>
<string>ca-app-pub-3940256099942544~1458002511</string>
ps上面這串ca-app的是可供測試①應用程式ID
2. 注意事項
Android在導入library的時候可能會遇到插件不相容的情況,新的AndroidX跟舊的Android Support會打起來
可以用Migrate to AndroidX...這個功能,在Refactor裡,然後他會幫你看有多少程式是需要把support換成X
確認沒問題下方按Do Refector
四、實作
1. 初始化
(Android)初始化SDK
MobileAds.initialize(this, new OnInitializationCompleteListener() {
@Override
public void onInitializationComplete(InitializationStatus initializationStatus) {
}
});
ps MobileAds.initialize()
只要下一次,建議放在程式進入點
而如果要preload Ads,在這之前就做好準備工作
(iOS)初始化SDK
import GoogleMobileAds
@UIApplicationMain
class AppDelegate: UIResponder, UIApplicationDelegate {
func application(_ application: UIApplication,
didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
GADMobileAds.sharedInstance().start(completionHandler: nil)
return true
}
}
ps GADMobileAds.sharedInstance() 只要下一次,建議放在程式進入點
而如果要preload Ads,在這之前就做好準備工作
2. 介面設計
(以橫幅廣告為例)
(Android) 測試用②廣告ID:ca-app-pub-3940256099942544/6300978111(測試時請用這組
(1)可以在layout那邊直接加一個
<com.google.android.gms.ads.AdView
...
</com.google.android.gms.ads.AdView>
要注意的兩個屬性是
ads:adSize - 廣告尺寸
ads:adUnitId - ②廣告ID(見申請服務流程)
(2)也可以在程式碼中new一個AdView
AdView adView = new AdView(this);
adView.setAdSize(AdSize.BANNER);
adView.setAdUnitId("ca-app-pub-3940256099942544/6300978111");
// TODO: Add adView to your view hierarchy.
最後配合loadAd()方法載入廣告以及前面初始化,實際上大概長這樣
MobileAds.initialize(this, new OnInitializationCompleteListener() {
@Override
public void onInitializationComplete(InitializationStatus initializationStatus) {
}
});
mAdView = findViewById(R.id.adView);
AdRequest adRequest = new AdRequest.Builder().build();
mAdView.loadAd(adRequest);
}
}
(iOS)測試用②廣告ID:ca-app-pub-3940256099942544/2934735716(測試時請用這組
(1)可以直接將GADBannerView 加到 storyboard 或 xib 文件中
(2)或用程式碼加入
import GoogleMobileAds
import UIKit
class ViewController: UIViewController {
var bannerView: GADBannerView!
override func viewDidLoad() {
super.viewDidLoad()
// In this case, we instantiate the banner with desired ad size.
bannerView = GADBannerView(adSize: kGADAdSizeBanner)
addBannerViewToView(bannerView)
}
func addBannerViewToView(_ bannerView: GADBannerView) {
bannerView.translatesAutoresizingMaskIntoConstraints = false
bannerView.adUnitID = "ca-app-pub-3940256099942544/2934735716"
bannerView.rootViewController = self
view.addSubview(bannerView)
view.addConstraints(
[NSLayoutConstraint(item: bannerView,
attribute: .bottom,
relatedBy: .equal,
toItem: bottomLayoutGuide,
attribute: .top,
multiplier: 1,
constant: 0),
NSLayoutConstraint(item: bannerView,
attribute: .centerX,
relatedBy: .equal,
toItem: view,
attribute: .centerX,
multiplier: 1,
constant: 0)
])
}
}
其中bannerView.adUnitID就是②廣告ID而bannerView.rootViewController是畫面控制器
最後記得一樣要加一個bannerView.load(GADRequest())去load整個廣告
3. 監聽事件
(Android)
mAdView.setAdListener(new AdListener() {...});
其中有一些method
(1) onAdLoaded():廣告載入完成會進來
(2) onAdFailedToLoad():載入失敗會進來,有errorCode可以看原因
(3) onAdOpened():點擊廣告後會進來
(4) onAdLeftApplication():承上,onAdOpened()結束後(例如user點廣告跳到外部連結
(5) onAdClosed():關閉廣告後進來
(iOS)
/// 廣告載入完成會進來
func adViewDidReceiveAd(_ bannerView: GADBannerView) {
print("adViewDidReceiveAd")
}
/// 載入失敗會進來
func adView(_ bannerView: GADBannerView,
didFailToReceiveAdWithError error: GADRequestError) {
print("adView:didFailToReceiveAdWithError: \(error.localizedDescription)")
}
///點擊廣告後會進來
func adViewWillPresentScreen(_ bannerView: GADBannerView) {
print("adViewWillPresentScreen")
}
/// 廣告關閉前會進來
func adViewWillDismissScreen(_ bannerView: GADBannerView) {
print("adViewWillDismissScreen")
}
/// 廣告關閉後會進來
func adViewDidDismissScreen(_ bannerView: GADBannerView) {
print("adViewDidDismissScreen")
}
/// user點廣告跳到外部連結之類的操作
func adViewWillLeaveApplication(_ bannerView: GADBannerView) {
print("adViewWillLeaveApplication")
}
五、後續
一開始不會收費,直到收益100美金以上才會收
測試的時候要確保使用的廣告ID是測試用的
不然帳號會被凍結!!!
以下為官方提供的git source code
(Android) https://github.com/googleads/googleads-mobile-android-examples
(iOS) https://github.com/googleads/googleads-mobile-ios-examples