Skip to content

FacebookAudienceNetwork_NativeBanner_Ad_Android

AdGeneration edited this page Dec 11, 2018 · 12 revisions

Facebook Audience Network ネイティブバナー広告 SDK連携 Android

ネイティブバナー広告はFacebook Audience Network 4.99以降のみ使用することができます。

はじめに

Facebook Audience NetworkのSDKと連携し、Facebook Audience Networkで配信されている広告を表示することができます。 開発環境としてAndroid Studioを利用し、インストール後の各種設定は準備されていることを前提とした手順となります。

対応バージョン

Android 4.0.3以降

導入の流れ

  1. SDKをダウンロードします
  2. プロジェクトにSDKを追加します
  3. AndroidManifest.xmlの設定を行います
  4. Google Play Servicesの設定を行います
  5. SDK連携時の共通作業を行います
  6. 例を参考に広告表示の実装を行います
  7. proguardの設定を行います

1. SDKをダウンロードする ~ 3. AndroidManifest.xmlを修正する

Facebook Audience Network バナー広告/インタースティシャル広告 SDK連携 Androidをご参照ください。

4. Google Play Servicesを設定する

Getting Started / バナー広告をご参照ください。

5. SDK連携時の共通作業を行う

こちらをご参照ください。
アドネットワークのSDKと連携する際の注意事項及び共通手順

6. 広告表示の実装を行う

Facebook Audience Network ネイティブ広告 SDK連携 Androidをご参照ください。

ネイティブバナー広告オブジェクトはcom.facebook.ads.NativeBannerAdクラスです。

@Override
public void onReceiveAd(Object o) {
    //省略
    if (o instanceof NativeBannerAd) {
        FBNativeBannerAdView nativeAdView = new FBNativeBannerAdView(getApplicationContext());
        nativeAdView.apply((NativeBannerAd) o);
        view = nativeAdView;
    }
    //省略
}

を追加することによってNativeBanner広告オブジェクトが取得できます。

ネイティブバナー広告デザイン例

public class FBNativeBannerAdView extends RelativeLayout{

    private Context mContext;
    private View mContainer;
    private AdIconView mIconImageView;
    private RelativeLayout mAdChoicesContainer;
    private TextView mSocialContextLabel, mCTALabel, mTitleLabel;

    public FBNativeBannerAdView(Context context) {
        this(context, null);
    }

    public FBNativeBannerAdView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public FBNativeBannerAdView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context, attrs, defStyleAttr, 0);
    }

    @TargetApi(21)
    public FBNativeBannerAdView(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
        super(context, attrs, defStyleAttr, defStyleRes);
        init(context, attrs, defStyleAttr, 0);
    }

    private void init(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
        mContext = context;

        View layout         = LayoutInflater.from(context).inflate(R.layout.fb_native_bannerad_view, this);
        mContainer          = layout.findViewById(R.id.fb_native_bannerad_view_container);
        mAdChoicesContainer = (RelativeLayout) layout.findViewById(R.id.fb_nativead_view_adchoices);
        mIconImageView      = (AdIconView) layout.findViewById(R.id.fb_nativead_view_icon);
        mTitleLabel         = (TextView) layout.findViewById(R.id.fb_nativead_view_title);
        mSocialContextLabel = (TextView) layout.findViewById(R.id.fb_nativead_view_social_context);
        mCTALabel           = (TextView) layout.findViewById(R.id.fb_nativead_view_cta);

        mTitleLabel.setText("");
        mCTALabel.setText("");
        mSocialContextLabel.setText("");

        if (mCTALabel.getBackground() instanceof ColorDrawable) {
            ColorDrawable cd = (ColorDrawable) mCTALabel.getBackground();
            int colorCode = cd.getColor();
            GradientDrawable borders = new GradientDrawable();
            borders.setColor(colorCode);
            borders.setCornerRadius(10);
            borders.setStroke(3, colorCode);
            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
                mCTALabel.setBackground(borders);
            } else {
                mCTALabel.setBackgroundDrawable(borders);
            }
        }
    }

    public void apply(NativeBannerAd nativeAd) {

        // adChoices
        AdChoicesView adChoicesView = new AdChoicesView(mContext, nativeAd, true);
        mAdChoicesContainer.addView(adChoicesView, 0);

        // タイトル
        mTitleLabel.setText(nativeAd.getAdHeadline());


        // ソーシャルコンテキスト
        mSocialContextLabel.setText(nativeAd.getAdSocialContext());

        // CTA
        mCTALabel.setVisibility(nativeAd.hasCallToAction() ? View.VISIBLE : View.INVISIBLE);
        mCTALabel.setText(nativeAd.getAdCallToAction());

        // クリックイベント
        List<View> clickableViews = new ArrayList<>();
        clickableViews.add(mTitleLabel);
        clickableViews.add(mCTALabel);
        clickableViews.add(mSocialContextLabel);

        nativeAd.registerViewForInteraction(mContainer, mIconImageView, clickableViews);
    }
}

