NAM (Naver Ad Manager)

SDK 설치

• v8.3.0 호환 지원합니다.

api platform('com.naver.gfpsdk:nam-bom:8.4.2')
api 'com.naver.gfpsdk:nam-core'

// NAM 7.x.x 버전에는 아래 sdk 포함 필요
api 'com.naver.gfpsdk:nam-nda'
// NAM 8.x.x 버전에서는 아래 sdk 포함 필요.
api 'com.naver.gfpsdk.mediation:nam-nda'

AndroidManifest.xml 설정

NAM SDK의 정상 동작을 위해선 AnroidManifest.xml 파일 내에 Key-Value 값을 설정해야 합니다.

입력해야 되는 키 값에 대해서는 사업팀([e-mail])에 문의해 주세요.

NAM의 nam_publisher_cd의 값은 반드시 string.xml 에 추가하여 사용 바랍니다.

<resources>
    <string name="nam_publisher_cd">7976096509</string>
</resources>

<meta-data
            android:name="com.naver.gfpsdk.PUBLISHER_CD"
            android:value="@string/nam_publisher_cd"/>

네이티브 광고 추가 설정

다른 타입의 광고와 다르게 네이티브 광고에서 미디에이션 사용하고자 할 경우에는 레이아웃에 대한 추가 설정이 필요합니다.

NAM 네이티브의 경우 일반 네이티브(GfpNativeAdView) 와 SimpleAd(GfpNativeSimpleAdView)를 지원하므로, 매체에서 사용하고자 하는 방식에 맞게 연동을 진행해 주세요

NAM의 경우 AdPopcornSSP v3.7.4 버전까지는 GfpNativeSimpleAdView 형태의 광고만을 지원하였으나, AdPopcornSSP v3.7.5 & NAM v8.2.5 버전부터는 GfpNativeSimpleAdView와 GfpNativeAdView의 광고를 동시에 세팅하여 광고를 취급할 수 있도록 지원이 확대 되었습니다. 이에 더 많은 광고를 확인하고자 할 경우에는 아래의 세팅을 모두 진행해 주시기 바랍니다.

GfpNativeAdView + GfpNativeSimpleAdView

AdPopcornSSPNativeAd layout 내에 GfpNativeAdView와 GfpNativeSimpleAdView 영역을 같이 추가해 주세요

• native_ad_mediation_layout.xml 샘플

<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    ...
    <!-- NAM NativeAd -->
    <com.naver.gfpsdk.GfpNativeAdView
        android:id="@+id/gfp_native_ad"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <include layout="@layout/nam_native_ad_unit_layout"/>
    </com.naver.gfpsdk.GfpNativeAdView>

    <!-- NAM SimpleAd -->
    <com.naver.gfpsdk.GfpNativeSimpleAdView
        android:id="@+id/gfp_native_simple_ad"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    </com.naver.gfpsdk.GfpNativeSimpleAdView>
...
</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>

• nam_native_ad_unit_layout.xml 샘플

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/nam_assets_container"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:background="#FFFFFF"
        android:minHeight="50dp"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:padding="10dp">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="12dp"
                android:orientation="horizontal">

                <ImageView
                    android:id="@+id/nam_ad_app_icon"
                    android:layout_width="46dp"
                    android:layout_height="46dp"
                    android:layout_marginRight="10dp"
                    android:adjustViewBounds="true" />

                <LinearLayout
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_vertical"
                    android:layout_weight="1"
                    android:orientation="vertical">

                    <TextView
                        android:id="@+id/nam_ad_headline"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginBottom="4dp"
                        android:ellipsize="end"
                        android:lines="1"
                        android:textColor="#000000"
                        android:textSize="12dp" />
                </LinearLayout>

                <com.naver.gfpsdk.GfpAdChoicesView
                    android:id="@+id/nam_ad_choices_view"
                    android:layout_width="20dp"
                    android:layout_height="20dp"
                    android:layout_gravity="center_vertical"
                    android:layout_marginLeft="10dp" />

            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">

                <TextView
                    android:id="@+id/nam_ad_body"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="12dp"
                    android:ellipsize="end"
                    android:maxLines="2"
                    android:textColor="#000000"
                    android:textSize="15dp" />

                <!--
                    if there is no media view
                        new GfpNativeAdOptions.Builder().setHasMediaView(false)
                    this should be deleted
                -->
                <com.naver.gfpsdk.GfpMediaView
                    android:id="@+id/nam_ad_media"
                    android:layout_width="match_parent"
                    android:layout_height="220dp"
                    android:layout_marginBottom="12dp"
                    android:adjustViewBounds="true" />

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="horizontal">

                    <LinearLayout
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_weight="3"
                        android:orientation="vertical">

                        <TextView
                            android:id="@+id/nam_ad_advertiser"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:ellipsize="end"
                            android:lines="1"
                            android:textColor="@android:color/darker_gray"
                            android:textSize="13dp" />

                        <TextView
                            android:id="@+id/nam_ad_social_context"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:ellipsize="end"
                            android:gravity="center_vertical"
                            android:lines="1"
                            android:textColor="@android:color/black"
                            android:textSize="13dp" />

                    </LinearLayout>

                    <Button
                        android:id="@+id/nam_ad_call_to_action"
                        android:layout_width="100dp"
                        android:layout_height="40dp"
                        android:layout_gravity="center_vertical"
                        android:layout_weight="1"
                        android:background="@color/colorPrimary"
                        android:paddingLeft="3dp"
                        android:paddingRight="3dp"
                        android:textColor="#ffffff"
                        android:textSize="13dp" />

                </LinearLayout>

            </LinearLayout>
        </LinearLayout>
    </LinearLayout>

