Native Ads (Mediation)

Mediated Native ads are customised views, data is provided from different ad networks and can be displayed to fit the design of any app.

1. Register a placement tag

To begin preparations for displaying a native ad, go back to your AppDelegate.m/AppDelegate.swift where you had setup the Tapdaq SDK, and add modify it to look like this:

Objective-C
Swift
TDProperties *tapdaqProps = [[TDProperties alloc] init];

TDPlacement *nativeTag = [[TDPlacement alloc] initWithAdTypes:TDAdTypeMediatedNative forTag:@"my_native_tag"];
[tapdaqProps registerPlacement:nativeTag];

[[Tapdaq sharedSession] setApplicationId:@"YOUR_APP_ID"
                               clientKey:@"YOUR_CLIENT_KEY"
                              properties:tapdaqProps];

Note: Here we use the example of a @"my_native_tag", but you can use any custom string e.g. @"my_custom_tag".

If you want to use multiple placement tags in your application, simply instantiate multiple TDPlacement objects and register them to TDProperties, like so:

Objective-C
Swift

TDPlacement *nativeTag = [[TDPlacement alloc] initWithAdTypes:TDAdTypeMediatedNative forTag:@"my_native_tag"];
[tapdaqProps registerPlacement:nativeTag];


TDPlacement *anotherNativeTag = [[TDPlacement alloc] initWithAdTypes:TDAdTypeMediatedNative forTag:@"my_custom_tag"];
[tapdaqProps registerPlacement:anotherNativeTag];

2. Load the ad

Navigate to the header file that you want the native ad to appear in (e.g. MyViewController.h/ViewController.swift) and add the following import statement at the top of the file:

Objective-C
Swift
#import <Tapdaq/Tapdaq.h>

@interface MyViewController : UIViewController <TapdaqDelegate, TDAdRequestDelegate>

The above code imports Tapdaq to the class, and declares that we will conform to the TapdaqDelegate and TDAdRequestDelegate protocols.

Please note that you only need to provide import statement once per header file.

Next, add the following command to the implementation file (e.g. MyViewController.m/ViewController.swift):

Objective-C
Swift
- (void)viewDidLoad {
    [super viewDidLoad];
    [[Tapdaq sharedSession] setDelegate:self];
}

Once this is done, the Tapdaq delegate method -didLoadConfig becomes available, implement it like so:

Objective-C
Swift
- (void)didLoadConfig {
    [[Tapdaq sharedSession] loadNativeAdInViewController:self
                                            placementTag:@"my_native_tag"
                                                 options:TDMediatedNativeAdOptionsAdChoicesTopRight
                                                delegate:self];
}

This delegate method is invoked when the Tapdaq SDK has finished loading it's config, and is ready to begin loading ads.

Delegate parameter must conform to TDAdRequestDelegate.

Note: Ads should only be requested once the Tapdaq delegate method -didLoadConfig has been called. This ensures Tapdaq is initialised and ready to begin loading ads. Requesting ads prior to Tapdaq initialising will result in failed ad requests

3. Display the ad

Using the TDMediatedNativeAd provided in the didLoad callback, a layout can now be populated.

Depending on the ad networks integrated, some fields are required whilst some fields will be null or empty

AdMob AppLovin FAN
Title Required Optional Required
Advertiser Optional N/A N/A
Subtitle N/A N/A Optional
Social Context N/A N/A Optional
Body Optional Optional Optional
Caption N/A Optional N/A
Call to action Required Optional Required
Images Optional Optional Optional
Media View Optional Optional Optional
Icon Required Optional Optional
Star Rating N/A Optional N/A
Store Optional N/A Optional

3a. Build User Interface

Build your custom UI and make sure that at least the views for displaying the required properties are implemented.

All elements of the ad must be subviews of the same UIView in order to allow for the interactions with the ad to be properly registered.

Objective-C
Swift

@interface MyViewController: UIViewController
// Required
@property (strong, nonatomic) UIView *adView;
@property (strong, nonatomic) UILabel *titleLabel;
@property (strong, nonatomic) UIImageView *iconImageView;
@property (strong, nonatomic) UIButton *callToActionButton;
// Optional
@property (strong, nonatomic) UILabel *subtitleLabel;
@property (strong, nonatomic) UILabel *bodyLabel;
@end

