ตั้งค่าโฆษณาแบนเนอร์

เลือกแพลตฟอร์ม: Android ใหม่ Android iOS Unity Flutter

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

คู่มือนี้ครอบคลุมการโหลดโฆษณาแบนเนอร์แบบปรับขนาดได้ที่ยึดตำแหน่งไว้ลงในแอป Android

ข้อกำหนดเบื้องต้น

  • ตั้งค่า Google Mobile Ads SDK
  • ไม่บังคับ: หากต้องการดูตัวอย่างการติดตั้งใช้งานโฆษณาแบนเนอร์ ให้เลือกแอปตัวอย่างใดแอปหนึ่งต่อไปนี้
    • ตัวอย่างโฆษณาแบนเนอร์แบบปรับขนาดได้ที่ยึดตำแหน่งไว้ของ Java, Kotlin, หรือ Jetpack Compose
    • ตัวอย่างฟีเจอร์ขั้นสูงของ Java หรือ Kotlin

ทดสอบด้วยโฆษณาสำหรับการทดสอบเสมอ

เมื่อสร้างและทดสอบแอป โปรดใช้โฆษณาสำหรับการทดสอบแทนโฆษณาจริง หากไม่ทำเช่นนั้นอาจส่งผลให้บัญชีถูกระงับ

วิธีที่ง่ายที่สุดในการโหลดโฆษณาสำหรับการทดสอบคือการใช้รหัสหน่วยโฆษณาสำหรับการทดสอบโดยเฉพาะสำหรับแบนเนอร์ Android ดังนี้

/21775744923/example/adaptive-banner

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

ดูข้อมูลเพิ่มเติมเกี่ยวกับวิธีทำงานของโฆษณาสำหรับการทดสอบของ Google Mobile Ads SDK ได้ที่หัวข้อ เปิดใช้โฆษณาสำหรับการทดสอบ

กำหนดการดูโฆษณา

เลย์เอาต์ XML

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

<!-- Ad view container that fills the width of the screen and adjusts its
    height to the content of the ad. -->
<FrameLayout
        android:id="@+id/ad_view_container"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_alignParentBottom="true" />

Jetpack Compose

  1. รวมโฟลเดอร์ JetpackCompose Utilities โฟลเดอร์นี้มีตัวช่วยในการสร้างออบเจ็กต์ AdView และชิ้นงานโฆษณา

  2. สร้าง AdView


// Place the ad view at the bottom of the screen.
Column(modifier = modifier.fillMaxSize(), verticalArrangement = Arrangement.Bottom) {
  Box(modifier = modifier.fillMaxWidth()) { AdManagerBannerAd(adView, modifier) }
}

กำหนดขนาดโฆษณา

กำหนด AdSize เป็นประเภทโฆษณาแบนเนอร์แบบปรับขนาดได้ที่ยึดตำแหน่งไว้โดยระบุความกว้าง

Java


// Request an anchored adaptive banner with a width of 360.
adView.setAdSize(AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(this, 360));

Kotlin


// Request a large anchored adaptive banner with a width of 360.
adView.setAdSize(AdSize.getLargeAnchoredAdaptiveBannerAdSize(this, 360))

Jetpack Compose


// Set a large anchored adaptive banner ad size with a given width.
val adSize = AdSize.getLargeAnchoredAdaptiveBannerAdSize(LocalContext.current, 360)
adView.setAdSize(adSize)

เพิ่ม AdManagerAdView ลงในเลย์เอาต์

สร้าง AdManagerAdView โดยใช้ขนาดโฆษณาเพื่อเพิ่มลงใน เลย์เอาต์ของแอป

Java


// Create a new ad view.
adView = new AdManagerAdView(this);
adView.setAdUnitId(AD_UNIT);
// Request an anchored adaptive banner with a width of 360.
adView.setAdSize(AdSize.getCurrentOrientationAnchoredAdaptiveBannerAdSize(this, 360));

// Replace ad container with new ad view.
adContainerView.removeAllViews();
adContainerView.addView(adView);

