Kiểu gốc
Sử dụng bộ sưu tập để sắp xếp ngăn nắp các trang
Lưu và phân loại nội dung dựa trên lựa chọn ưu tiên của bạn.
Chọn nền tảng:
Android
iOS
Flutter
Chế độ cài đặt kiểu gốc cho phép Google Ad Manager xử lý quá trình hiển thị quảng cáo gốc dựa trên kiểu gốc mà bạn chỉ định trong sản phẩm. Trước tiên, hãy chỉ định kích thước và tiêu chí nhắm mục tiêu.
Sau đó, hãy thêm HTML, CSS và JavaScript để xác định những quảng cáo thích ứng và tạo ra một màn hình chất lượng trên tất cả các màn hình. Bạn không cần phải thực hiện bất kỳ thao tác kết xuất nào; Ad Manager sẽ tự động áp dụng kiểu gốc phù hợp cho đích đến. Các kiểu gốc được triển khai giống như quảng cáo biểu ngữ, bằng cách sử dụng AdManagerAdView. Bạn có thể sử dụng các kích thước này với kích thước quảng cáo cố định được xác định trước hoặc kích thước quảng cáo linh hoạt được xác định trong thời gian chạy.
Điều kiện tiên quyết
- Trình bổ trợ Flutter quảng cáo trên thiết bị di động của Google phiên bản 0.13.6 trở lên
Hướng dẫn này giả định bạn đã có một số kiến thức về cách sử dụng SDK quảng cáo trên thiết bị di động của Google.
Hãy xem qua hướng dẫn Bắt đầu nếu bạn chưa xem.
Kích thước cố định
Kiểu gốc có kích thước cố định cho phép bạn kiểm soát chiều rộng và chiều cao của quảng cáo gốc. Để đặt kích thước cố định, hãy làm theo các bước sau:
Tạo một mục hàng trong giao diện người dùng Ad Manager và chọn một trong các kích thước được xác định trước trong trình đơn thả xuống của trường Size.
Tải một AdManagerBannerAd có cùng kích thước mà bạn đã thiết lập ở bước 1.
Xem tài liệu về Quảng cáo biểu ngữ để biết cách khởi tạo và tải một quảng cáo.
Bạn có thể xem danh sách các kích thước và hằng số AdSize tương ứng trong phần Kích thước biểu ngữ.
Dưới đây là ví dụ về cách chỉ định kích thước cố định, chẳng hạn như kích thước quảng cáo MEDIUM_RECTANGLE (300x250):
AdManagerBannerAd ad = AdManagerBannerAd(
adUnitId: '<your-ad-unit>',
sizes: <AdSize>[AdSize.mediumRectangle],
request: AdManagerAdRequest(),
);
Kích thước linh hoạt
Trong một số trường hợp, kích thước cố định có thể không phù hợp. Ví dụ: bạn có thể muốn chiều rộng của quảng cáo khớp với nội dung của ứng dụng, nhưng cần chiều cao của quảng cáo tự động điều chỉnh để phù hợp với nội dung của quảng cáo. Để xử lý trường hợp này, bạn có thể chỉ định Fluid làm kích thước quảng cáo trong giao diện người dùng Ad Manager. Điều này cho biết kích thước của quảng cáo được xác định trong thời gian chạy trong ứng dụng. SDK cung cấp một hằng số AdSize đặc biệt (FLUID) để xử lý trường hợp này.
Chiều cao của kích thước quảng cáo linh hoạt được xác định linh hoạt dựa trên chiều rộng do nhà xuất bản xác định, cho phép chế độ xem quảng cáo trên nền tảng điều chỉnh chiều cao cho phù hợp với chiều cao của mẫu quảng cáo.
Yêu cầu linh hoạt
Sử dụng FluidAdManagerBannerAd để yêu cầu một quảng cáo linh hoạt:
final fluidAd = FluidAdManagerBannerAd(
adUnitId: '<your-ad-unit>',
request: AdManagerAdRequest(),
listener: AdManagerBannerAdListener(
onAdLoaded: (Ad ad) {
print('$_fluidAd loaded.');
},
onAdFailedToLoad: (Ad ad, LoadAdError error) {
print('$_fluidAd failedToLoad: $error');
ad.dispose();
},
),
Hiển thị quảng cáo thích ứng
Sau khi quảng cáo được tải, hãy dùng FluidAdWidget để hiển thị quảng cáo thích ứng. Chiều cao của vùng quảng cáo này sẽ được điều chỉnh cho phù hợp với chế độ xem quảng cáo nền tảng cơ bản:
FluidAdWidget(
width: <your-width>,
ad: fluidAd,
);
Hãy xem ví dụ về cách triển khai kích thước quảng cáo linh hoạt của Ad Manager trong ứng dụng mẫu trên Github.
Trừ phi có lưu ý khác, nội dung của trang này được cấp phép theo Giấy phép ghi nhận tác giả 4.0 của Creative Commons và các mẫu mã lập trình được cấp phép theo Giấy phép Apache 2.0. Để biết thông tin chi tiết, vui lòng tham khảo Chính sách trang web của Google Developers. Java là nhãn hiệu đã đăng ký của Oracle và/hoặc các đơn vị liên kết với Oracle.
Cập nhật lần gần đây nhất: 2025-09-06 UTC.
[[["Dễ hiểu","easyToUnderstand","thumb-up"],["Giúp tôi giải quyết được vấn đề","solvedMyProblem","thumb-up"],["Khác","otherUp","thumb-up"]],[["Thiếu thông tin tôi cần","missingTheInformationINeed","thumb-down"],["Quá phức tạp/quá nhiều bước","tooComplicatedTooManySteps","thumb-down"],["Đã lỗi thời","outOfDate","thumb-down"],["Vấn đề về bản dịch","translationIssue","thumb-down"],["Vấn đề về mẫu/mã","samplesCodeIssue","thumb-down"],["Khác","otherDown","thumb-down"]],["Cập nhật lần gần đây nhất: 2025-09-06 UTC."],[[["\u003cp\u003eNative style settings in Google Ad Manager allow you to customize the look and feel of your native ads using HTML, CSS, and JavaScript for a seamless user experience.\u003c/p\u003e\n"],["\u003cp\u003eYou can define fixed-size native ads by specifying their dimensions in the Ad Manager UI and using corresponding \u003ccode\u003eAdSize\u003c/code\u003e constants when loading the ad in your app.\u003c/p\u003e\n"],["\u003cp\u003eAlternatively, fluid-size native ads dynamically adjust their height based on the width you provide, ensuring responsiveness across different screens using the \u003ccode\u003eFluidAdManagerBannerAd\u003c/code\u003e and \u003ccode\u003eFluidAdWidget\u003c/code\u003e.\u003c/p\u003e\n"],["\u003cp\u003eTo implement native ads, you need Google Mobile Ads Flutter Plugin version 0.13.6 or higher and basic familiarity with the Google Mobile Ads SDK.\u003c/p\u003e\n"]]],["Google Ad Manager renders native ads based on specified styles. Users define ad size and targeting, then add HTML, CSS, and JavaScript for responsive design. Fixed ad sizes are set in the Ad Manager UI and loaded using `AdManagerBannerAd` with corresponding `AdSize` constants. Fluid ads use `Fluid` in the UI and the `FLUID` constant, with `FluidAdManagerBannerAd` for requests and `FluidAdWidget` for display, dynamically adjusting the height.\n"],null,["Select platform: [Android](/ad-manager/mobile-ads-sdk/android/native/styles \"View this page for the Android platform docs.\") [iOS](/ad-manager/mobile-ads-sdk/ios/native/styles \"View this page for the iOS platform docs.\") [Flutter](/ad-manager/mobile-ads-sdk/flutter/native/styles \"View this page for the Flutter platform docs.\")\n\n\u003cbr /\u003e\n\n[Native style settings](//support.google.com/admanager/answer/6366914)\nenable Google Ad Manager to handle the rendering of your native ads based on native\nstyles you specify within the product. First, specify size and targeting.\nThen add HTML, CSS, and JavaScript to define ads that are responsive\nand produce a quality display across all screens. You don't need to do\nany of the rendering; Ad Manager automatically applies the right native style\nfor the destination. Native styles are implemented just like banner ads,\nusing a `AdManagerAdView`. They can be used with a fixed ad\nsize determined ahead of time, or a fluid ad size determined at runtime.\n\nPrerequisites\n\n- Google Mobile Ads Flutter Plugin version 0.13.6 or higher\n\nThis guide assumes some working knowledge of the Google Mobile Ads SDK.\nIf you haven't already done so, consider running through our\n[Get Started](/ad-manager/mobile-ads-sdk/flutter/quick-start) guide.\n\nFixed size\n\nNative styles with a fixed size allow you to control the width and height\nof the native ad. To set a fixed size, follow these steps:\n\n1. Create a line item in the Ad Manager UI and select one of the\n predefined sizes from the `Size` field dropdown.\n\n2. Load an `AdManagerBannerAd` with the same size you set up in step 1.\n See the [Banner Ad](/ad-manager/mobile-ads-sdk/flutter/banner/get-started#instantiate_ad)\n documentation for how to instantiate and load an ad.\n You can see a list of sizes and their corresponding `AdSize` constants\n in the [Banner size](/ad-manager/mobile-ads-sdk/flutter/banner/get-started#banner_sizes)\n section.\n\nHere's an example of how to specify a fixed size, such as the\n`MEDIUM_RECTANGLE` (300x250) ad size: \n\n AdManagerBannerAd ad = AdManagerBannerAd(\n adUnitId: '\u003cyour-ad-unit\u003e',\n sizes: \u003cAdSize\u003e[AdSize.mediumRectangle],\n request: AdManagerAdRequest(),\n );\n\nFluid size\n\nIn some cases, a fixed size may not make sense. For example, you may\nwant the width of the ad to match your app's content, but need its height\nto dynamically adjust to fit the ad's content. To handle this case,\nyou can specify `Fluid` as the ad size in the Ad Manager UI, which\ndesignates that the size of the ad is determined at runtime in the app.\nThe SDK provides a special `AdSize` constant, `FLUID`, to handle this case.\nThe fluid ad size height is dynamically determined based on the publisher\ndefined width, allowing the platform ad view to adjust its height to match that\nof the creative.\n\nFluid request\n\nUse `FluidAdManagerBannerAd` to request a fluid ad: \n\n final fluidAd = FluidAdManagerBannerAd(\n adUnitId: '\u003cyour-ad-unit\u003e',\n request: AdManagerAdRequest(),\n listener: AdManagerBannerAdListener(\n onAdLoaded: (Ad ad) {\n print('$_fluidAd loaded.');\n },\n onAdFailedToLoad: (Ad ad, LoadAdError error) {\n print('$_fluidAd failedToLoad: $error');\n ad.dispose();\n },\n ),\n\nDisplaying the fluid ad\n\nAfter your ad is loaded, use `FluidAdWidget` to display fluid ads. It will\nadjust its height to match the underlying platform ad view: \n\n FluidAdWidget(\n width: \u003cyour-width\u003e,\n ad: fluidAd,\n );\n\nSee an example implementation of Ad Manager Fluid ad size in the example app\non [Github](https://github.com/googleads/googleads-mobile-flutter/blob/master/packages/google_mobile_ads/example/lib/fluid_example.dart)."]]
