รูปแบบโฆษณาเนทีฟที่กำหนดเอง

รูปแบบโฆษณาเนทีฟที่กำหนดเอง

นอกเหนือจากรูปแบบโฆษณาเนทีฟที่ระบบกำหนดแล้ว ผู้เผยแพร่โฆษณา Ad Manager ยังมีตัวเลือกในการสร้างรูปแบบโฆษณาเนทีฟของตนเองโดยกำหนดรายการเนื้อหาที่กำหนดเองได้อีกด้วย โฆษณาเหล่านี้เรียกว่ารูปแบบโฆษณาเนทีฟที่กำหนดเอง และสามารถใช้กับโฆษณาที่สงวนไว้ได้ ซึ่งช่วยให้ผู้เผยแพร่โฆษณาส่ง Structured Data ที่กำหนดเองไปยังแอปได้ โฆษณาเหล่านี้จะแสดงด้วยออบเจ็กต์ NativeCustomFormatAd

โหลดรูปแบบโฆษณาเนทีฟที่กำหนดเอง

คู่มือนี้จะอธิบายวิธีโหลดและแสดงรูปแบบโฆษณาเนทีฟที่กําหนดเอง

สร้าง AdLoader

เช่นเดียวกับโฆษณาเนทีฟ ระบบจะโหลดรูปแบบโฆษณาเนทีฟที่กำหนดเองโดยใช้คลาส AdLoader ดังนี้

Java

AdLoader adLoader = new AdLoader.Builder(context, "/21775744923/example/native")
    .forCustomFormatAd("10063170",
      new NativeCustomFormatAd.OnCustomFormatAdLoadedListener() {
          @Override
          public void onCustomFormatAdLoaded(NativeCustomFormatAd ad) {
              // Show the custom format and record an impression.
          }
      },
      new NativeCustomFormatAd.OnCustomClickListener() {
          @Override
          public void onCustomClick(NativeCustomFormatAd ad, String s) {
              // Handle the click action
          }
      })
    .withAdListener( ... )
    .withNativeAdOptions( ... )
    .build();

Kotlin

val adLoader = AdLoader.Builder(this, "/21775744923/example/native")
        .forCustomFormatAd("10063170",
            { ad ->
                // Show the custom format and record an impression.
            },
            { ad, s ->
            // Handle the click action
            })
        .withAdListener( ... )
        .withNativeAdOptions( ... )
        .build()

เมธอด forCustomFormatAd จะกําหนดค่า AdLoader เพื่อขอรูปแบบโฆษณาเนทีฟที่กําหนดเอง พารามิเตอร์ที่ส่งไปยังเมธอดมี 3 รายการ ดังนี้

  • รหัสของรูปแบบโฆษณาเนทีฟที่กำหนดเองซึ่ง AdLoader ควรขอ โฆษณาเนทีฟที่กําหนดเองแต่ละรูปแบบจะมีรหัสที่เชื่อมโยงอยู่ พารามิเตอร์นี้ระบุว่าแอปต้องการให้ AdLoader ขอรูปแบบใด
  • OnCustomFormatAdLoadedListener เพื่อเรียกใช้เมื่อโฆษณาโหลดสําเร็จ
  • ไม่บังคับ OnCustomClickListener ที่จะเรียกใช้เมื่อผู้ใช้แตะหรือคลิกโฆษณา ดูข้อมูลเพิ่มเติมเกี่ยวกับตัวฟังนี้ได้ที่ส่วน "การจัดการการคลิกและการแสดงผล" ด้านล่าง

เนื่องจากหน่วยโฆษณาเดียวสามารถตั้งค่าให้แสดงครีเอทีฟโฆษณาได้มากกว่า 1 รูปแบบ คุณจึงเรียกใช้ forCustomFormatAd หลายครั้งได้โดยใช้รหัสรูปแบบที่ไม่ซ้ำกันเพื่อเตรียมตัวโหลดโฆษณาสำหรับรูปแบบโฆษณาเนทีฟที่กำหนดเองได้มากกว่า 1 รูปแบบ

รหัสรูปแบบโฆษณาเนทีฟที่กำหนดเอง

รหัสรูปแบบที่ใช้ระบุรูปแบบโฆษณาเนทีฟที่กําหนดเองจะอยู่ใน UI ของ Ad Manager ในส่วนเนทีฟภายในเมนูแบบเลื่อนลงการแสดงโฆษณา