Kotlin


// Create a new ad view.
val adView = AdManagerAdView(this)
adView.adUnitId = AD_UNIT_ID
// Request a large anchored adaptive banner with a width of 360.
adView.setAdSize(AdSize.getLargeAnchoredAdaptiveBannerAdSize(this, 360))
this.adView = adView

// Replace ad container with new ad view.
binding.adViewContainer.removeAllViews()
binding.adViewContainer.addView(adView)

Jetpack Compose


val adView = remember { AdManagerAdView(context) }

// Setup and load the adview.
// Set the unique ID for this specific ad unit.
adView.adUnitId = ADMANAGER_ADAPTIVE_BANNER_AD_UNIT_ID

// Set a large anchored adaptive banner ad size with a given width.
val adSize = AdSize.getLargeAnchoredAdaptiveBannerAdSize(LocalContext.current, 360)
adView.setAdSize(adSize)

// Place the ad view at the bottom of the screen.
Column(modifier = modifier.fillMaxSize(), verticalArrangement = Arrangement.Bottom) {
  Box(modifier = modifier.fillMaxWidth()) { AdManagerBannerAd(adView, modifier) }
}

โหลดโฆษณา

ตัวอย่างต่อไปนี้จะโหลดโฆษณาแบนเนอร์แบบปรับขนาดได้ที่ยึดตำแหน่งไว้ซึ่งมีความกว้าง 360 ลงในออบเจ็กต์ AdManagerAdView

loadAd()

Java

AdManagerAdRequest adRequest = new AdManagerAdRequest.Builder().build();
adView.loadAd(adRequest);

Kotlin

val adRequest = AdManagerAdRequest.Builder().build()
adView.loadAd(adRequest)

รีเฟรชโฆษณา

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

ปล่อยทรัพยากรโฆษณา

เมื่อใช้โฆษณาแบนเนอร์เสร็จแล้ว คุณสามารถปล่อยทรัพยากรของโฆษณาแบนเนอร์ได้

หากต้องการปล่อยทรัพยากรของโฆษณา ให้นำโฆษณาออกจากลำดับชั้นการแสดงผลและยกเลิกการอ้างอิงทั้งหมด

Java

public void destroyBanner() {
  // Remove banner from view hierarchy.
  if (adView != null) {
    View parentView = (View) adView.getParent();
    if (parentView instanceof ViewGroup) {
      ((ViewGroup) parentView).removeView(adView);
    }

    // Destroy the banner ad resources.
    adView.destroy();
  }

  // Drop reference to the banner ad.
  adView = null;
}

Kotlin

fun destroyBanner() {
  // Remove banner from view hierarchy.
  val parentView = adView?.parent
  if (parentView is ViewGroup) {
    parentView.removeView(adView)
  }

  // Destroy the banner ad resources.
  adView?.destroy()

  // Drop reference to the banner ad.
  adView = null
}

เหตุการณ์โฆษณา

คุณสามารถรับฟังเหตุการณ์ต่างๆ ในวงจรชีวิตของโฆษณา ซึ่งรวมถึงการโหลด การแสดงผลและการคลิกโฆษณา รวมถึงเหตุการณ์การเปิดและปิดโฆษณา เราขอแนะนำให้ตั้งค่าการเรียกกลับก่อนโหลดแบนเนอร์

Java

if (adView != null) {
  adView.setAdListener(
      new AdListener() {
        @Override
        public void onAdClicked() {
          // Code to be executed when the user clicks on an ad.
        }

        @Override
        public void onAdClosed() {
          // Code to be executed when the user is about to return
          // to the app after tapping on an ad.
        }

        @Override
        public void onAdFailedToLoad(@NonNull LoadAdError adError) {
          // Code to be executed when an ad request fails.
        }

        @Override
        public void onAdImpression() {
          // Code to be executed when an impression is recorded
          // for an ad.
        }

        @Override
        public void onAdLoaded() {
          // Code to be executed when an ad finishes loading.
        }

        @Override
        public void onAdOpened() {
          // Code to be executed when an ad opens an overlay that
          // covers the screen.
        }
      });
}

