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

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

คู่มือนี้แสดงวิธีผสานรวมมุมมองแบนเนอร์ลงในแอป Unity นอกจากข้อมูลโค้ดและวิธีการแล้ว ยังมีข้อมูลเกี่ยวกับการปรับขนาดแบนเนอร์อย่างเหมาะสมและลิงก์ไปยังแหล่งข้อมูลเพิ่มเติมด้วย

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

ตั้งค่า Google Mobile Ads Unity Plugin ก่อนดำเนินการต่อ

ทดสอบด้วยโฆษณาทดสอบเสมอ

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

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

/21775744923/example/interstitial

เริ่มต้น Google Mobile Ads Unity Plugin

ก่อนโหลดโฆษณา ให้แอปเริ่มต้น Google Mobile Ads Unity Plugin โดยเรียกใช้ MobileAds.Initialize() ซึ่งต้องดำเนินการเพียงครั้งเดียว โดยควรทำเมื่อเปิดแอป

using GoogleMobileAds;
using GoogleMobileAds.Api;

public class GoogleMobileAdsDemoScript : MonoBehaviour
{
    public void Start()
    {
        // Initialize Google Mobile Ads Unity Plugin.
        MobileAds.Initialize((InitializationStatus initStatus) =>
        {
            // This callback is called once the MobileAds SDK is initialized.
        });
    }
}

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

ตัวอย่าง BannerView

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

สร้างมุมมองแบนเนอร์

ขั้นตอนแรกในการใช้มุมมองแบนเนอร์คือการสร้างอินสแตนซ์ของมุมมองแบนเนอร์

// Create a 320x50 banner at top of the screen.
adManagerBannerView = new AdManagerBannerView("AD_UNIT_ID", AdSize.Banner, AdPosition.Top);

แทนที่ AD_UNIT_ID ด้วยรหัสหน่วยโฆษณา

ตัวสร้างสำหรับ AdManagerBannerView มีพารามิเตอร์ต่อไปนี้

  • adUnitId: รหัสหน่วยโฆษณาของโฆษณาแบนเนอร์ที่จะโหลด
  • AdSize: ขนาดแบนเนอร์ที่ต้องการใช้
  • AdPosition: ตำแหน่งที่ควรวางมุมมองแบนเนอร์

(ไม่บังคับ) สร้างมุมมองแบนเนอร์ที่มีตำแหน่งที่กำหนดเอง

หากต้องการควบคุมตำแหน่งที่วางมุมมองแบนเนอร์บนหน้าจอได้มากกว่าค่า AdPosition ให้ใช้คอนสตรัคเตอร์ที่มีพิกัด x และ y เป็นพารามิเตอร์ ดังนี้

// Create a 320x50 banner views at coordinate (0,50) on screen.
adManagerBannerView = new AdManagerBannerView("AD_UNIT_ID", AdSize.Banner, 0, 50);

มุมซ้ายบนของมุมมองแบนเนอร์จะอยู่ที่ค่า x และ y ที่ส่งไปยังตัวสร้าง โดยที่จุดเริ่มต้นคือมุมซ้ายบนของหน้าจอ

(ไม่บังคับ) สร้างมุมมองแบนเนอร์ที่มีขนาดที่กำหนดเอง

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

// Create a 250x250 banner at the bottom of the screen.
AdSize adSize = new AdSize(250, 250);
adManagerBannerView = new AdManagerBannerView("AD_UNIT_ID", adSize, AdPosition.Bottom);

(ไม่บังคับ) โฆษณาหลายขนาด

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

ในแอป ให้ส่งพารามิเตอร์ AdSize หลายรายการไปยัง ValidAdSizes ดังนี้

// Create a 250x250 banner at the bottom of the screen.
adManagerBannerView = new AdManagerBannerView("AD_UNIT_ID", AdSize.Banner, AdPosition.Top);

// Add multiple ad sizes.
adManagerBannerView.ValidAdSizes = new List<AdSize>
{
    AdSize.Banner,
    new AdSize(120, 20),
    new AdSize(250, 250),
};

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

โหลดโฆษณาแบนเนอร์

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

หากต้องการโหลดโฆษณา ให้สร้าง AdManagerAdRequest แล้วส่งไปยังเมธอด LoadAd()

// Send a request to load an ad into the banner view.
adManagerBannerView.LoadAd(new AdManagerAdRequest());

รอเหตุการณ์การดูแบนเนอร์

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

