Inline adaptive banners

Adaptive banners let you specify the width of an ad to determine the optimal ad size. Adaptive banners also maximize performance by optimizing the ad size for each device. This approach results in opportunities for improved performance.

Compared to anchored adaptive banners, inline adaptive banners are larger, taller, and use variable instead of fixed heights. Inline adaptive banners are of variable height, and might encompass the entire screen or a maximum height that you specify.

You place inline adaptive banners in scrolling content, for example:

Before you begin

Before continuing, ensure you have the following:

• The Google Mobile Ads SDK 8.10.0 or higher.
• Completed the getting started guide, Banner Ads.

Implement adaptive banners

Unlike anchored adaptive banners, inline adapter banners load using an inline adaptive banner size. To create an inline adaptive ad size, complete the following:

1. Get the width of the device in use, or set your own width if you don't want to use the full width of the screen.
2. Use the appropriate static methods on the ad size class, such as GADCurrentOrientationInlineBannerAdSizeWithWidth(CGFloat width) to get an inline adaptive ad size object for the chosen orientation.
3. If you want to limit the height of the banner, use the static method GADInlineAdaptiveBannerAdSizeWithWidthAndMaxHeight(CGFloat width, CGFloat maxHeight) .

The following example demonstrates these steps:

Swift

// Step 1: Create an inline adaptive banner ad size. This size is used to
// request your adaptive banner. You can pass in the width of the device, or
// set your own width. This example sets a static width.
let adSize = GADCurrentOrientationInlineAdaptiveBannerAdSizeWithWidth(320)
// Step 2: Create banner with the inline size and set ad unit ID.
let bannerView = GAMBannerView(adSize: adSize)
bannerView.adUnitID = "<var>ad unit ID</var>"
bannerView.rootViewController = self

// For Ad Manager, the `adSize` property is used for the adaptive banner ad
// size. The `validAdSizes` property is used as normal for the supported
// reservation sizes for the ad placement.
bannerView.validAdSizes = [NSValueFromGADAdSize(GADAdSizeBanner)]

// Step 3: Load an ad.
let request = GAMRequest()
bannerView.load(request)
// TODO: Insert banner view in table view or scroll view, etc.

Objective-C

// Step 1: Create an inline adaptive banner ad size. This size is used to
// request your adaptive banner. You can pass in the width of the device, or set
// your own width. This example sets a static width.
GADAdSize *adSize = GADCurrentOrientationInlineAdaptiveBannerAdSizeWithWidth(320);
// Step 2: Create banner with the inline size and set ad unit ID.
GAMBannerView bannerView = [[GAMBannerView alloc] initWithAdSize:adSize];
bannerView.adUnitID = @"<var>ad unit ID</var>";
bannerView.rootViewController = self;

// For Ad Manager, the adSize property is used for the adaptive banner ad size.
// The validAdSizes property is used as normal for the supported reservation
// sizes for the ad placement. This is optional and only needed if you wish to
// support reservation ad sizes.
bannerView.validAdSizes = @[ NSValueFromGADAdSize(GADAdSizeBanner) ];

// Step 3: Load an ad.
GAMRequest *request = [GAMRequest request];
[bannerView loadRequest:request];
// TODO: Insert banner view in table view or scroll view, etc.

Important: Ad Manager reservation ad sizes can be served in the same ad slot as adaptive banner sized ads. In order to use adaptive banners with Ad Manager reservation ads in the same ad slot, two changes need to be made. First, set adSize to the adaptive size. Second, set validAdSizes to an array of sizes, containing all sizes of reservation ads you wish to serve in the adaptive ad slot.

When implementing adaptive banners in your app, note these points:

• The inline adaptive banner sizes work best when using the full available width. In most cases, this size is the full width of the device screen in use, or the full width of the banner's parent content. You must know the width of the view to place in the ad, the device width, the parent content width, and applicable safe areas.

• You may need to update or create new line items to work with adaptive sizes. Learn more.

Orient inline adaptive banner size

To preload an inline adaptive banner ad for a specific orientation, use the following methods:

• GADPortraitInlineAdaptiveBannerAdSizeWithWidth(CGFloat width)

• GADLandscapeInlineAdaptiveBannerAdSizeWithWidth(CGFloat width)

If your app supports both portrait and landscape views, and you want to preload an adaptive banner ad in the current orientation, use GADCurrentOrientationInlineAdaptiveBannerAdSizeWithWidth(CGFloat width) This method loads an ad in the current orientation.

Limit inline adaptive banner height

By default, inline adaptive banners instantiated without a maxHeight value have a maxHeight equal to the device height. To limit the inline adaptive banner height, use the GADInlineAdaptiveBannerAdSizeWithWidthAndMaxHeight(CGFloat width, CGFloat maxHeight) method.

Additional resources

Examples on GitHub

Download the sample application to see inline adaptive banners in action.

Swift Objective-C