Native Ads Express

Native Express ads are similar to banners in that they're rectangular ads that you can drop into a layout and size how you like. The key difference is that you can control the ad's presentation details (things like image sizes, fonts, colors, and so on) by uploading a CSS template for your ad unit. AdMob combines that template with advertiser assets (such as icons, images, and text) and displays the result in a NativeExpressAdView. This approach minimizes the amount of Java code needed for Native Ads Express, while helping you display ads that look natural in your app.

This guide shows you how to integrate Native Ads Express from AdMob into an Android app. In addition to code snippets and instructions, it includes information about how to choose the correct size category for your ad units.

Prerequisite

NativeExpressAdView

The NativeExpressAdView class is responsible for requesting and displaying Native Express ads. Here's an example NativeExpressAdView element that might appear in an XML layout file:

<com.google.android.gms.ads.NativeExpressAdView
    android:id="@+id/adView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    ads:adUnitId="ca-app-pub-3940256099942544/2177258514"
    ads:adSize="320x150">
</com.google.android.gms.ads.NativeExpressAdView>

The attributes of the element should be set as follows:

  • android:layout_height and android:layout_width should both be set to wrap_content.
  • ads:adUnitId should be set to a valid Native Ads Express ad unit ID. You can insert an ad unit ID or use a reference to a string resource (@string/my_ad_unit for example).
  • ads:AdSize should be the desired size for the Native Express ad. Sizes of the form WIDTHxHEIGHT are typical, though there are some other options, as you'll see in the next section.

Always test with test ads

The sample code above contains an ad unit ID and you're free to request ads with it. It's been specially configured to return test ads rather than production ads for every request, which makes it safe to use.

However, once you register an app in the AdMob UI and create your own ad unit IDs for use in your app, you'll need to explicitly configure your device as a test device when you're developing. This is extremely important. Testing with real ads (even if you never tap on them) is against AdMob policy and can cause your account to be suspended. See Test Ads for information on how you can make sure you always get test ads when developing.

Choose a size

Rather than forcing publishers to choose among fixed sizes, Native Ads Express offers several template sizes (chosen when creating an ad unit), each with a range of height and width values in device-independent pixels (dp):

Template size Min width Max width Min height Max height
Small 280 1200 80 612
Medium 280 1200 132 1200
Large 280 1200 250 1200

A publisher who wants to display a "Medium" template size can use widths between 280 and 1200 dp, and heights from 132 to 1200 dp. That means that 300 by 200, 450 by 150, and 613 by 572 are all valid for the Medium template size. Bear in mind, though, that not all sizes are likely to make for a good presentation. While it's technically possible to request a "Small" template with a size of 1200 by 80, it's probably not the best choice. Also, be sure to consider the screen dimensions of the device on which you're displaying the ad. Larger sizes should generally be reserved for presentation on tablets.

Apps aren't required to use the same size for every request. The same ad unit could be requested with one size in portrait orientation and another in landscape, or in different sizes according to the particular device it's running on. In the event that an app makes a request with an ad size that falls outside the range for the ad unit's template, though, an error could be returned.

Publishers can also use the FULL_WIDTH constant when programmatically creating an AdSize for a NativeExpressAdView. In this case, the ad occupies the entire width of the device screen.

At this time, the AUTO_HEIGHT constant and FLUID ad size should not be used with Native Ads Express.

Load an ad

Loading ads is done by calling the loadAd() method in NativeExpressAdView. This method accepts an AdRequest object that publishers can use to add information to the request:

MainActivity.java (excerpt)

NativeExpressAdView adView = (NativeExpressAdView)findViewById(R.id.adView);

AdRequest request = new AdRequest.Builder().build();
adView.loadAd(request);

Native video

In addition to images, text, and numbers, some native ads contain video assets. At the current time, this is limited to the app install format, but may be extended to content ads in the future.

To simplify the configuration and display of video, the Mobile Ads SDK provides the following video-related classes for Native Ads Express:

VideoOptions

The VideoOptions class allows apps to configure how native video assets should behave. VideoOptions objects can be assigned to a NativeExpressAdView via the setVideoOptions() method.

mNativeExpressAdView.setVideoOptions(new VideoOptions.Builder()
        .setStartMuted(true)
        .build());

The VideoOptions.Builder class currently offers one method, setStartMuted(), which tells the SDK whether video assets should start in a muted state. The default value is true.

VideoController

The VideoController class is used to retrieve information about video assets. Apps can get a reference to the controller from a NativeExpressAdView by calling getVideoController()

VideoController vc = myNativeExpressAdView.getVideoController();

This method always returns a VideoController object, even when no video asset is present in the ad.

VideoController offers these methods for querying video state:

  • hasVideoContent() - Returns true if the ad has a video asset, and false if it doesn't.
  • getAspectRatio() - Returns the aspect ratio of the video (width/height), or zero if no video aspect is present.

Apps can also use the VideoController.VideoLifecycleCallbacks class to get notifications when events occur in the lifecycle of a video asset.

VideoController vc = mNativeExpressAdView.getVideoController();

vc.setVideoLifecycleCallbacks(new VideoController.VideoLifecycleCallbacks() {
    public void onVideoEnd() {
        // Here apps can take action knowing video playback is finished
        // It's always a good idea to wait for playback to complete before
        // replacing or refreshing a native ad, for example.
        super.onVideoEnd();
    }
});

Additional resources

Help Center articles

Samples

Mobile Ads Garage video tutorials

Next steps

Send feedback about...

AdMob for Android
AdMob for Android
Need help? Visit our support page.