تبلیغات بومی

پلتفرم مورد نظر را انتخاب کنید: اندروید، اندروید (بتا)، iOS

وقتی یک تبلیغ بومی بارگذاری می‌شود، GMA Next Gen SDK شنونده را برای فرمت تبلیغ مربوطه فراخوانی می‌کند. سپس برنامه شما مسئول نمایش تبلیغ است، اگرچه لزوماً لازم نیست این کار را بلافاصله انجام دهد. برای آسان‌تر کردن نمایش فرمت‌های تبلیغاتی تعریف‌شده توسط سیستم، SDK منابع مفیدی را ارائه می‌دهد، همانطور که در زیر توضیح داده شده است.

کلاس NativeAdView را تعریف کنید

یک کلاس NativeAdView تعریف کنید. این کلاس یک کلاس ViewGroup است و بالاترین سطح برای کلاس NativeAdView محسوب می‌شود. هر نمای تبلیغات بومی شامل دارایی‌های تبلیغات بومی، مانند عنصر نمای MediaView یا عنصر نمای Title است که باید فرزند شیء NativeAdView باشد.

طرح‌بندی XML

یک XML NativeAdView به پروژه خود اضافه کنید:

<com.google.android.libraries.ads.mobile.sdk.nativead.NativeAdView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <LinearLayout
    android:orientation="vertical">
        <LinearLayout
        android:orientation="horizontal">
          <ImageView
          android:id="@+id/ad_app_icon" />
          <TextView
            android:id="@+id/ad_headline" />
        </LinearLayout>
        <!--Add remaining assets such as the image and media view.-->
    </LinearLayout>
</com.google.android.libraries.ads.mobile.sdk.nativead.NativeAdView>

جت‌پک آهنگسازی

ماژول JetpackComposeDemo/compose-util را که شامل کمک‌کننده‌هایی برای نوشتن NativeAdView و فایل‌های آن است، اضافه کنید.

با استفاده از ماژول compose-util ، یک NativeAdView ایجاد کنید:

  import com.google.android.gms.compose_util.NativeAdAttribution
  import com.google.android.gms.compose_util.NativeAdView

  @Composable
  /** Display a native ad with a user defined template. */
  fun DisplayNativeAdView(nativeAd: NativeAd) {
      NativeAdView {
          // Display the ad attribution.
          NativeAdAttribution(text = context.getString("Ad"))
          // Add remaining assets such as the image and media view.
        }
    }

تبلیغات بومی بارگذاری شده را مدیریت کنید

وقتی یک تبلیغ بومی بارگذاری می‌شود، رویداد فراخوانی را مدیریت کنید، نمای تبلیغ بومی را باد کنید و آن را به سلسله مراتب نما اضافه کنید:

کاتلین

// Build an ad request with native ad options to customize the ad.
val adTypes = listOf(NativeAd.NativeAdType.NATIVE)
val adRequest = NativeAdRequest
  .Builder("/21775744923/example/native", adTypes)
  .build()

val adCallback =
  object : NativeAdLoaderCallback {
    override fun onNativeAdLoaded(nativeAd: NativeAd) {
      activity?.runOnUiThread {

        val nativeAdBinding = NativeAdBinding.inflate(layoutInflater)
        val adView = nativeAdBinding.root
        val frameLayout = myActivityLayout.nativeAdPlaceholder

        // Populate and register the native ad asset views.
        displayNativeAd(nativeAd, nativeAdBinding)

        // Remove all old ad views and add the new native ad
        // view to the view hierarchy.
        frameLayout.removeAllViews()
        frameLayout.addView(adView)
      }
    }
  }

// Load the native ad with our request and callback.
NativeAdLoader.load(adRequest, adCallback)

جاوا

// Build an ad request with native ad options to customize the ad.
List<NativeAd.NativeAdType> adTypes = Arrays.asList(NativeAd.NativeAdType.NATIVE);
NativeAdRequest adRequest = new NativeAdRequest
                                .Builder("/21775744923/example/native", adTypes)
                                .build();

NativeAdLoaderCallback adCallback = new NativeAdLoaderCallback() {
    @Override
    public void onNativeAdLoaded(NativeAd nativeAd) {
      if (getActivity() != null) {
        getActivity()
          .runOnUiThread(() -> {
            // Inflate the native ad view and add it to the view hierarchy.
            NativeAdBinding nativeAdBinding = NativeAdBinding.inflate(getLayoutInflater());
            NativeAdView adView = (NativeAdView) nativeAdBinding.getRoot();
            FrameLayout frameLayout = myActivityLayout.nativeAdPlaceholder;

            // Populate and register the native ad asset views.
            displayNativeAd(nativeAd, nativeAdBinding);

            // Remove all old ad views and add the new native ad
            // view to the view hierarchy.
            frameLayout.removeAllViews();
            frameLayout.addView(adView);
        });
      }
    }
};

