Monetize an Android Configuration

The OpenWeb React Native SDK supports two ad formats for Android:

• Banner (320X50, 320x100, 300x250)
• Interstitial (full page)

The interstitial ad appears once per article when the user navigates to a Conversation. The banner ad appears on the article page above the Conversation.

---

Prerequisites

---

Implementation

Integrating the Google Mobile Ads SDK into your React Native app sets the foundation for you to display ads and earn revenue. After adding and initiating the dependency, work with your OpenWeb PSM to set up the advertising campaign.

📘

Since conflicts can occur when the Google Mobile Ads SDK is a dependency of both the host app and the OpenWeb React Native SDK, Google Mobile Ads SDK is not included as a direct dependency of the OpenWeb React Native SDK.

Enable Ads

Use the following steps to monetize your Android configuration with the React Native SDK:

1. In the app build.gradle file, add the Google Ads dependency.

   Groovy

   implementation 'com.google.android.gms:play-services-ads:21.1.0'
   

2. Add the following GoogleAdsProvider file to your project.

   Kotlin

   package spotIm.sample.ads
   
   import android.app.Activity
   import android.content.Context
   import android.util.Size
   import com.google.android.gms.ads.*
   import com.google.android.gms.ads.admanager.AdManagerAdRequest
   import com.google.android.gms.ads.admanager.AdManagerAdView
   import com.google.android.gms.ads.admanager.AdManagerInterstitialAd
   import com.google.android.gms.ads.admanager.AdManagerInterstitialAdLoadCallback
   import spotIm.common.ads.SPAdSize
   import spotIm.common.ads.SPGoogleAdsProvider
   import spotIm.common.ads.SPGoogleAdsBannerListener
   import spotIm.common.ads.SPGoogleAdsInterstitialListener
   
   class GoogleAdsProvider(override var spotId: String) : SPGoogleAdsProvider {
       private var adView: AdManagerAdView? = null
       private var adManagerInterstitialAd: AdManagerInterstitialAd? = null
   
       override fun hasInterstitialAd(): Boolean {
           return adManagerInterstitialAd != null
       }
   
       override fun loadBannerAd(
           appContext: Context,
           tag: String,
           sizes: Array<SPAdSize>,
           postId: String,
           listener: SPGoogleAdsBannerListener)
       {
           createGoogleBannerView(appContext, spAdSizesToGoogleAdSizes(sizes), tag)
           val adRequest = AdManagerAdRequest.Builder()
               .addCustomTargeting(BANNER_CONV_SDK_SPOT_ID, spotId)
               .build()
           adView?.loadAd(adRequest)
           adView?.adListener = object : AdListener() {
               override fun onAdLoaded() {
                   adView?.let {
                       listener.onBannerLoaded(tag, it, Size(it.width, it.height))
                   }
               }
   
               override fun onAdFailedToLoad(error: LoadAdError) {
                   listener.onBannerFailedToLoad(error.message, error.code)
                                 }
           }
       }
   
       override fun loadInterstitialAd(appContext: Context, tag: String, postId: String, listener: SPGoogleAdsInterstitialListener) {
           val adRequest = AdManagerAdRequest.Builder()
               .addCustomTargeting(
                   INTERSTITIAL_CONV_SDK_SPOT_ID,
                   spotId
               )
               .build()
   
           AdManagerInterstitialAd.load(
               appContext,
               tag,
               adRequest,
               object : AdManagerInterstitialAdLoadCallback() {
                   override fun onAdLoaded(interstitialAd: AdManagerInterstitialAd) {
                       adManagerInterstitialAd = interstitialAd
   
                       adManagerInterstitialAd?.fullScreenContentCallback = object: FullScreenContentCallback() {
                           override fun onAdDismissedFullScreenContent() {
                               adManagerInterstitialAd = null
                               listener.onAdDismissedFullScreenContent()
                           }
   
                           override fun onAdShowedFullScreenContent() {
                               listener.onAdShowedFullScreenContent()
                           }
   
                           override fun onAdFailedToShowFullScreenContent(adError: AdError) {
                               listener.onAdFailedToShowFullScreenContent(adError.message, adError.code)
                           }
                       }
   
                       listener.onInterstitialAdLoaded()
                   }
   
                   override fun onAdFailedToLoad(adError: LoadAdError) {
                       listener.onInterstitialAdFailedToLoad(adError.message, adError.code)
                   }
               }
           )
       }
   
       override fun showInterstitialAd(activity: Activity) {
           adManagerInterstitialAd?.show(activity)
       }
   
       private fun spAdSizesToGoogleAdSizes(sizes: Array<SPAdSize>): Array<AdSize> {
           return sizes.map {
               when (it) {
                   SPAdSize.BANNER -> AdSize.BANNER
                   SPAdSize.FULL_BANNER -> AdSize.FULL_BANNER
                   SPAdSize.LARGE_BANNER -> AdSize.LARGE_BANNER
                   SPAdSize.LEADERBOARD -> AdSize.LEADERBOARD
                   SPAdSize.MEDIUM_RECTANGLE -> AdSize.MEDIUM_RECTANGLE
                   SPAdSize.WIDE_SKYSCRAPER -> AdSize.WIDE_SKYSCRAPER
               }
           }.toTypedArray()
       }
   
       private fun createGoogleBannerView(appContext: Context, sizes: Array<AdSize>, tag: String) {
           adView = AdManagerAdView(appContext)
           adView?.setAdSizes(*sizes)
           adView?.adUnitId = tag
       }
   
       companion object {
           private const val INTERSTITIAL_CONV_SDK_SPOT_ID = "interConvSdkSpotId"
           private const val BANNER_CONV_SDK_SPOT_ID = "bannerConvSdkSpotId"
       }
   }
   

3. In the Android folder, immediately after SpotIm.init() in the onCreate method of the MainApplication class, call setGoogleAdsProvider.

   Kotlin

   SpotIm.setGoogleAdsProvider(GoogleAdsProvider(<SPOT_ID>))
   

Disable Ads

By default, OpenWeb helps you to monetize your content and engagement experiences by showing ads to your users.

If you would like to provide an ad-free experience for your subscribed users, use the following steps:

1. Contact your PSM to request that ads be disabled for your subscribers.
2. Define user_metadata.is_subscriber during the backend SSO Handshake or when updating a user's details.

When you pass Base64-encoded "user_metadata.is_subscriber": true during the login process, you indicate that the user is a subscriber. During the user's session, no ads will be shown.

📘

If a user's subscriber status changes, your app must log out the user and complete a new SSO flow. This ensures that a user's previous cached client state for user_metadata.is_subscriber is not used.