Integrate Pangle with AdMob Mediation

This guide shows you how to use Google Mobile Ads SDK for React Native to load and display ads from Pangle using mediation, covering both waterfall and bidding integrations. It covers how to add Pangle to an ad unit's mediation configuration and how to integrate the Pangle SDK and adapter into a React Native app.

Supported integrations and ad formats

The AdMob mediation adapter for Pangle has the following capabilities:

Integration
Bidding  1
Waterfall
Formats
App Open  2
Banner  2
Interstitial
Rewarded
Rewarded Interstitial
Native  2

1 Available Pangle bidding ad sources include Pangle US, Pangle KR, and Pangle ROW.

2 This format is not supported for the following Pangle bidding ad sources: Pangle US.

Prerequisites

  • Latest Google Mobile Ads SDK for React Native version.
  • [For Pangle US bidding]: Use Pangle adapter version N/A or higher.
  • React Native framework version 0.85.0 or later.
  • To deploy on Android
    • Android API level 24 or later.
  • To deploy on iOS
    • iOS deployment target of 13.0 or later.
  • A working React Native project configured with Google Mobile Ads SDK for React Native. See Set up Google Mobile Ads SDK for React Native for details.
  • Set up AdMob Mediation.

Step 1: Set up configurations in Pangle UI

Sign up or Log in to your Pangle account.

Add a new application

Navigate to the Applications tab and click the Add App button.

Select the Operating System you wish to create an application for and fill out the rest of the form. Then, click Submit.

Android

iOS

Take note of your application's App ID.

Android

iOS

Create an ad placement

Once your application has been created, click the Add button to create your ad placement.

Android

iOS

Bidding

Select your Ad Format and Ad Placement Name, and select In-App Bidding as the Pricing Type. Fill out the rest of the form and click Submit.

Once your ad placement is created, take note of the Ad Placement ID.

Android

iOS

Waterfall

Select your Ad Format and Ad Placement Name, and Global CPM as the Pricing Type. Fill out the rest of the form and click Submit.

Once your ad placement is created, take note of the Ad Placement ID.

Android

iOS

Locate Pangle Reporting API key

Bidding

This step isn't required for bidding integrations.

Waterfall

Take note of the User ID at the bottom left corner of the page.

Click Integrations > SDK & API > Pangle Reporting API 2.0. Take note of Role ID and Security Key.

Update your app-ads.txt

Authorized Sellers for Apps app-ads.txt is an IAB Tech Lab initiative that helps ensure your app ad inventory is only sold through channels you've identified as authorized. To prevent a significant loss in ad revenue, you'll need to implement an app-ads.txt file. If you haven't done so already, set up an app-ads.txt file for your app.

To implement app-ads.txt for Pangle, see How to add Pangle to your app-ads.txt file.

Turn on test mode

Follow the instructions in Pangle's How to add a Test Ad guide on how to enable Pangle test ads.

Step 2: Set up Pangle demand in AdMob UI

Configure mediation settings for your ad unit

Android

For instructions, see step 2 in the guide for Android.

iOS

For instructions, see step 2 in the guide for iOS.

Add Pangle DSP to GDPR and US state regulations ad partners list

Follow the steps in European regulations settings and US state regulations settings to add Pangle DSP to the European and US state regulations ad partners list in the AdMob UI.

Step 3: Import the Pangle SDK and adapter

In your project's root directory, install the Google Mobile Ads SDK for React Native mediation adapter for Pangle. Complete the following:

  1. Copy the Google Mobile Ads SDK for React Native adapter tar file from the gma-sdk-react-native/adapters/pangle/ directory into your project's local_packages/ directory. If you don't have the adapters folder, see Prerequisites.

    mkdir -p local_packages
    cp EXTRACT_DIR/gma-sdk-react-native/adapters/pangle/gma-mediation-pangle-0.1.0.tgz local_packages/
    

    Replace EXTRACT_DIR with the path to the directory where you extracted the archive.

  2. Install the adapter package using your preferred package manager:

    npm

    npm install ./local_packages/gma-mediation-pangle-0.1.0.tgz
    

    yarn

    yarn add ./local_packages/gma-mediation-pangle-0.1.0.tgz
    

  3. If you're building for Android, add the following repository to the build.gradle file in your project's android directory:

    repositories {
        google()
        mavenCentral()
        maven {
            url = uri("https://artifact.bytedance.com/repository/pangle/")
        }
    }
    