// Load the native ad with our request and callback.
NativeAdLoader.load(adRequest, adCallback);

توجه داشته باشید که تمام فایل‌های مربوط به یک تبلیغ بومی مشخص باید درون طرح‌بندی NativeAdView رندر شوند. GMA Next Gen SDK تلاش می‌کند تا در صورت رندر شدن فایل‌های بومی خارج از طرح‌بندی نمایش تبلیغ بومی، هشداری را ثبت کند.

کلاس‌های نمای تبلیغات همچنین متدهایی برای ثبت نمای مورد استفاده برای هر دارایی جداگانه و متدی برای ثبت خود شیء NativeAd ارائه می‌دهند. ثبت نماها به این روش به SDK اجازه می‌دهد تا به طور خودکار وظایفی مانند موارد زیر را انجام دهد:

  • ضبط کلیک‌ها
  • ضبط برداشت‌ها زمانی که اولین پیکسل روی صفحه نمایش قابل مشاهده است
  • نمایش پوشش AdChoices برای آگهی‌های تبلیغاتی بومی - در حال حاضر محدود به گروه منتخبی از ناشران

نمایش تبلیغ بومی

مثال زیر نحوه نمایش یک تبلیغ بومی را نشان می‌دهد:

کاتلین

private fun displayNativeAd(nativeAd: NativeAd, nativeAdBinding : NativeAdBinding) {
  // Set the native ad view elements.
  val nativeAdView = nativeAdBinding.root
  nativeAdView.advertiserView = nativeAdBinding.adAdvertiser
  nativeAdView.bodyView = nativeAdBinding.adBody
  nativeAdView.callToActionView = nativeAdBinding.adCallToAction
  nativeAdView.headlineView = nativeAdBinding.adHeadline
  nativeAdView.iconView = nativeAdBinding.adAppIcon
  nativeAdView.priceView = nativeAdBinding.adPrice
  nativeAdView.starRatingView = nativeAdBinding.adStars
  nativeAdView.storeView = nativeAdBinding.adStore

  // Set the view element with the native ad assets.
  nativeAdBinding.adAdvertiser.text = nativeAd.advertiser
  nativeAdBinding.adBody.text = nativeAd.body
  nativeAdBinding.adCallToAction.text = nativeAd.callToAction
  nativeAdBinding.adHeadline.text = nativeAd.headline
  nativeAdBinding.adAppIcon.setImageDrawable(nativeAd.icon?.drawable)
  nativeAdBinding.adPrice.text = nativeAd.price
  nativeAd.starRating?.toFloat().let { value ->
    nativeAdBinding.adStars.rating = value
  }
  nativeAdBinding.adStore.text = nativeAd.store

  // Hide views for assets that don't have data.
  nativeAdBinding.adAdvertiser.visibility = getAssetViewVisibility(nativeAd.advertiser)
  nativeAdBinding.adBody.visibility = getAssetViewVisibility(nativeAd.body)
  nativeAdBinding.adCallToAction.visibility = getAssetViewVisibility(nativeAd.callToAction)
  nativeAdBinding.adHeadline.visibility = getAssetViewVisibility(nativeAd.headline)
  nativeAdBinding.adAppIcon.visibility = getAssetViewVisibility(nativeAd.icon)
  nativeAdBinding.adPrice.visibility = getAssetViewVisibility(nativeAd.price)
  nativeAdBinding.adStars.visibility = getAssetViewVisibility(nativeAd.starRating)
  nativeAdBinding.adStore.visibility = getAssetViewVisibility(nativeAd.store)

  // Inform GMA Next Gen SDK that you have finished populating
  // the native ad views with this native ad.
  nativeAdView.registerNativeAd(nativeAd, nativeAdBinding.adMedia)
}

/**
* Determines the visibility of an asset view based on the presence of its asset.
*
* @param asset The native ad asset to check for nullability.
* @return [View.VISIBLE] if the asset is not null, [View.INVISIBLE] otherwise.
*/
private fun getAssetViewVisibility(asset: Any?): Int {
  return if (asset == null) View.INVISIBLE else View.VISIBLE
}