adManagerBannerView.OnBannerAdLoaded += () =>
{
    // Raised when an ad is loaded into the banner view.
};
adManagerBannerView.OnBannerAdLoadFailed += (LoadAdError error) =>
{
    // Raised when an ad fails to load into the banner view.
};
adManagerBannerView.OnAdPaid += (AdValue adValue) =>
{
    // Raised when the ad is estimated to have earned money.
};
adManagerBannerView.OnAdImpressionRecorded += () =>
{
    // Raised when an impression is recorded for an ad.
};
adManagerBannerView.OnAdClicked += () =>
{
    // Raised when a click is recorded for an ad.
};
adManagerBannerView.OnAdFullScreenContentOpened += () =>
{
    // Raised when an ad opened full screen content.
};
adManagerBannerView.OnAdFullScreenContentClosed += () =>
{
    // Raised when the ad closed full screen content.
};

ทำลายมุมมองแบนเนอร์

หากต้องการทำลายแบนเนอร์ ให้เรียกใช้เมธอด Destroy() เพื่อปล่อยทรัพยากร

if (adManagerBannerView != null)
{
    // Always destroy the banner view when no longer needed.
    adManagerBannerView.Destroy();
    adManagerBannerView = null;
}

สําหรับแบนเนอร์ที่โหลดไม่สําเร็จ เราขอแนะนําให้รีเฟรชแบนเนอร์แทนการทําลายและสร้างแบนเนอร์ใหม่ ดูรายละเอียดได้ที่รีเฟรชโฆษณา

รีเฟรชโฆษณา

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

แบนเนอร์แบบปรับขนาดได้ขนาดใหญ่มีรูปแบบที่ใหญ่ขึ้นซึ่งออกแบบมาสำหรับเลย์เอาต์ที่ไม่มีการเลื่อน เมื่อเทียบกับแบนเนอร์แบบปรับขนาดได้ที่ยึดตำแหน่งไว้แบบมาตรฐาน แบนเนอร์เหล่านี้จะมีความสูงสูงสุดที่สูงกว่า (สูงสุด 20% ของความสูงของหน้าจอ ระหว่าง 50 ถึง 150 dp) พื้นที่ที่เพิ่มขึ้นนี้ได้รับการเพิ่มประสิทธิภาพสำหรับเนื้อหาวิดีโอ

ตารางต่อไปนี้แสดงขนาดแบนเนอร์มาตรฐาน

ขนาดเป็น dp (กว้าง x สูง) คำอธิบาย ความพร้อมใช้งาน ค่าคงที่ AdSize
320x50 แบนเนอร์มาตรฐาน โทรศัพท์และแท็บเล็ต BANNER
320x100 แบนเนอร์ขนาดใหญ่ โทรศัพท์และแท็บเล็ต LARGE_BANNER
300x250 สี่เหลี่ยมผืนผ้าขนาดกลางของ IAB โทรศัพท์และแท็บเล็ต MEDIUM_RECTANGLE
468x60 แบนเนอร์ขนาดเต็มของ IAB แท็บเล็ต FULL_BANNER
728x90 ลีดเดอร์บอร์ดของ IAB แท็บเล็ต LEADERBOARD
ความกว้างที่ระบุ x ความสูงแบบปรับขนาดได้ แบนเนอร์แบบปรับขนาดได้ โทรศัพท์และแท็บเล็ต ไม่มี
ความกว้างของหน้าจอ x 32|50|90 แบนเนอร์อัจฉริยะ โทรศัพท์และแท็บเล็ต SMART_BANNER
ดูข้อมูลเพิ่มเติมเกี่ยวกับแบนเนอร์แบบปรับขนาดได้ซึ่งมีไว้เพื่อแทนที่แบนเนอร์อัจฉริยะ

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

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

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

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

adManagerBannerView.OnAppEventReceived += (AppEvent args) =>
{
    Debug.Log($"Received app event from the ad: {args.Name}, {args.Data}.");
};

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

adManagerBannerView.OnAppEventReceived += (AppEvent args) =>
{
    if (args.Name == "color")
    {
        Color color;
        if (ColorUtility.TryParseHtmlString(args.Data, out color))
        {
            renderer.material.color = color;
        }
    }
};

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

<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: 0;
      left: 0;
      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>

แหล่งข้อมูลเพิ่มเติม

  • ตัวอย่าง HelloWorld: การติดตั้งใช้งานรูปแบบโฆษณาทุกรูปแบบที่เรียบง่ายที่สุด