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

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

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

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

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

สร้าง AdLoader

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

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();

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

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

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.
    ...
}

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>

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

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);
          }
        });
  }
  ...
}

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() เพื่อตั้งค่าเนื้อหาสื่อในมุมมองสื่อ หากโฆษณาไม่มีเนื้อหาวิดีโอ ให้สร้างแผนสำรองเพื่อแสดงโฆษณาโดยไม่มีวิดีโอ

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

// 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");
          }
        });
  }
}

// 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, การเริ่มกิจกรรมใหม่ หรือเพียงแค่บันทึกการคลิก ต่อไปนี้คือตัวอย่างที่บันทึกเพียงว่ามีคลิกเกิดขึ้น

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();

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()

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

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