Adding Google AdMob Banner Ads to your app
Adding Google AdMob banner ads to your app is a simple effective way to earn money in your app. This tutorial will cover the steps in setting up an AdMob account then adding the ads to your app.
Firstly we need to create a new XCode project. Make a new single view application, we are going to name it “MakingMoney”. We are going to use CocoaPods to install the required libraries to show AdMob ads. If you have not used CocoaPods before check out the guide on it here.
Create a new file called podfile in your project folder. Then open this file in your preferred text editor and add the following and save it to setup the pod:
source 'https://github.com/CocoaPods/Specs.git' platform :ios, '7.0' target 'MakingMoney' do pod 'Firebase/Core' pod 'Firebase/AdMob' end
With this done, save the file. Then open up terminal, navigate to the MakingMoney directory and use “pod install” and we will have our AdMob libraries setup.
With this done it’s time to setup our banner Ads in the AdMob dashboard. Go to https://apps.admob.com/, if you have not already sign up for an account. On the home page select “Monetize New App”.
To setup your app, enter in the details as follows:
- Select “Add your app manually”, enter in your app name.
- Select Banner for the Ad type, and give your banner ad a name (E.g Home Page Ad)
- Skip the Firebase Analytics
- Now stay on this page, we need the App ID and Ad Unit ID. It might be useful noting these down.
Now open up your project (The .xcworkspace file – as this includes the AdMob pod) and lets add our ads!
First of all open up the AppDelegate.swift. Under import UIKit add:
import Firebase
Then in did finish launching with options, add the following line. Replace App ID with the one listed on the AdMob website. This associates your App with the one you created on AdMob.
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool { // Override point for customization after application launch. GADMobileAds.configure(withApplicationID: "App ID") return true }
Now go to the Main.storyboard and lets add the Ad. Drag a UIView onto the storyboard and position it as follows at the bottom. Make sure the height is 50, and the width takes up the whole screen. I made ours Red to be able to see it easier
Next select the following constraints with this view selected to ensure it shows up correctly on devices of different sizes:
Now in the top right select the Identity Inspector, and change the custom class to GADBannerView
Then select the assistant editor, with the view selected hold control and drag it into the ViewController.swift on the right. Connect it as an outlet bannerView.
Now that its connected, close down the split view and up open up ViewController.swift and in viewDidLoad add the following:
bannerView.adUnitID = "Ad Unit ID Here" bannerView.rootViewController = self bannerView.load(GADRequest())
Replace Ad Unit ID here with your Ad Unit ID shown in AdMob. Now run your app, congratulations you have added AdMob banner ads in your app! Note that you shouldn’t tap on live ads when testing, as if you do this too much Google will disable your account.