Integration of Google Publisher Tag - react

Integrating Google Publisher Tags (GPT) from Google Ad Manager (GAM) into a React Native application involves setting up GAM, integrating the GPT library, defining ad units, and testing ad delivery. Here's a step-by-step guide to help you integrate GPT and test ad delivery in your React Native application:

Step 1: Set Up Google Ad Manager (GAM)

1. Create a Google Ad Manager account if you don't have one: https://admanager.google.com.
2. Set up an application in GAM and create ad units as described in previous sections.

Step 2: Integrate Google Publisher Tags (GPT) Library

1. Install the react-native-google-ima package using npm:

   npm install react-native-google-ima --save

2. Link the module using react-native link react-native-google-ima or auto-linking (React Native 0.60+).

Step 3: Configure GPT in Your React Native App

1. Import the necessary modules in your JavaScript/TypeScript file where you want to display ads:

   import {
       PublisherBanner,
       TestIds,
       DFPRequest,
   } from 'react-native-google-ima';

2. Initialize GPT with your Ad Manager ad unit ID and ad size:

   const adUnitID = '/YOUR/AD_UNIT_ID';

3. Load and display the ad:

   <PublisherBanner
       adUnitID={adUnitID}
       onAdLoaded={() => {
           // Ad has loaded
       }}
       onAdFailedToLoad={(error) => {
           console.error('Ad failed to load', error);
       }} />

Step 4: Test Ad Delivery

1. Use Google's test ad unit IDs for testing. Replace "YOUR/AD_UNIT_ID" with the appropriate test ad unit ID:
   • Test banner ad: /6499/example/banner
   • Test interstitial ad: /6499/example/interstitial
2. Make sure you are not using real ad unit IDs during testing to prevent serving live ads.
3. Run your React Native app on an emulator or a real device to test the ad delivery. Ensure you have an active internet connection.

Additional Steps

• Implement GPT ad event listeners to handle ad lifecycle events, such as ad loaded, ad clicked, etc.
• Test different ad formats, sizes, and targeting options using the GPT library.

Please refer to the react-native-google-ima GitHub repository for more detailed information, guides, and code examples on setting up Google Publisher Tags (GPT) with React Native.