3b. Populate views

Objective-C
Swift
- (void)didLoadAdRequest:(TDAdRequest *)adRequest {
    if ([adRequest.placement.tag isEqualToString:@"my_native_tag"]) {
        TDNativeAdRequest *nativeAdRequest = (TDNativeAdRequest *)adRequest;

        self.titleLabel.text = nativeAdRequest.nativeAd.title;
        self.subtitleLabel.text = nativeAdRequest.nativeAd.subtitle;
        self.bodyLabel.text = nativeAdRequest.nativeAd.body;
    }
}

NOTE: When repopulating or replacing an ad, clear all the previous data or use a new view as the new ad may not have all the same data fields as the last.

3c. Trigger impression

For full impression stats, manually call trackImpression when the ad is displayed.

Objective-C
Swift
- (void)didLoadAdRequest:(TDAdRequest *)adRequest {
    if ([adRequest.placement.tag isEqualToString:@"my_native_tag"]) {
        TDNativeAdRequest *nativeAdRequest = (TDNativeAdRequest *)adRequest;
        [nativeAdRequest.nativeAd trackImpression];
    }
}

3d. Display image content

To display images the following code should be implemented. It asynchronously downloads the image provided by the network. In case the image was pre-cached, completion handler is called instantly without redownloading the image.

Objective-C
Swift
- (void)didLoadAdRequest:(TDAdRequest *)adRequest {
    if ([adRequest.placement.tag isEqualToString:@"my_native_tag"]) {
        TDNativeAdRequest *nativeAdRequest = (TDNativeAdRequest *)adRequest;

        [nativeAdRequest.nativeAd.icon getAsyncImage:^(UIImage *iconImage){
            self.iconImageView.image = iconImage;
        }];
    }
}

3e. Playing video content

Video will be auto-played as soon as mediaView is added on screen.

Objective-C
Swift
- (void)didLoadAdRequest:(TDAdRequest *)adRequest {
    if ([adRequest.placement.tag isEqualToString:@"my_native_tag"]) {
        TDNativeAdRequest *nativeAdRequest = (TDNativeAdRequest *)adRequest;

        [self.view addSubview:nativeAdRequest.nativeAd.mediaView]
    }
}

NOTE: Applovin does not provide a mediaView,, Tapdaq has however implemented a simple one which is automatically used.

3f. Register clickable views

Some networks handle the click event themselves, for others Tapdaq will handle it - for either case register the view(s) that should be clickable.

In order to handle click events properly adView must be set for the ad.

Objective-C
Swift
- (void)didLoadAdRequest:(TDAdRequest *)adRequest {
    if ([adRequest.placement.tag isEqualToString:@"my_native_tag"]) {
        TDNativeAdRequest *nativeAdRequest = (TDNativeAdRequest *)adRequest;

        [nativeAdRequest.nativeAd setAdView:self.adView];
    }
}

After adView has been set, the rest of ad's views can be registered. When registering views their type must be specified. These views must be subviews of adView.

Objective-C
Swift
- (void)didLoadAdRequest:(TDAdRequest *)adRequest {
    if ([adRequest.placement.tag isEqualToString:@"my_native_tag"]) {
        TDNativeAdRequest *nativeAdRequest = (TDNativeAdRequest *)adRequest;

        [nativeAdRequest.nativeAd setAdView:self.adView];

        [nativeAdRequest.nativeAd registerView:self.titleLabel type:TDMediatedNativeAdViewTypeHeadline];
        [nativeAdRequest.nativeAd registerView:self.iconImageView type:TDMediatedNativeAdViewTypeLogo];
        [nativeAdRequest.nativeAd registerView:self.subtitleLabel type:TDMediatedNativeAdViewTypeSubtitle];
    }
}

Build and run your application to test the advert displays correctly.

Need help?

If you are having any problems integrating, feel free to contact us on [email protected] and we will be more than happy to help.

What's next?

Now that you have successfully integrated a native ad into your app, what would you like to do next?