รหัสรูปแบบโฆษณาเนทีฟที่กำหนดเองแต่ละรายการจะปรากฏอยู่ด้านข้างชื่อ การคลิกชื่อใดชื่อหนึ่งจะนำคุณไปยังหน้าจอรายละเอียดที่แสดงข้อมูลเกี่ยวกับช่องของรูปแบบ

จากที่นี่ คุณจะเพิ่ม แก้ไข และนำฟิลด์แต่ละรายการออกได้ จดชื่อของเนื้อหาแต่ละรายการไว้ ชื่อคือคีย์ที่ใช้รับข้อมูลสำหรับชิ้นงานแต่ละรายการเมื่อแสดงรูปแบบโฆษณาเนทีฟที่กำหนดเอง

แสดงรูปแบบโฆษณาเนทีฟที่กำหนดเอง

รูปแบบโฆษณาเนทีฟที่กำหนดเองแตกต่างจากรูปแบบที่ระบบกำหนด นั่นคือผู้เผยแพร่โฆษณาสามารถกำหนดรายการเนื้อหาของตนเองที่ประกอบกันเป็นโฆษณา ดังนั้น กระบวนการแสดงรูปแบบจะแตกต่างจากรูปแบบที่ระบบกำหนดดังนี้

  1. เนื่องจากคลาส NativeCustomFormatAd มีไว้เพื่อจัดการรูปแบบโฆษณาเนทีฟ ที่กำหนดเองที่คุณกำหนดไว้ใน Ad Manager จึงไม่ตั้งชื่อว่า "เครื่องมือ" สำหรับเนื้อหา แต่จะมีเมธอดอย่าง getText และ getImage ที่ใช้ชื่อของช่องเป็นพารามิเตอร์แทน
  2. ไม่มีคลาสการแสดงโฆษณาเฉพาะ เช่น NativeAdView เพื่อใช้กับ NativeCustomFormatAd คุณสามารถใช้การจัดวางใดก็ได้ที่เหมาะกับประสบการณ์ของผู้ใช้
  3. เนื่องจากไม่มีคลาส ViewGroup โดยเฉพาะ คุณจึงไม่ต้องลงทะเบียนมุมมองใดๆ ที่ใช้แสดงชิ้นงานของโฆษณา วิธีนี้จะช่วยประหยัดโค้ดได้ 2-3 บรรทัดเมื่อแสดงโฆษณา แต่คุณจะต้องทํางานเพิ่มอีกเล็กน้อยเพื่อจัดการกับการคลิกในภายหลัง

ตัวอย่างฟังก์ชันที่แสดง NativeCustomFormatAd

Java

public void displayCustomFormatAd (ViewGroup parent,
                                     NativeCustomFormatAd customFormatAd) {
    // Inflate a layout and add it to the parent ViewGroup.
    LayoutInflater inflater = (LayoutInflater) parent.getContext()
            .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    View adView = inflater.inflate(R.layout.custom_format_ad, parent);

    // Locate the TextView that will hold the value for "Headline" and
    // set its text.
    TextView myHeadlineView = (TextView) adView.findViewById(R.id.headline);
    myHeadlineView.setText(customFormatAd.getText("Headline"));

    // Locate the ImageView that will hold the value for "MainImage" and
    // set its drawable.
    Button myMainImageView = (ImageView) adView.findViewById(R.id.main_image);
    myMainImageView.setImageDrawable(
            customFormatAd.getImage("MainImage").getDrawable());

    ...
    // Continue locating views and displaying assets until finished.
    ...
}

Kotlin

public fun displayCustomFormatAd (parent: ViewGroup,
                                customFormatAd: NativeCustomFormatAd) {
    val adView = layoutInflater
            .inflate(R.layout.ad_simple_custom_format, null)

    val myHeadlineView = adView.findViewById<TextView>(R.id.headline)
    myHeadlineView.setText(customFormatAd.getText("Headline"));

    // Locate the ImageView that will hold the value for "MainImage" and
    // set its drawable.
    val myMainImageView = adView.findViewById(R.id.main_image);
    myMainImageView.setImageDrawable(
            customFormatAd.getImage("MainImage").drawable);

    ...
    // Continue locating views and displaying assets until finished.
    ...
}

แสดงผลไอคอนตัวเลือกโฆษณาอื่นๆ