</FrameLayout>

그리고 지정한 영역을 아래와 같이 setNamViewBinder를 통해 전달해 주면 됩니다.

// NAM - Gfp Native Ad && Native Simple Ad
NAMViewBinder namViewMixBinder = new NAMViewBinder.Builder(R.id.gfp_native_simple_ad, R.id.gfp_native_ad, R.layout.nam_native_ad_unit_layout, true)
                .assetContainerViewId(R.id.nam_assets_container)
                .adChoicesViewId(R.id.nam_ad_choices_view)
                .advertiserViewId(R.id.nam_ad_advertiser)
                .bodyViewId(R.id.nam_ad_body)
                .iconViewId(R.id.nam_ad_app_icon)
                .mediaViewId(R.id.nam_ad_media)
                .titleViewId(R.id.nam_ad_headline)
                .callToActionButtonViewId(R.id.nam_ad_call_to_action)
                .socialContextViewId(R.id.nam_ad_social_context)
                .activateObservingOnBackground(true)
                .build();
 adPopcornSSPNativeAd.setNamViewBinder(namViewMixBinder);

viewBinder Builder 생성 시, GfpNativeSimpleAdView id와 GfpNativeAdView id, native adview의 layout, hasMediaView 설정값을 반드시 넘겨줍니다.

GfpNativeSimpleAdView는 템플릿 형태이므로, View Id를 넘겨주면 모든 설정이 마무리 되지만, GfpNativeAdView 의 경우에는 각각의 ui component를 viewBinder에 추가로 세팅해 주어야 합니다. 위 코드를 참고하여 세팅해 주세요.

GfpNativeSimpleAdView

AdPopcornSSPNativeAd layout 내에 GfpNativeSimpleAdView 영역을 추가해 주세요

• native_ad_mediation_layout.xml 샘플

<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    ...
    <!-- NAM SimpleAd -->
    <com.naver.gfpsdk.GfpNativeSimpleAdView
        android:id="@+id/gfp_native_simple_ad"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    </com.naver.gfpsdk.GfpNativeSimpleAdView>
...
</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>

그리고 지정한 영역을 아래와 같이 setNamViewBinder를 통해 전달해 주면 됩니다.

NAMViewBinder namSimpleViewBinder = new NAMViewBinder.Builder(R.id.gfp_native_simple_ad)
                .build();
adPopcornSSPNativeAd.setNamViewBinder(namSimpleViewBinder);

NAMViewBinder Builder 생성 시, view id(R.id.gfp_native_simple_ad)는 필수로 넘겨주어야 합니다.

useNativeSimpleView의 기본 값은 true로 변경되었습니다.

GfpNativeAdView

AdPopcornSSPNativeAd layout 내에 GfpNativeAdView 영역을 추가해 주세요

• native_ad_mediation_layout.xml 샘플

<?xml version="1.0" encoding="utf-8"?>
<com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/adpopcorn_native_ad"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    ...
    <!-- NAM NativeAd -->
    <com.naver.gfpsdk.GfpNativeAdView
        android:id="@+id/gfp_native_ad"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <include layout="@layout/nam_native_ad_unit_layout"/>
    </com.naver.gfpsdk.GfpNativeAdView>