Kotlin

adView?.adListener =
  object : AdListener() {
    override fun onAdClicked() {
      // Code to be executed when the user clicks on an ad.
    }

    override fun onAdClosed() {
      // Code to be executed when the user is about to return
      // to the app after tapping on an ad.
    }

    override fun onAdFailedToLoad(adError: LoadAdError) {
      // Code to be executed when an ad request fails.
    }

    override fun onAdImpression() {
      // Code to be executed when an impression is recorded
      // for an ad.
    }

    override fun onAdLoaded() {
      // Code to be executed when an ad finishes loading.
    }

    override fun onAdOpened() {
      // Code to be executed when an ad opens an overlay that
      // covers the screen.
    }
  }

เมธอดที่แทนที่ได้แต่ละเมธอดใน AdListener จะสอดคล้องกับเหตุการณ์ในวงจรชีวิตของโฆษณา

เมธอดที่แทนที่ได้
onAdClicked() เมธอด onAdClicked() จะทำงานเมื่อมีการบันทึกการคลิกโฆษณา
onAdClosed() เมธอด onAdClosed() จะทำงานเมื่อผู้ใช้กลับมาที่แอปหลังจากดู URL ปลายทางของโฆษณา แอปของคุณสามารถใช้เมธอดนี้เพื่อดำเนินการต่อในกิจกรรมที่หยุดชั่วคราวหรือ ทำงานอื่นๆ ที่จำเป็นเพื่อให้พร้อมสำหรับการโต้ตอบ
onAdFailedToLoad() เมธอด onAdFailedToLoad() เป็นเมธอดเดียวที่มีพารามิเตอร์ พารามิเตอร์ข้อผิดพลาดประเภท LoadAdError จะอธิบายข้อผิดพลาดที่เกิดขึ้น ดูข้อมูลเพิ่มเติมได้ที่ เอกสารประกอบการแก้ไขข้อบกพร่องของข้อผิดพลาดในการโหลดโฆษณา
onAdImpression() เมธอด onAdImpression() จะทำงานเมื่อมีการบันทึกการแสดงผลโฆษณา
onAdLoaded() เมธอด onAdLoaded() จะทำงานเมื่อโฆษณาโหลดเสร็จแล้ว หากต้องการหน่วงเวลาการเพิ่ม AdManagerAdView ลงในกิจกรรมหรือ Fragment จนกว่าจะแน่ใจว่าโฆษณาจะโหลดแล้ว คุณสามารถทำได้ที่นี่
onAdOpened() เมธอด onAdOpened() จะทำงานเมื่อโฆษณาเปิดการซ้อนทับที่ครอบคลุมหน้าจอ

การเร่งฮาร์ดแวร์สำหรับโฆษณาวิดีโอ

โฆษณาวิดีโอจะแสดงในมุมมองโฆษณาแบนเนอร์ได้สำเร็จก็ต่อเมื่อเปิดใช้การเร่ง ฮาร์ดแวร์แล้ว

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

เปิดใช้การเร่งฮาร์ดแวร์

หากแอปทำงานไม่ถูกต้องเมื่อเปิดใช้การเร่งฮาร์ดแวร์ทั่วโลก คุณสามารถควบคุมการเร่งฮาร์ดแวร์สำหรับแต่ละกิจกรรมได้เช่นกัน หากต้องการเปิดหรือ ปิดใช้การเร่งฮาร์ดแวร์ คุณสามารถใช้android:hardwareAccelerated แอตทริบิวต์สำหรับ <application> และ <activity> องค์ประกอบใน AndroidManifest.xml ตัวอย่างต่อไปนี้จะเปิดใช้การเร่งฮาร์ดแวร์สำหรับทั้งแอป แต่ปิดใช้สำหรับกิจกรรมหนึ่งๆ

