เริ่มต้นใช้งาน

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

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

ปัจจุบัน Google Mobile Ads SDK สําหรับ Flutter รองรับการโหลดและการแสดงโฆษณาแบนเนอร์ โฆษณาคั่นระหว่างหน้า (แบบเต็มหน้าจอ) โฆษณาเนทีฟ และโฆษณาที่มีการให้รางวัล

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

นําเข้า SDK โฆษณาในอุปกรณ์เคลื่อนที่

การตั้งค่าเฉพาะแพลตฟอร์ม

Android

อัปเดต AndroidManifest.xml

คุณต้องใส่รหัสแอป AdMob ใน AndroidManifest.xml ไม่เช่นนั้นแอปจะขัดข้องเมื่อเปิด

เพิ่มรหัสแอป AdMob ตามที่ระบุในเว็บอินเตอร์เฟซของ AdMob ลงในไฟล์ android/app/src/main/AndroidManifest.xml ของแอปด้วยการเพิ่มแท็ก <meta-data> ที่มีชื่อ com.google.android.gms.ads.APPLICATION_ID สำหรับ android:value ให้แทรกรหัสแอป AdMob ของคุณเองในเครื่องหมายคำพูดดังที่แสดง

<manifest>
    <application>
        <!-- Sample AdMob app ID: ca-app-pub-3940256099942544~3347511713 -->
        <meta-data
            android:name="com.google.android.gms.ads.APPLICATION_ID"
            android:value="ca-app-pub-xxxxxxxxxxxxxxxx~yyyyyyyyyy"/>
    <application>
<manifest>

ใช้ value เดียวกันเมื่อเริ่มต้นใช้งานปลั๊กอินในโค้ด Dart

ดูข้อมูลเพิ่มเติมเกี่ยวกับการกําหนดค่า AndroidManifest.xml และการตั้งค่ารหัสแอปได้จากคู่มือ Android

iOS

อัปเดต Info.plist

ในไฟล์ ios/Runner/Info.plist ของแอป ให้เพิ่มGADApplicationIdentifier คีย์ที่มีค่าสตริงของรหัสแอป AdMob ตามที่ระบุในเว็บอินเตอร์เฟซของ AdMob

<key>GADApplicationIdentifier</key>
<string>ca-app-pub-################~##########</string>

คุณต้องส่งค่าเดียวกันเมื่อเริ่มต้นใช้งานปลั๊กอินในโค้ด Dart

ดูข้อมูลเพิ่มเติมเกี่ยวกับการกําหนดค่า Info.plist และการตั้งค่ารหัสแอปได้ที่คู่มือ iOS

เริ่มต้นใช้งาน SDK โฆษณาในอุปกรณ์เคลื่อนที่

ก่อนโหลดโฆษณา ให้แอปเริ่มต้นใช้งาน Mobile Ads SDK โดยเรียกใช้ MobileAds.instance.initialize() ซึ่งจะเริ่มต้นใช้งาน SDK และแสดงผล Future ที่เสร็จสมบูรณ์เมื่อการเริ่มต้นใช้งานเสร็จสมบูรณ์ หรือหลังจากหมดเวลา 30 วินาที ซึ่งต้องทําเพียงครั้งเดียว โดยควรทําก่อนเรียกใช้แอป

import 'package:google_mobile_ads/google_mobile_ads.dart';
import 'package:flutter/material.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  MobileAds.instance.initialize();

  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  MyAppState createState() => MyAppState();
}

class MyAppState extends State<MyApp> {
  @override
  void initState() {
    super.initState();
    // Load ads.
  }
}

เลือกรูปแบบโฆษณา

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

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

ติดตั้งใช้งานโฆษณาแบนเนอร์

โฆษณาคั่นระหว่างหน้า

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

ติดตั้งใช้งานโฆษณาคั่นระหว่างหน้า

เนทีฟ

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

ติดตั้งใช้งานโฆษณาเนทีฟ

ได้รับรางวัลแล้ว

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

ใช้โฆษณาที่มีการให้รางวัล