โฆษณาแบบจองล่วงหน้าที่แสดงในเขตเศรษฐกิจยุโรป (EEA) ต้องมีไอคอนตัวเลือกโฆษณาอื่นๆ และลิงก์ไปยังหน้าเกี่ยวกับโฆษณานี้ของ Google เพื่อรองรับกฎหมายบริการดิจิทัล (DSA) เมื่อติดตั้งใช้งานโฆษณาเนทีฟที่กำหนดเอง คุณจะเป็นผู้รับผิดชอบในการแสดงผลไอคอนตัวเลือกโฆษณาอื่นๆ เราขอแนะนําให้คุณทําตามขั้นตอนเพื่อแสดงผลและตั้งค่า Listener การคลิกสําหรับไอคอนตัวเลือกโฆษณาอื่นๆ เมื่อแสดงผลชิ้นงานโฆษณาหลัก

ตัวอย่างต่อไปนี้จะสมมติว่าคุณได้กําหนดองค์ประกอบ <ImageView /> ในลําดับชั้นของมุมมองเพื่อแสดงโลโก้ตัวเลือกโฆษณาอื่นๆ

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android">
    <ImageView
        android:id="@+id/adChoices"
        android:layout_width="15dp"
        android:layout_height="15dp"
        android:adjustViewBounds="true"
        android:contentDescription="AdChoices icon." />
</LinearLayout>

ตัวอย่างต่อไปนี้แสดงการแสดงผลไอคอนตัวเลือกโฆษณาอื่นๆ และการกำหนดค่าลักษณะการคลิกที่เหมาะสม

Java

private AdSimpleCustomTemplateBinding customTemplateBinding;

private void populateAdView(final NativeCustomFormatAd nativeCustomFormatAd) {
  // Render the AdChoices icon.
  String adChoicesKey = NativeAdAssetNames.ASSET_ADCHOICES_CONTAINER_VIEW;
  NativeAd.Image adChoicesAsset = nativeCustomFormatAd.getImage(adChoicesKey);
  if (adChoicesAsset == null) {
    customTemplateBinding.adChoices.setVisibility(View.GONE);
  } else {
    customTemplateBinding.adChoices.setVisibility(View.VISIBLE);
    customTemplateBinding.adChoices.setImageDrawable(adChoicesAsset.getDrawable());

    // Enable clicks on AdChoices.
    customTemplateBinding.adChoices.setOnClickListener(
        new View.OnClickListener() {
          @Override
          public void onClick(View v) {
            nativeCustomFormatAd.performClick(adChoicesKey);
          }
        });
  }
  ...
}

Kotlin

private lateinit var customTemplateBinding: AdSimpleCustomTemplateBinding

private fun populateAdView(nativeCustomFormatAd: NativeCustomFormatAd) {
  // Render the AdChoices icon.
  val adChoicesKey = NativeAdAssetNames.ASSET_ADCHOICES_CONTAINER_VIEW
  val adChoicesAsset = nativeCustomFormatAd.getImage(adChoicesKey)
  if (adChoicesAsset == null) {
    customTemplateBinding.adChoices.visibility = View.GONE
  } else {
    customTemplateBinding.adChoices.setImageDrawable(adChoicesAsset.drawable)
    customTemplateBinding.adChoices.visibility = View.VISIBLE

    // Enable clicks on AdChoices.
    customTemplateBinding.adChoices.setOnClickListener {
      nativeCustomFormatAd.performClick(adChoicesKey)
    }
  }
  ...
}

วิดีโอเนทีฟสำหรับรูปแบบโฆษณาเนทีฟที่กำหนดเอง

เมื่อสร้างรูปแบบที่กำหนดเอง คุณจะมีตัวเลือกในการทำให้รูปแบบมีสิทธิ์แสดงวิดีโอ

ในการใช้งานแอป คุณสามารถใช้ NativeCustomFormatAd.getMediaContent() เพื่อรับเนื้อหาสื่อ จากนั้นเรียกใช้ setMediaContent() เพื่อตั้งค่าเนื้อหาสื่อในมุมมองสื่อเป็นมุมมองสื่อ หากโฆษณาไม่มีเนื้อหาวิดีโอ ลองวางแผนแบบอื่นเพื่อแสดงโฆษณาโดยไม่มีวิดีโอ

ตัวอย่างด้านล่างจะตรวจสอบว่าโฆษณามีเนื้อหาวิดีโอหรือไม่ และแสดงรูปภาพแทนหากไม่มีวิดีโอ

Java

