Skip to main content
App Open Ads have two possible flows designed to be used together: Cold start and Resuming from background.
App Open ads must be enabled when you initialise the SDK by passing appOpenPlacementId to ContentIgniteSDK.initialise (see the Introduction). Once enabled, use the CIAppOpenAd singleton to load and show ads.

Cold start (Splash screen)

The first approach allows you to monetise the loading screen of your app. When the user opens the app, the splash screen is displayed. While your app is loading, the SDK will load an ad. If the ad loads in time you can display it before the home screen of your app is shown. Race the load against a short timeout so a slow load never blocks the user from reaching your app:
import ContentIgniteSDK, { CIAppOpenAd } from '@content-ignite/mobile-sdk-react-native';

const AD_LOAD_TIMEOUT_MS = 5000;

// Resolves false after the timeout so a slow load never blocks the app.
const timeout = (ms: number) =>
  new Promise<boolean>((resolve) => setTimeout(() => resolve(false), ms));

async function bootstrap() {
  const initialised = await ContentIgniteSDK.initialise({
    publisherId: '<PUBLISHER-ID>',
    googleId: 'ca-app-pub-3940256099942544~3347511713',
    debugFeature: true,
    appOpenPlacementId: '<PLACEMENT-ID>',
  });

  if (initialised) {
    const loaded = await Promise.race([CIAppOpenAd.load(), timeout(AD_LOAD_TIMEOUT_MS)]);
    if (loaded) {
      await CIAppOpenAd.show(); // resolves once the ad is dismissed
    }
  }

  // Reveal the home screen.
}

Resuming from background

To monetise the app returning to the foreground, listen to React Native’s AppState. When the app becomes active, show a ready ad, otherwise load one for the next foreground:
import { useEffect } from 'react';
import { AppState, AppStateStatus } from 'react-native';
import { CIAppOpenAd } from '@content-ignite/mobile-sdk-react-native';

function useAppOpenResume(splashCompleted: React.MutableRefObject<boolean>) {
  useEffect(() => {
    const onChange = async (state: AppStateStatus) => {
      // Only run once the cold-start splash flow has completed.
      if (state !== 'active' || !splashCompleted.current) return;

      try {
        if (await CIAppOpenAd.isAvailable()) {
          await CIAppOpenAd.show();
        } else {
          // No ad ready — load one for the next foreground.
          CIAppOpenAd.load();
        }
      } catch (error) {
        console.warn('App Open resume flow failed:', error);
      }
    };

    const subscription = AppState.addEventListener('change', onChange);
    return () => subscription.remove();
  }, [splashCompleted]);
}
Guard the resume flow with a flag (e.g. a splashCompleted ref set once the cold-start flow finishes) so an ad isn’t shown twice on the very first launch.
See the full example: App Open sample app.