...
</com.igaworks.ssp.part.nativead.AdPopcornSSPNativeAd>

• nam_native_ad_unit_layout.xml 샘플

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/nam_assets_container"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:background="#FFFFFF"
        android:minHeight="50dp"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:padding="10dp">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="12dp"
                android:orientation="horizontal">

                <ImageView
                    android:id="@+id/nam_ad_app_icon"
                    android:layout_width="46dp"
                    android:layout_height="46dp"
                    android:layout_marginRight="10dp"
                    android:adjustViewBounds="true" />

                <LinearLayout
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_vertical"
                    android:layout_weight="1"
                    android:orientation="vertical">

                    <TextView
                        android:id="@+id/nam_ad_headline"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginBottom="4dp"
                        android:ellipsize="end"
                        android:lines="1"
                        android:textColor="#000000"
                        android:textSize="12dp" />
                </LinearLayout>

                <com.naver.gfpsdk.GfpAdChoicesView
                    android:id="@+id/nam_ad_choices_view"
                    android:layout_width="20dp"
                    android:layout_height="20dp"
                    android:layout_gravity="center_vertical"
                    android:layout_marginLeft="10dp" />

            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">

                <TextView
                    android:id="@+id/nam_ad_body"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="12dp"
                    android:ellipsize="end"
                    android:maxLines="2"
                    android:textColor="#000000"
                    android:textSize="15dp" />

                <!--
                    if there is no media view
                        new GfpNativeAdOptions.Builder().setHasMediaView(false)
                    this should be deleted
                -->
                <com.naver.gfpsdk.GfpMediaView
                    android:id="@+id/nam_ad_media"
                    android:layout_width="match_parent"
                    android:layout_height="220dp"
                    android:layout_marginBottom="12dp"
                    android:adjustViewBounds="true" />

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="horizontal">

                    <LinearLayout
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_weight="3"
                        android:orientation="vertical">

                        <TextView
                            android:id="@+id/nam_ad_advertiser"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:ellipsize="end"
                            android:lines="1"
                            android:textColor="@android:color/darker_gray"
                            android:textSize="13dp" />

                        <TextView
                            android:id="@+id/nam_ad_social_context"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:ellipsize="end"
                            android:gravity="center_vertical"
                            android:lines="1"
                            android:textColor="@android:color/black"
                            android:textSize="13dp" />

                    </LinearLayout>

                    <Button
                        android:id="@+id/nam_ad_call_to_action"
                        android:layout_width="100dp"
                        android:layout_height="40dp"
                        android:layout_gravity="center_vertical"
                        android:layout_weight="1"
                        android:background="@color/colorPrimary"
                        android:paddingLeft="3dp"
                        android:paddingRight="3dp"
                        android:textColor="#ffffff"
                        android:textSize="13dp" />

                </LinearLayout>

            </LinearLayout>
        </LinearLayout>
    </LinearLayout>

</FrameLayout>

그리고 지정한 영역을 아래와 같이 setNamViewBinder를 통해 전달해 주면 됩니다.

// NAM - Gfp Native Ad
NAMViewBinder namViewBinder = new NAMViewBinder.Builder(R.id.gfp_native_ad, R.layout.nam_native_ad_unit_layout, true)
                .assetContainerViewId(R.id.nam_assets_container)
                .adChoicesViewId(R.id.nam_ad_choices_view)
                .advertiserViewId(R.id.nam_ad_advertiser)
                .bodyViewId(R.id.nam_ad_body)
                .iconViewId(R.id.nam_ad_app_icon)
                .mediaViewId(R.id.nam_ad_media)
                .titleViewId(R.id.nam_ad_headline)
                .callToActionButtonViewId(R.id.nam_ad_call_to_action)
                .socialContextViewId(R.id.nam_ad_social_context)
                .activateObservingOnBackground(true)
                .build();
 adPopcornSSPNativeAd.setNamViewBinder(namViewBinder);

viewBinder Builder 생성 시, GfpNativeAdView id, native adview의 layout, hasMediaView 설정값을 반드시 넘겨줍니다.

GfpNativeAdView 의 경우에는 각각의 ui component를 viewBinder에 추가로 세팅해 주어야 합니다. 위 코드를 참고하여 세팅해 주세요.