// Called when a custom native ad loads.
@Override
public void onCustomFormatAdLoaded(final NativeCustomFormatAd ad) {

  MediaContent mediaContent = ad.getMediaContent();

  // Assumes you have a FrameLayout in your view hierarchy with the id media_placeholder.
  FrameLayout mediaPlaceholder = (FrameLayout) findViewById(R.id.media_placeholder);

  // Apps can check the MediaContent's hasVideoContent property to determine if the
  // NativeCustomFormatAd has a video asset.
  if (mediaContent != null && mediaContent.hasVideoContent()) {
    MediaView mediaView = new MediaView(mediaPlaceholder.getContext());
    mediaView.setMediaContent(mediaContent);
    mediaPlaceholder.addView(mediaView);

    // Create a new VideoLifecycleCallbacks object and pass it to the VideoController. The
    // VideoController will call methods on this object when events occur in the video
    // lifecycle.
    VideoController vc = mediaContent.getVideoController();
    vc.setVideoLifecycleCallbacks(
        new VideoController.VideoLifecycleCallbacks() {
          @Override
          public void onVideoEnd() {
            // Publishers should allow native ads to complete video playback before
            // refreshing or replacing them with another ad in the same UI location.
            super.onVideoEnd();
          }
        });
  } else {
    ImageView mainImage = new ImageView(this);
    mainImage.setAdjustViewBounds(true);
    mainImage.setImageDrawable(ad.getImage("MainImage").getDrawable());
    mediaPlaceholder.addView(mainImage);
    mainImage.setOnClickListener(
        new View.OnClickListener() {
          @Override
          public void onClick(View view) {
            ad.performClick("MainImage");
          }
        });
  }
}

Kotlin

// Called when a custom native ad loads.
NativeCustomFormatAd.OnCustomFormatAdLoadedListener { ad ->

  val mediaContent = ad.mediaContent

  // Apps can check the MediaContent's hasVideoContent property to determine if the
  // NativeCustomFormatAd has a video asset.
  if (mediaContent != null && mediaContent.hasVideoContent()) {
    val mediaView = MediaView(mediaPlaceholder.getContest())
    mediaView.mediaContent = mediaContent

    val videoController = mediaContent.videoController

    // Create a new VideoLifecycleCallbacks object and pass it to the VideoController. The
    // VideoController will call methods on this object when events occur in the video
    // lifecycle.
    if (videoController != null) {
      videoController.videoLifecycleCallbacks =
        object : VideoController.VideoLifecycleCallbacks() {
          override fun onVideoEnd() {
            // Publishers should allow native ads to complete video playback before refreshing
            // or replacing them with another ad in the same UI location.
            super.onVideoEnd()
          }
        }
    }
  } else {
    val mainImage = ImageView(this)
    mainImage.adjustViewBounds = true
    mainImage.setImageDrawable(ad.getImage("MainImage")?.drawable)

    mainImage.setOnClickListener { ad.performClick("MainImage") }
    customTemplateBinding.simplecustomMediaPlaceholder.addView(mainImage)
  }
}

ดูข้อมูลเพิ่มเติมเกี่ยวกับวิธีปรับแต่งประสบการณ์วิดีโอของโฆษณาเนทีฟที่กำหนดเองได้ที่ MediaContent

ดาวน์โหลดตัวอย่างการแสดงผลที่กำหนดเองของ Ad Manager สำหรับตัวอย่างการใช้งานวิดีโอเนทีฟในการใช้งาน

จํานวนคลิกและการแสดงผลของโฆษณาเนทีฟรูปแบบที่กําหนดเอง

เมื่อใช้รูปแบบโฆษณาเนทีฟที่กําหนดเอง แอปของคุณมีหน้าที่รับผิดชอบในการบันทึกการแสดงผลและรายงานเหตุการณ์การคลิกไปยัง Google Mobile Ads SDK

บันทึกการแสดงผล

หากต้องการบันทึกการแสดงผลสำหรับโฆษณาที่มีรูปแบบที่กำหนดเอง ให้เรียกเมธอด recordImpression ใน NativeCustomFormatAd ที่เกี่ยวข้องดังนี้

myCustomFormatAd.recordImpression();

หากแอปเรียกใช้เมธอด 2 ครั้งสําหรับโฆษณาเดียวกันโดยไม่ตั้งใจ SDK จะป้องกันไม่ให้บันทึกการแสดงผลที่ซ้ำกันสําหรับคําขอเดียวโดยอัตโนมัติ

รายงานการคลิก