<application android:hardwareAccelerated="true">
    <!-- For activities that use ads, hardwareAcceleration should be true. -->
    <activity android:hardwareAccelerated="true" />
    <!-- For activities that don't use ads, hardwareAcceleration can be false. -->
    <activity android:hardwareAccelerated="false" />
</application>

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

การนับการแสดงผลด้วยตนเอง

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

คุณสามารถส่งคำสั่ง ping การแสดงผลไปยัง Ad Manager ด้วยตนเองได้หากมีเงื่อนไขพิเศษสำหรับเวลาที่ควรบันทึกการแสดงผล

Java

if (adManagerAdView != null) {
  adManagerAdView.setManualImpressionsEnabled(true);
}

Kotlin

adManagerAdView?.setManualImpressionsEnabled(true)

เมื่อพิจารณาแล้วว่าระบบแสดงโฆษณาได้สำเร็จและโฆษณาปรากฏบนหน้าจอ คุณสามารถบันทึกการแสดงผลด้วยตนเองได้

Java

if (adManagerAdView != null) {
  adManagerAdView.recordManualImpression();
}

Kotlin

adManagerAdView?.recordManualImpression()

เหตุการณ์ของแอป

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

คุณสามารถรับฟังเหตุการณ์ของแอปที่เฉพาะเจาะจงของ Ad Manager ได้โดยใช้ AppEventListener เหตุการณ์เหล่านี้อาจเกิดขึ้นได้ทุกเมื่อในวงจรชีวิตของโฆษณา แม้กระทั่งก่อนที่จะมีการเรียกใช้ onAdLoaded()

ตั้งค่า AppEventListener ใน AdManagerAdView

Java

if (adManagerAdView != null) {
  adManagerAdView.setAppEventListener(this);
}

Kotlin

adManagerAdView?.appEventListener = this

ตัวอย่างต่อไปนี้แสดงวิธีเปลี่ยนสีพื้นหลังของแอปโดยขึ้นอยู่กับเหตุการณ์ของแอปที่มีชื่อว่า "สี"

Java

@Override
public void onAppEvent(@NonNull String name, @NonNull String info) {
  if (name.equals("color")) {
    switch (info) {
      case "green":
        // Set background color to green.
        break;
      case "blue":
        // Set background color to blue.
        break;
      default:
        // Set background color to black.
        break;
    }
  }
}

Kotlin

override fun onAppEvent(name: String, info: String) {
  if (name == "color") {
    when (info) {
      "green" -> {
        // Set background color to green.
      }
      "blue" -> {
        // Set background color to blue.
      }
      else -> {
        // Set background color to black.
      }
    }
  }
}

และนี่คือครีเอทีฟโฆษณาที่เกี่ยวข้องซึ่งส่งข้อความเหตุการณ์ของแอปสีไปยัง Listener

<html>
<head>
  <script src="//www.gstatic.com/afma/api/v1/google_mobile_app_ads.js"></script>
  <script>
    document.addEventListener("DOMContentLoaded", function() {
      // Send a color=green event when ad loads.
      admob.events.dispatchAppEvent("color", "green");

      document.getElementById("ad").addEventListener("click", function() {
        // Send a color=blue event when ad is clicked.
        admob.events.dispatchAppEvent("color", "blue");
      });
    });
  </script>
  <style>
    #ad {
      width: 320px;
      height: 50px;
      top: 0px;
      left: 0px;
      font-size: 24pt;
      font-weight: bold;
      position: absolute;
      background: black;
      color: white;
      text-align: center;
    }
  </style>
</head>
<body>
  <div id="ad">Carpe diem!</div>
</body>
</html>

ดูตัวอย่างเหตุการณ์ของแอป Ad Manager สำหรับการติดตั้งใช้งานเหตุการณ์ของแอปในแอป API เดโม

Java Kotlin JetpackCompose

ขั้นตอนถัดไป

แบนเนอร์แบบยุบได้

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

แบนเนอร์แบบปรับขนาดได้ที่แทรกในบรรทัด

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

สำรวจหัวข้ออื่นๆ