バックフィル広告は、直接広告がない場合に代替広告を自動的に表示し、収益を最大化します。AdropはAdMobやPangleなどの主要広告ネットワークをバックフィル広告ソースとしてサポートしています。
バックフィル広告には追加のプラットフォーム固有のネイティブ設定が必要です。
Android設定
1. Gradle設定
settings.gradle.kts
Pangle広告ネットワークリポジトリを追加します：
dependencyResolutionManagement {
repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
repositories {
google()
mavenCentral()
maven { url = uri("https://artifact.bytedance.com/repository/pangle") }
}
}
build.gradle.kts
バックフィル広告の依存関係を追加します：
dependencies {
implementation("io.adrop:adrop-ads:1.7.2")
implementation("io.adrop:adrop-ads-backfill:1.7.2")
}
2. AndroidManifest.xml設定
AdMobをバックフィルとして使用する場合、AndroidManifest.xmlにAdMobアプリIDを追加します：
<manifest>
<application>
<!-- AdMob App ID -->
<meta-data
android:name="com.google.android.gms.ads.APPLICATION_ID"
android:value="ca-app-pub-xxxxxxxxxxxxxxxx~yyyyyyyyyy"/>
</application>
</manifest>
ca-app-pub-xxxxxxxxxxxxxxxx~yyyyyyyyyyを実際のAdMobアプリIDに置き換えてください。
3. ProGuard設定
ProGuardを使用する場合、以下のルールを追加します：
-keep class io.adrop.** { *; }
-dontwarn io.adrop.**
iOS設定
1. Podfileの修正
Podfileにバックフィル広告の依存関係を追加します：
target 'YourApp' do
# Adrop SDK
pod 'adrop-ads'
# バックフィル広告SDK
pod 'adrop-ads-backfill'
# ... その他の依存関係
end
2. Info.plist設定
AdMobをバックフィルとして使用する場合、Info.plistにAdMobアプリIDを追加します：
<key>GADApplicationIdentifier</key>
<string>ca-app-pub-xxxxxxxxxxxxxxxx~yyyyyyyyyy</string>
ca-app-pub-xxxxxxxxxxxxxxxx~yyyyyyyyyyを実際のAdMobアプリIDに置き換えてください。
コンソール設定
Adropコンソールでバックフィル広告を有効にします：
- Adropコンソールにログイン
- 広告ユニットメニューに移動
- バックフィルを有効にする広告ユニットを選択
- バックフィル設定セクションでバックフィル広告を有効化
- バックフィル広告ネットワーク（AdMob、Pangleなど）を選択
- ネットワーク固有の設定を入力（例：AdMob広告ユニットID）
React Nativeでの使用
バックフィル広告の確認
isBackfilledプロパティを使用して、広告がバックフィル広告かどうかを確認できます。
バナー広告
import { AdropBanner } from 'adrop-ads-react-native'
<AdropBanner
unitId="YOUR_UNIT_ID"
style={{ width: 320, height: 100 }}
onAdReceived={(unitId, metadata) => {
if (metadata?.isBackfilled) {
console.log('バックフィル広告がロードされました')
} else {
console.log('直接広告がロードされました')
}
}}
/>
インタースティシャル広告
import { AdropInterstitialAd } from 'adrop-ads-react-native'
const interstitialAd = new AdropInterstitialAd('YOUR_UNIT_ID')
interstitialAd.listener = {
onAdReceived: (ad) => {
if (ad.isBackfilled) {
console.log('バックフィル広告がロードされました')
} else {
console.log('直接広告がロードされました')
}
}
}
リワード広告
import { AdropRewardedAd } from 'adrop-ads-react-native'
const rewardedAd = new AdropRewardedAd('YOUR_UNIT_ID')
rewardedAd.listener = {
onAdReceived: (ad) => {
if (ad.isBackfilled) {
console.log('バックフィル広告がロードされました')
} else {
console.log('直接広告がロードされました')
}
}
}
ネイティブ広告
ネイティブ広告の場合、バックフィル広告かどうかに応じてメディアビューを異なる方法でレンダリングする必要があります。
import {
AdropNativeAd,
AdropNativeAdView,
AdropMediaView,
AdropHeadLineView,
AdropBodyView,
} from 'adrop-ads-react-native'
import { WebView } from 'react-native-webview'
const NativeAdExample = () => {
const [nativeAd, setNativeAd] = useState<AdropNativeAd>()
const [isLoaded, setIsLoaded] = useState(false)
useEffect(() => {
const ad = new AdropNativeAd('YOUR_UNIT_ID')
ad.listener = {
onAdReceived: (ad) => {
console.log('広告を受信:', ad.isBackfilled ? 'バックフィル' : '直接')
setIsLoaded(true)
}
}
ad.load()
setNativeAd(ad)
return () => ad.destroy()
}, [])
return (
<AdropNativeAdView nativeAd={nativeAd}>
<AdropHeadLineView style={styles.headline} />
<AdropBodyView style={styles.body} />
{/* バックフィルステータスに応じて異なるメディアビューを使用 */}
{nativeAd?.isBackfilled ? (
// バックフィル広告：AdropMediaViewを使用
<AdropMediaView style={styles.media} />
) : (
// 直接広告：WebViewでレンダリング
<WebView
source={{ html: nativeAd?.properties?.creative ?? '' }}
style={styles.media}
javaScriptEnabled={true}
mediaPlaybackRequiresUserAction={false}
allowsInlineMediaPlayback={true}
scrollEnabled={false}
/>
)}
</AdropNativeAdView>
)
}
バックフィルではないネイティブ広告の場合、動画広告はWebViewを使用して直接レンダリングする必要があります。
広告表示フロー
バックフィル広告は以下の順序で表示されます：
対応広告フォーマット
バックフィル広告は以下のフォーマットをサポートしています：
| 広告フォーマット | サポート | 説明 |
|---|
| バナー | 対応 | 固定サイズのバナー広告 |
| ネイティブ | 対応 | カスタマイズ可能なネイティブ広告 |
| インタースティシャル | 対応 | フルスクリーン広告 |
| リワード | 対応 | リワードベースの広告 |
| ポップアップ | 対応 | ポップアップスタイルの広告 |
ベストプラクティス
バックフィル広告を有効化
すべての広告ユニットでバックフィル広告を有効にして、広告フィル率と収益を最大化してください。
適切なタイムアウト設定
直接広告とバックフィル広告に適切なタイムアウトを設定して、ユーザー体験を向上させてください。
バックフィル広告の分析
isBackfilledプロパティを使用して、直接広告とバックフィル広告の比率を追跡・分析してください。
ネイティブ広告のメディア処理
ネイティブ広告では、バックフィルステータスに応じてAdropMediaViewまたはWebViewを適切に使用してください。
注意事項
- Android：バックフィル広告を使用するには
io.adrop:adrop-ads-backfill:1.7.2の依存関係を追加する必要があります。
- iOS：バックフィル広告を使用するにはPodfileに
pod 'adrop-ads-backfill'を追加する必要があります。
- AdMobを使用する場合、各プラットフォームのマニフェストファイルにAdMobアプリIDを追加する必要があります。
- バックフィルではないネイティブ広告の場合、メディアはWebViewでレンダリングする必要があります。
- バックフィル広告ネットワークのポリシーに準拠する必要があります。
次のステップ