หากต้องการรายงานให้ SDK ทราบว่ามีการคลิกในมุมมองชิ้นงาน ให้เรียกใช้เมธอด performClick ใน NativeCustomFormatAd ที่เกี่ยวข้อง แล้วส่งชื่อชิ้นงานที่คลิก ตัวอย่างเช่น หากคุณมีชิ้นงานในรูปแบบที่กำหนดเองชื่อ "MainImage" และต้องการรายงานการคลิก ImageView ที่สอดคล้องกับชิ้นงานดังกล่าว โค้ดจะมีลักษณะดังนี้

myCustomFormatAd.performClick("MainImage");

โปรดทราบว่าคุณไม่จําเป็นต้องเรียกใช้เมธอดนี้สําหรับการดูทุกรายการที่เชื่อมโยงกับโฆษณา หากคุณมีช่องอื่นชื่อ "คำบรรยาย" ที่มีไว้เพื่อแสดงแต่ผู้ใช้ไม่ได้คลิกหรือแตะ แอปของคุณก็ไม่จําเป็นต้องเรียกใช้ performClick สําหรับยอดดูของชิ้นงานนั้น

ตอบสนองต่อการคลิกที่กำหนดเอง

เมื่อมีการคลิกโฆษณารูปแบบที่กำหนดเอง อาจมีคำตอบจาก SDK 3 รายการ ซึ่งจะพยายามดำเนินการตามลําดับนี้

  1. เรียกใช้ OnCustomClickListener จาก AdLoader หากมี
  2. สําหรับ URL ของ Deep Link แต่ละรายการของโฆษณา ให้พยายามค้นหาโปรแกรมแก้ไขเนื้อหา และเริ่มรายการแรกที่แก้ไขได้
  3. เปิดเบราว์เซอร์และไปที่ URL ปลายทางเดิมของโฆษณา

เมธอด forCustomFormatAd ยอมรับ OnCustomClickListener หากคุณส่งออบเจ็กต์ตัวฟังเข้ามา SDK จะเรียกใช้เมธอด onCustomClick แทนและจะไม่ดําเนินการใดๆ เพิ่มเติม อย่างไรก็ตาม หากคุณส่งค่า Null เป็นผู้ฟัง SDK จะเปลี่ยนไปใช้ Deep Link และ/หรือ URL ปลายทางที่ลงทะเบียนกับโฆษณา

โปรแกรมรับฟังการคลิกที่กําหนดเองช่วยให้แอปตัดสินใจได้ว่าควรดําเนินการใดดีที่สุดเมื่อมีการคลิก ไม่ว่าจะเป็นการอัปเดต UI, การเริ่มกิจกรรมใหม่ หรือเพียงแค่บันทึกการคลิก ต่อไปนี้คือตัวอย่างที่บันทึกเพียงว่ามีคลิกเกิดขึ้น

Java

AdLoader adLoader = new AdLoader.Builder(context, "/21775744923/example/native")
    .forCustomFormatAd("10063170",
      new NativeCustomFormatAd.OnCustomFormatAdLoadedListener() {
        // Display the ad.
      },
      new NativeCustomFormatAd.OnCustomClickListener() {
          @Override
          public void onCustomClick(NativeCustomFormatAd ad, String assetName) {
            Log.i("MyApp", "A custom click just happened for " + assetName + "!");
          }
      }).build();

Kotlin

val adLoader = AdLoader.Builder(this, "/21775744923/example/native")
    .forCustomFormatAd("10063170",
        { ad ->
            // Display the ad.
        },
        { ad, assetName ->
                Log.i("MyApp", "A custom click just happened for $assetName!")
    }).build()

ตอนแรกอาจดูแปลกๆ ว่ามี Listener การคลิกที่กําหนดเอง ท้ายที่สุดแล้ว แอปของคุณเพิ่งบอก SDK ว่ามีการคลิกเกิดขึ้นแล้ว SDK จะไปรายงานเรื่องนี้กลับไปยังแอปทำไม

โฟลว์ข้อมูลนี้เป็นประโยชน์ด้วยเหตุผล 2-3 ประการ แต่ที่สำคัญที่สุดคือช่วยให้ SDK ยังคงควบคุมการตอบสนองต่อการคลิกได้ เช่น สามารถปิง URL ติดตามของบุคคลที่สามที่ตั้งค่าไว้สําหรับครีเอทีฟโฆษณาโดยอัตโนมัติ และจัดการงานอื่นๆ เบื้องหลังได้โดยไม่ต้องใช้โค้ดเพิ่มเติม