Adaptive inline banner

An adaptive inline banner is a flexible banner ad format that ensures maximum efficiency by optimizing ad size for each device.

With this ad type, developers can set the maximum allowable ad width and height, and the system determines the optimal ad size automatically. To choose the best ad size, adaptive inline banners use a maximum height instead of a fixed one. This helps improve performance.

Typically, this format is used in feed-based apps or contexts where it's acceptable to primarily focus user attention on ads.

Appearance

This guide shows how to integrate adaptive inline banners into iOS apps. Besides code samples and instructions, it contains format-specific recommendations and links to additional resources.

Prerequisite

  1. Follow the SDK integration steps described under Quick start.
  2. First, you need to initialize the advertising SDK.
  3. Make sure you're using the latest version of the Yandex Mobile Ads SDK, and if you're using mediation, the latest version of the unified build.

Implementation

Key steps to integrate an adaptive inline banner:

  • Create an BannerAdView class instance.
  • Implement the delegate methods.
  • Load the ad.
  • Pass additional settings if you're using Adfox.
  • Receive the ad in the delegate method and render it.

Specifics of adaptive inline banner integration

  1. All calls to Yandex Mobile Ads SDK methods must be made from the main thread.

  2. We strongly advise against attempting to load a new ad when receiving an error in the func bannerAdViewDidFailLoading(_ bannerAdView: BannerAdView, error: Error) delegate method. If you need to load an ad from func adViewDidFailLoading(_ adView: YMAAdView, error: Error), restrict ad load retries to avoid recurring failed ad requests due to network connection constraints.

  3. To make sure your adaptive inline banners work correctly, use Auto Layout. Using a fixed-sized frame for the view may result in incorrect ad rendering.

  4. Adaptive inline banners work best when utilizing the full available width. In most cases, this will be the full width of the device screen. Be sure to consider the padding parameters set in your app and the display's safe area.

  5. Adaptive inline banners are designed to be placed in scrollable content. Their height can be the same as the device screen or limited by the maximum height, depending on the API.

  6. To get the ad size, use the BannerAdSize.inline(width: CGFloat, maxHeight: CGFloat) method, passing the available width of the ad container and the maximum allowed ad height as arguments.

  7. The BannerAdSize object, which is calculated using the BannerAdSize.inlineSize(withWidth: CGFloat, maxHeight: CGFloat) method, contains constant ad width and height values for identical devices. When testing your app's layout on a specific device, you can be sure that the ad size for that device will remain the same.

Creating an BannerAdView class instance

To display banner ads, you need to create an instance of the BannerAdView class and pass the ad size to it. You also need to define a delegate for BannerAdView by implementing the BannerAdViewDelegate protocol for your class.

Ads are calculated for devices using the BannerAdSize.inlineSize(withWidth: CGFloat, maxHeight: CGFloat) SDK method. As an argument, pass the maximum permissible width of the ad container. We recommend using the full width of the device screen or the width of the parent container. Be sure to consider the padding parameters set in your app and the display's safe area.

You will also need the ad unit ID (adUnitId) from the Yandex Advertising Network interface.

Example of creating an BannerAdView instance in the View Controller:

final class InlineBannerViewController: UIViewController {
    private lazy var bannerAdView: BannerAdView = {
        let adSize = BannerAdSize.inline(width: 320, maxHeight: 320)

        let bannerAdView = BannerAdView(adSize: adSize)
        bannerAdView.delegate = self
        bannerAdView.translatesAutoresizingMaskIntoConstraints = false
        return bannerAdView
    }()
}

extension InlineBannerViewController: BannerAdViewDelegate {
    func bannerAdViewDidLoad(_ bannerAdView: BannerAdView) {
        // Ad loaded successfully
    }

    func bannerAdViewDidFailLoading(_ bannerAdView: BannerAdView, error: Error) {
        // Load error
    }
}

Loading ads

Once BannerAdView is created, the ad needs to be loaded.

To notify when ads load or fail to load and to track the adaptive inline banner's life cycle, you need to set delegate properties for the BannerAdView class object and implement the BannerAdViewDelegate protocol.

You can expand ad request parameters through AdRequest, by passing user interests, contextual page data, location, or other additional info. Adding extra context to ad requests can greatly improve ad relevance. To learn more, see Ad targeting.

The example below shows how to load an adaptive inline banner. After successful loading, the unc bannerAdViewDidLoad(_ bannerAdView: BannerAdView) method of the BannerAdViewDelegate delegate will be called:

final class InlineBannerViewController: UIViewController {
    private lazy var bannerAdView: BannerAdView = {
        let adSize = BannerAdSize.inline(width: 320, maxHeight: 320)

        let bannerAdView = BannerAdView(adSize: adSize)
        bannerAdView.delegate = self
        bannerAdView.translatesAutoresizingMaskIntoConstraints = false
        return bannerAdView
    }()

    func loadAd() {
        let request = AdRequest(adUnitID: "R-M-XXXXX-YY")
        bannerAdView.loadAd(with: request)
    }
}

Ad display

After successfully loading the ad, you need to render it. For that, you can use autolayout constraints. Add the bannerAdView from the delegate method to your container. Then add autolayout constraints so the banner is displayed where you want it.

final class InlineBannerViewController: UIViewController {
    private lazy var bannerAdView: BannerAdView = {
        let adSize = BannerAdSize.inline(width: 320, maxHeight: 320)

        let bannerAdView = BannerAdView(adSize: adSize)
        bannerAdView.delegate = self
        bannerAdView.translatesAutoresizingMaskIntoConstraints = false
        return bannerAdView
    }()

    func showAd() {
        view.addSubview(bannerAdView)
        NSLayoutConstraint.activate([
            bannerAdView.topAnchor.constraint(equalTo: loadButton.bottomAnchor, constant: 100),
            bannerAdView.centerXAnchor.constraint(equalTo: view.centerXAnchor)
        ])
    }
}

Testing adaptive inline banner integration

Using demo ad units for ad testing

Use test ads to check your ad integration and the app itself. To make sure that test ads are returned for each ad request, you can use a special demo ad placement ID.

Demo adUnitId: demo-banner-yandex.

Warning

Before publishing your app in the store, make sure to replace the demo placement ID with the real ID you obtained in the Yandex Advertising Network interface.

For the list of all available demo ad placement IDs, see Demo ad units for testing.

Testing ad integration

You can test your ad integration using the native Console tool.

To view detailed logs, call the YandexAds class's enableLogging method.

YandexAds.enableLogging()

To view SDK logs, go to the Console tool and set Subsystem = com.mobile.ads.ads.sdk. You can filter logs by category or error level.

If you're having problems integrating ads, you'll get a detailed report on the issues and recommendations for how to fix them.

Additional resources