実装時の注意事項

ローテーション有効時は、ADG#setAutomaticallyRemoveOnReload(View view)を使用してください。

  • ADGクラスは1つの広告枠に対して1つのインスタンスを生成してください。

制限事項

以下のプロパティ及びメソッドは利用できません。

ADG
  • adScale

7. proguardの設定をする

Facebook Audience Network バナー広告/インタースティシャル広告 SDK連携 Androidをご参照ください。

配信条件について

Facebook Audience Networkの広告が配信されるためには以下の様な条件が揃っている必要があります。

  1. Facebookアプリが端末にインストールしてあり、ログインしている
  2. 端末で広告ターゲティングがオプトアウトされていない

オプトアウト設定
「Google設定」>「広告」で「インタレストベース広告をオプトアウト」しない

テストについて

テスト用ID

テスト広告の表示に使用するAd Generationの広告枠IDです。
このIDをセットしたままアプリをリリースしないようご注意ください。

ID 説明
68202 FacebookAudienceNetworkが設定されています

テスト広告の表示

下記の手順により実機でテスト広告を表示することが可能です。

  1. Facebook Audience Networkが配信設定された枠IDをセットして広告のリクエストを行う。
  2. ログにテスト広告表示のための指示が出力される。(XXXXXXXXXXXXXXXXXXXに入る文字列は環境によってユニークです)
11-30 00:00:00.000: D/AdSettings(1759):
  Test mode device hash: XXXXXXXXXXXXXXXXXXX
11-30 00:00:00.000: D/AdSettings(1759):
  When testing your app with Facebook's ad units
  you must specify the device hashed ID to ensure the delivery of test ads,
  add the following code before loading an ad:
  AdSettings.addTestDevice("XXXXXXXXXXXXXXXXXXX");
  1. 指示のAdSettings.addTestDevice("XXXXXXXXXXXXXXXXXXX");の箇所をコード上にペーストする。(アプリのリリース時はペーストしたコードを削除してください)

エミュレータの場合は本番広告は表示されません。

注意事項

表示速度について

広告クリエイティブによっては読み込みまで時間がかかるケースもございます。
その回避の為、ロードタイミングをできるだけ早めることを推奨いたします。

タップ後の挙動について

Facebook Audience Networkの広告タップ時の動作をカスタマイズすることはできません。以下のいずれの場合もFacebook Audience Networkの仕様に従います。

  • アプリ内ブラウザでのWebページ表示
  • モーダルでのストア表示
  • プレイヤーでの動画再生

広告キャッシュについて

広告をキャッシュする場合はAudience Networkの利用規約に基づき、60分以内としてください。

動作確認について

以下のような点を踏まえて動作確認を行ってください

  • Facebookアプリにログインした端末でFacebook Audience Networkの広告が表示されること
  • Facebookアプリにログインしていない端末でFacebook Audience Network以外の広告がスムーズに表示されること
  • 広告のタップによる遷移が正常に行われること

参考

Home

導入マニュアルのドキュメントはコチラに移行しました。

お手数ですがリンクから遷移してください。 https://docs.sdk.ad-generation.jp/

Clone this wiki locally