جاوا

private void displayNativeAd(ad: NativeAd, nativeAdBinding : NativeAdBinding) {
  // Set the native ad view elements.
  NativeAdView nativeAdView = nativeAdBinding.getRoot();
  nativeAdView.setAdvertiserView(nativeAdBinding.adAdvertiser);
  nativeAdView.setBodyView(nativeAdBinding.adBody);
  nativeAdView.setCallToActionView(nativeAdBinding.adCallToAction);
  nativeAdView.setHeadlineView(nativeAdBinding.adHeadline);
  nativeAdView.setIconView(nativeAdBinding.adAppIcon);
  nativeAdView.setPriceView(nativeAdBinding.adPrice);
  nativeAdView.setStarRatingView(nativeAdBinding.adStars);
  nativeAdView.setStoreView(nativeAdBinding.adStore);

  // Set the view element with the native ad assets.
  nativeAdBinding.adAdvertiser.setText(nativeAd.getAdvertiser());
  nativeAdBinding.adBody.setText(nativeAd.getBody());
  nativeAdBinding.adCallToAction.setText(nativeAd.getCallToAction());
  nativeAdBinding.adHeadline.setText(nativeAd.getHeadline());
  if (nativeAd.getIcon() != null) {
      nativeAdBinding.adAppIcon.setImageDrawable(nativeAd.getIcon().getDrawable());
  }
  nativeAdBinding.adPrice.setText(nativeAd.getPrice());
  if (nativeAd.getStarRating() != null) {
      nativeAdBinding.adStars.setRating(nativeAd.getStarRating().floatValue());
  }
  nativeAdBinding.adStore.setText(nativeAd.getStore());

  // Hide views for assets that don't have data.
  nativeAdBinding.adAdvertiser.setVisibility(getAssetViewVisibility(nativeAd.getAdvertiser()));
  nativeAdBinding.adBody.setVisibility(getAssetViewVisibility(nativeAd.getBody()));
  nativeAdBinding.adCallToAction.setVisibility(getAssetViewVisibility(nativeAd.getCallToAction()));
  nativeAdBinding.adHeadline.setVisibility(getAssetViewVisibility(nativeAd.getHeadline()));
  nativeAdBinding.adAppIcon.setVisibility(getAssetViewVisibility(nativeAd.getIcon()));
  nativeAdBinding.adPrice.setVisibility(getAssetViewVisibility(nativeAd.getPrice()));
  nativeAdBinding.adStars.setVisibility(getAssetViewVisibility(nativeAd.getStarRating()));
  nativeAdBinding.adStore.setVisibility(getAssetViewVisibility(nativeAd.getStore()));

  // Inform GMA Next Gen SDK that you have finished populating
  // the native ad views with this native ad.
  nativeAdView.registerNativeAd(nativeAd, nativeAdBinding.adMedia);
}

/**
* Determines the visibility of an asset view based on the presence of its asset.
*
* @param asset The native ad asset to check for nullability.
* @return {@link View#VISIBLE} if the asset is not null, {@link View#INVISIBLE} otherwise.
*/
private int getAssetViewVisibility(Object asset) {
    return (asset == null) ? View.INVISIBLE : View.VISIBLE;
}

پوشش AdChoices

یک پوشش AdChoices به عنوان نمای تبلیغ توسط SDK هنگام بازگشت یک تبلیغ backfill اضافه می‌شود. اگر برنامه شما از backfill تبلیغات بومی استفاده می‌کند، در گوشه دلخواه خود از نمای تبلیغ بومی، فضایی را برای لوگوی AdChoices که به طور خودکار درج می‌شود، در نظر بگیرید. همچنین، مهم است که پوشش AdChoices دیده شود، بنابراین رنگ‌ها و تصاویر پس‌زمینه را به طور مناسب انتخاب کنید. برای اطلاعات بیشتر در مورد ظاهر و عملکرد پوشش، به دستورالعمل‌های پیاده‌سازی تبلیغات بومی برنامه‌ریزی‌شده مراجعه کنید.

انتساب آگهی برای تبلیغات بومی برنامه‌ریزی‌شده

هنگام نمایش تبلیغات بومی برنامه‌ریزی‌شده، باید یک انتساب تبلیغ نمایش دهید تا مشخص شود که این نمایش یک تبلیغ است. برای اطلاعات بیشتر به دستورالعمل‌های خط‌مشی ما مراجعه کنید.