Step 4: Implement privacy settings on Pangle SDK

To comply with the Google EU User Consent Policy, you must make certain disclosures to your users in the European Economic Area (EEA), the UK, and Switzerland, and obtain their consent for the use of cookies or other local storage where legally required, and for the collection, sharing, and use of personal data for ads personalization. This policy reflects the requirements of the EU ePrivacy Directive and the General Data Protection Regulation (GDPR). You are responsible for verifying that consent is propagated to each ad source in your mediation chain.

Pangle React Native adapter version 0.1.0 and later supports passing GDPR consent signals from UMP SDK and consent management platforms that integrate with Google's Additional Consent specification to Pangle SDK.

US states privacy laws

US states privacy laws require giving users the right to opt out of the "sale" of their "personal information" (as the law defines those terms), with the opt-out offered through a prominent "Do Not Sell My Personal Information" link on the "selling" party's homepage. The US states privacy laws compliance guide offers the ability to enable restricted data processing for Google ad serving, but Google is unable to apply this setting to each ad network in your mediation chain. Therefore, you must identify each ad network in your mediation chain that may participate in the sale of personal information and follow guidance from each of those networks to ensure compliance.

The following sample code shows how to pass consent information to the Pangle SDK. Set consent information before you initialize Google Mobile Ads SDK for React Native to ensure they get forwarded properly to the Pangle SDK.

import {
  PangleMediation,
  PanglePAConsentType,
} from '@google/gma-mediation-pangle';
// ...

PangleMediation.setPAConsent(PanglePAConsentType.CONSENT);

See Pangle's integration guide for more details and the values that can be provided in each method.

Step 5: Add required code

Android

No additional code required for Pangle integration.

iOS

SKAdNetwork integration

Follow Pangle's documentation to add the SKAdNetwork identifiers to your project's Info.plist file.

Step 6: Test your implementation

Enable test ads

Make sure you register your test device for AdMob and enable test mode in Pangle UI.

Verify test ads

To verify that you are receiving test ads from Pangle, enable single ad source testing in ad inspector using the Pangle (Waterfall), Pangle US SDK (Bidding), Pangle KR SDK (Bidding), and Pangle ROW SDK (Bidding) ad source(s).

Error codes

If the adapter fails to receive an ad from Pangle, publishers can check the underlying error from the ad response using ResponseInfo under the following classes:

Android

com.pangle.ads
com.google.ads.mediation.pangle.PangleMediationAdapter

iOS

GADMediationAdapterPangle

Here are the codes and accompanying messages thrown by the Pangle adapter when an ad fails to load:

Android

Error code Domain Reason
101 com.google.ads.mediation.pangle Invalid server parameters (e.g. Missing app ID or placement ID).
102 com.google.ads.mediation.pangle The requested ad size does not match a Pangle supported banner size.
103 com.google.ads.mediation.pangle Pangle SDK does not support child users.
-1-60000 com.pangle.ads Pangle SDK returned an error. See Pangle's documentation for more details.

iOS

Error code Domain Reason
101 com.google.mediation.pangle Invalid server parameters (e.g. Missing app ID or placement ID).
102 com.google.mediation.pangle The requested ad size does not match a Pangle supported banner size.
104 com.google.mediation.pangle Pangle SDK does not support child users.
-1-60000 Sent by Pangle SDK Pangle SDK returned an error. See Pangle's documentation for more details.

Version 0.1.0

  • Initial release.