Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 2 Current »

Thumbnail ads are a brand new ad unit type that gives our SDK publishers an entirely incremental revenue stream. Thumbnails are unobtrusive videos that float on top of your app content. You can customize where and when the thumbnail ad is displayed to ensure that it doesn’t negatively impact user experience or cover important UI controls.

2022-10-27 11-35-09.mp4

Prerequisites

  • Ensure that you have a Thumbnail Ad Placement ID to use

Display a Thumbnail ad in your app

Displaying a Thumbnail ad is a two-step process. First you should create and load your MFThumbnailAd unit, then when you’re ready, call the showAd method to display the ad.

  1. Create a Thumbnail ad unit

  2. Display the ad

Create an Thumbnail ad unit

The MFThumbnailAd class provided by the MobileFuse SDK will handle the loading, display, and interactivity of the Thumbnail creative.

Note: Ensure that critical sections of your app, for example buttons or text, do not sit within the left margin of the screen when displaying a Thumbnail ad.

First, create a new MFThumbnailAd unit and keep a reference to it. We’ll also add it to our current view.

MFThumbnailAd *thumbnailAd;

- (void)createThumbnailAd {
    // UI on main thread
    dispatch_async(dispatch_get_main_queue(), ^ {
        thumbnailAd = [[MFThumbnailAd alloc] initWithPlacementId:@"000000"];
        // Optionally register ourselves as a callback receiver (if we've implemented IMFAdCallbackReceiver)
        [thumbnailAd registerAdCallbackReceiver:self];
        
        [thumbnailAd loadAd];
    });
}

Note: Ensure that the SDK has fully initialized before creating your ad units. You can use the onInitSuccess callback as a good place to set up your ad units.

Registering a callback receiver will allow you to handle events generated by the Thumbnail ad:

[thumbnailAd registerAdCallbackReceiver:self];

// ...

- (void)onAdLoaded:(MFAd *)ad {
    // The ad has loaded - you are able to show the ad once this callback has triggered
}
- (void)onAdStateChanged:(MFAd *)ad withState:(MobileFuseThumbnailAdRenderState)state {
    if (state == MOBILEFUSE_THUMBNAIL_AD_STATE_FULL_SCREEN) {
        // The thumbnail ad is now rendering in full-screen mode, you should
        // mute any audio/pause your app
    } else if (state == MOBILEFUSE_THUMBNAIL_AD_STATE_THUMBNAIL) {
        // The thumbnail ad is now rendering as a floating thumbnail, your 
        // app should not be paused
    }
}
- (void)onAdNotFilled:(MFAd *)ad {
    // There is no ad currently available to show to this user
}
- (void)onAdClosed:(MFAd *)ad {
    // The ad has been displayed and then closed
}
- (void)onAdRendered:(MFAd *)ad {
    // Triggered when the ad is first shown to the user - you could use this to ensure that the left 10% of screen space doesn't contain controls that may be hidden by the Thumbnail.
}
- (void)onAdClicked:(MFAd *)ad {
    // The user has clicked the ad
}
- (void)onAdExpired:(MFAd *)ad {
    // The ad has expired before being displayed - you should manually try to load a new ad here
}
- (void)onAdError:(MFAd *)ad withMessage:(NSString *)message {
    // An error occured - the message argument will contain details of what went wrong
}

// You can also listen for mute/unmute events - these happen when the user manually un-mutes the ad
// and you should ensure that your app is not playing music at the same time:
- (void)onAdMutedChanged:(MFAd *)ad withMuteState:(BOOL)muted {
    if (muted) {
        // The ad is muted, your app can play audio as normal
    } else {
        // The ad is playing sound - mute any music that your app is playing
    }
}

Display the ad

Once the Thumbnail ad has triggered the onAdLoaded callback, you can then call showAd to start displaying the initial ‘peeking’ state of the ad:

[thumbnailAd showAd];

Optionally, before calling showAd you can specify which corner of the app the ad will initially be displayed in:

// Choose where to display the ad!
[thumbnailAd setStartingPosition:MOBILEFUSE_THUMBNAIL_AD_POSITION_BOTTOM_LEFT];
[thumbnailAd setStartingPosition:MOBILEFUSE_THUMBNAIL_AD_POSITION_BOTTOM_RIGHT];
[thumbnailAd setStartingPosition:MOBILEFUSE_THUMBNAIL_AD_POSITION_TOP_LEFT];
[thumbnailAd setStartingPosition:MOBILEFUSE_THUMBNAIL_AD_POSITION_TOP_RIGHT];

You can also use isLoaded to check whether the ad is ready to be displayed.

if (thumbnailAd.isLoaded) {
   // The ad is ready to be displayed!
   [thumbnailAd showAd];
}
  • No labels