如何在 iOS App 裡面放置 Google 橫幅廣告

原來想要在最近開發的 App 裡面放廣告,後來覺得有點醜,就先不放了,不過還是做個筆記。

第一步驟,開通 AdMod 帳號,並且取得 App ID 還有廣告單元 ID。

  1. 你要有一個 Google 帳號。
  2. 到 AdMob 網站去註冊。
  3. 跟著網站只是開通帳號之後,會來到 dashboard 首頁,點選左邊選單的「應用程式」,然後選擇「新增應用程式」。螢幕快照 2018-06-12 上午11.54.51
  4. 之後會問你是否有在 Google Play 或 APP Store 發布過應用程式,這邊我選「否」。螢幕快照 2018-06-12 上午11.56.22
  5. 再來請你輸入應用程式名稱,這邊的名稱就你隨便取,這是給你自己辨認用的。螢幕快照 2018-06-12 上午11.56.35
  6. 取完名字之後,你就會得到一個「應用程式 ID 」,然後就是建立「廣告單元」。這邊先不用記下來也沒關係,因為等等都還可以再點進去看的。螢幕快照 2018-06-12 上午11.56.56
  7. 這邊我們選擇的是「橫幅廣告」,也就是在畫面頭尾出現的那種廣告。螢幕快照 2018-06-12 上午11.57.04
  8. 再來又會要你取名稱,名稱一樣隨便取,你自己能分類的就好,因為有時候一個app不會只有一個廣告單元。螢幕快照 2018-06-12 上午11.57.21
  9. 然後你就會看到「已成功建立廣告單元」,會看到剛剛的 App ID,還有廣告單元的 ID。這邊要注意的是上面提到的,你的 ID 要過一小時左右才會生效,不過沒關係,Google 有提供測試的 ID 給你用,下面會提到。螢幕快照 2018-06-12 上午11.57.35

第二步驟就是 Xcode 的部分啦。

首先在 podfile 中 app’s target 加入以下幾行之後,install 然後最好再整個 podfile update 一次:(其實官方只有寫第一行,下面兩行是我參考 appcoda 內文建議的,你可以自己測試一下)

pod ‘Google-Mobile-Ads-SDK’

pod ‘Firebase/Core’

pod ‘Firebase/AdMob’

接下來我想偷懶一下,因為其實官方文件還有下面我轉貼一篇 appcoda 的文就寫得很好,我都是就是照著這個剪剪貼貼就執行成功了。

最後面會貼出我個人的程式碼,但在這之前先說說我遇到的問題,就是顯示 " no ad to show" 這個錯誤。

這個錯誤有兩個地方可以去修改,第一個是還記得上面有提到,廣告單元會需要大約一個多小時才能使用,所以在這之前你可以使用官方提供的測試 廣告單元 ID ,在我寫這篇文章的時候 banner 的測試 ID 是 “ca-app-pub-3940256099942544/2934735716“。

app ID 可以使用你自己的,但把 unit ID 換成這個測試版的就可以了。

第二個是當你自己的 unit ID 申請成功之後,依然顯示 " no ad to show" 的話,這時候你要到你的首頁去,新增你的付款資訊,其實應該是收款資訊吧,只是它就顯示付款資訊,就在下面兩張圖的位置,先增完之後,再過一陣子再過一陣子再過一陣子 (因為很重要所以寫三次),才會可以顯示你自己的本人的廣告。

螢幕快照 2018-06-10 下午9.51.25螢幕快照 2018-06-10 下午11.36.41

這邊是剛剛提到的 appcoda的好文:

AdMob詳細教學:學習整合Firebase AdMob SDK在iOS Apps內放廣告

還有官方文件:

Google Mobile Ads SDK for iOS

另外就是,在 appcoda 裡面是把 banner 固定在 header ,其實你把它換成 Footer 也是會成功的,就看你喜歡從上面來還是從下面來了。

以下是我個人的程式碼,廣告會固定在 Footer 處,請參考:


import GoogleMobileAds
class AppDelegate:UIResponder, UIApplicationDelegate {
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
//這邊要做的只有兩件事,一個是import GoogleMobileAds
//另一個就是在didFinishLaunchingWithOptions裡面輸入下面這一行
GADMobileAds.configure(withApplicationID: "這邊就是你自己的 app ID ")
return true
}
}

 

發表迴響

在下方填入你的資料或按右方圖示以社群網站登入:

WordPress.com 標誌

您的留言將使用 WordPress.com 帳號。 登出 /  變更 )

Facebook照片

您的留言將使用 Facebook 帳號。 登出 /  變更 )

連結到 %s