Banner & MREC Ads

Creating a Banner or MREC

The following code shows you how to load a banner or an MREC by using your Ad Unit ID, desired banner position, and (for banners) desired background color (MAX will size the ad for you automatically):

  • var BANNER_AD_UNIT_ID;
    if ('IOS' === window.cordova.platformId.toUpperCase()) {
      BANNER_AD_UNIT_ID = 'ios_banner_ad_unit_ID';
    } else {
      // Assume Android
      BANNER_AD_UNIT_ID = 'android_banner_ad_unit_ID';
    }
    
    function initializeBannerAds()
    {
      AppLovinMAX.createBanner(BANNER_AD_UNIT_ID, AppLovinMAX.AdViewPosition.BOTTOM_CENTER);
    
      // Set background or background color for banners to be fully functional
      // The following call sets it to black - USE HEX STRINGS ONLY
      AppLovinMAX.setBannerBackgroundColor(BANNER_AD_UNIT_ID, '#000000');
    }
  • var MREC_AD_UNIT_ID;
    if (window.cordova.platformId.toUpperCase() === 'IOS') {
      MREC_AD_UNIT_ID = 'ios_MREC_ad_unit_ID';
    } else {
      // Assume Android
      MREC_AD_UNIT_ID = 'android_MREC_ad_unit_ID';
    }
    
    public void initializeMRecAds()
    {
      AppLovinMAX.createMRec(MREC_AD_UNIT_ID, AppLovinMAX.AdViewPosition.CENTERED);
    }

MAX automatically sizes banners to 320×50 on phones and 728×90 on tablets. MRECs are sized to 300×250 on both phones and tablets. Use the utility method AppLovinMAX.isTablet() to help with view-sizing adjustments.

Displaying a Banner

To show a banner, call showBanner():

AppLovinMAX.showBanner(ad_unit_ID);

Hiding a Banner

To hide a banner, call hideBanner():

AppLovinMAX.hideBanner(ad_unit_ID);