مدیریت کلیک‌ها

هیچ کنترل‌کننده کلیک سفارشی را روی هیچ نمایی، چه در داخل و چه در نمای تبلیغات بومی، پیاده‌سازی نکنید. کلیک‌ها روی دارایی‌های نمای تبلیغات توسط SDK مدیریت می‌شوند، مادامی که نماهای دارایی را به درستی پر و ثبت کنید.

برای گوش دادن به کلیک‌ها، فراخوانی کلیک GMA Next Gen SDK را پیاده‌سازی کنید:

کاتلین

private fun setEventCallback(nativeAd: NativeAd) {
  nativeAd.adEventCallback =
    object : NativeAdEventCallback {
      override fun onAdClicked() {
        Log.d(Constant.TAG, "Native ad recorded a click.")
      }
    }
}

جاوا

private void setEventCallback(NativeAd nativeAd) {
  nativeAd.setAdEventCallback(new NativeAdEventCallback() {
      @Override
      public void onAdClicked() {
        Log.d(Constant.TAG, "Native ad recorded a click.");
      }
  });
}

نوع مقیاس تصویر

کلاس MediaView هنگام نمایش تصاویر دارای یک ویژگی ImageScaleType است. اگر می‌خواهید نحوه‌ی مقیاس‌بندی یک تصویر را در MediaView تغییر دهید، ImageView.ScaleType مربوطه را با استفاده از متد setImageScaleType() از MediaView تنظیم کنید:

کاتلین

nativeAdViewBinding.mediaView.imageScaleType = ImageView.ScaleType.CENTER_CROP

جاوا

nativeAdViewBinding.mediaView.setImageScaleType(ImageView.ScaleType.CENTER_CROP);

محتوای رسانه‌ای

کلاس MediaContent داده‌های مربوط به محتوای رسانه‌ای تبلیغ بومی را که با استفاده از کلاس MediaView نمایش داده می‌شود، در خود نگه می‌دارد. وقتی ویژگی mediaContent MediaView با یک نمونه MediaContent تنظیم می‌شود:

  • اگر یک فایل ویدیویی موجود باشد، بافر شده و درون MediaView شروع به پخش می‌کند. می‌توانید با بررسی hasVideoContent() متوجه شوید که آیا یک فایل ویدیویی موجود است یا خیر.

  • اگر تبلیغ حاوی فایل ویدیویی نباشد، فایل mainImage دانلود شده و در داخل MediaView قرار می‌گیرد.

از بین بردن یک تبلیغ

بعد از اینکه یک تبلیغ بومی نمایش دادید، آن را از بین ببرید. مثال زیر یک تبلیغ بومی را از بین می‌برد:

کاتلین

nativeAd.destroy()

جاوا

nativeAd.destroy();

کد تبلیغات بومی را آزمایش کنید

تبلیغات فروش مستقیم

اگر می‌خواهید آزمایش کنید که تبلیغات بومی فروش مستقیم چگونه هستند، می‌توانید از این شناسه واحد تبلیغاتی Ad Manager استفاده کنید:

/21775744923/example/native

این افزونه طوری پیکربندی شده است که تبلیغات نمونه نصب اپلیکیشن و تبلیغات محتوایی و همچنین یک قالب تبلیغاتی بومی سفارشی با ویژگی‌های زیر را ارائه دهد:

  • تیتر (متن)
  • تصویر اصلی (تصویر)
  • عنوان (متن)

شناسه قالب برای قالب تبلیغات بومی سفارشی 10063170 است.

تبلیغات محلی برای پر کردن مجدد

قابلیت پر کردن مجدد تبلیغات Ad Exchange محدود به گروه منتخبی از ناشران است. برای آزمایش رفتار تبلیغات پر کردن مجدد بومی، از این واحد تبلیغاتی Ad Manager استفاده کنید:

/21775744923/example/native-backfill

این سرویس، نمونه‌هایی از تبلیغات نصب اپلیکیشن و محتوا را ارائه می‌دهد که شامل پوشش AdChoices هستند.

به یاد داشته باشید که قبل از انتشار، کد خود را به‌روزرسانی کنید تا به شناسه‌های واحد تبلیغاتی و قالب واقعی خود ارجاع دهید.

مراحل بعدی

مباحث زیر را بررسی کنید:

مثال

برنامه‌ی نمونه‌ای که نحوه‌ی استفاده از GMA Next Gen SDK را نشان می‌دهد، دانلود و اجرا کنید.