الأنماط الأصلية
تنظيم صفحاتك في مجموعات
يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.
اختيار النظام الأساسي:
Android
iOS
Flutter
تتيح إعدادات نمط الإعلانات المدمجة مع المحتوى لـ "مدير إعلانات Google" معالجة عرض إعلاناتك المدمجة مع المحتوى استنادًا إلى أنماط الإعلانات المدمجة مع المحتوى التي تحدّدها ضمن المنتج. أولاً، حدِّد الحجم والاستهداف.
بعد ذلك، أضِف HTML وCSS وJavaScript لتحديد الإعلانات المتجاوبة التي تعرض محتوى عالي الجودة على جميع الشاشات. لست بحاجة إلى تنفيذ أي عملية عرض، لأنّ "مدير إعلانات Google" يطبّق تلقائيًا نمط الإعلان الأصلي المناسب للموقع المقصود. يتم تنفيذ "الأنماط الأصلية" بالطريقة نفسها التي يتم بها تنفيذ إعلانات البانر، وذلك باستخدام AdManagerAdView
. ويمكن استخدامها مع حجم إعلان ثابت يتم تحديده مسبقًا، أو حجم إعلان مرن يتم تحديده في وقت التشغيل.
المتطلبات الأساسية
- الإصدار 0.13.6 أو إصدار أحدث من Google Mobile Ads Flutter Plugin
يفترض هذا الدليل معرفة عملية بحزمة "SDK لإعلانات Google على الأجهزة الجوّالة".
إذا لم يسبق لك إجراء ذلك، ننصحك بالاطّلاع على دليل البدء.
حجم ثابت
تتيح لك أنماط الإعلانات المدمجة مع المحتوى ذات الحجم الثابت التحكّم في عرض وارتفاع الإعلان المدمج مع المحتوى. لضبط حجم ثابت، اتّبِع الخطوات التالية:
أنشئ عنصرًا في واجهة مستخدم "مدير إعلانات Google" واختَر أحد الأحجام المحدّدة مسبقًا من القائمة المنسدلة في الحقل Size
.
حمِّل AdManagerBannerAd
بالحجم نفسه الذي أعددته في الخطوة 1.
راجِع مستندات إعلان البانر
للتعرّف على كيفية إنشاء مثيل وتحميل إعلان.
يمكنك الاطّلاع على قائمة بالأحجام وثوابت AdSize
المقابلة لها في قسم حجم البانر.
في ما يلي مثال على كيفية تحديد حجم ثابت، مثل حجم الإعلان
MEDIUM_RECTANGLE
(300x250):
AdManagerBannerAd ad = AdManagerBannerAd(
adUnitId: '<your-ad-unit>',
sizes: <AdSize>[AdSize.mediumRectangle],
request: AdManagerAdRequest(),
);
حجم السائل
في بعض الحالات، قد لا يكون الحجم الثابت مناسبًا. على سبيل المثال، قد تريد أن يتطابق عرض الإعلان مع محتوى تطبيقك، ولكن تحتاج إلى تعديل ارتفاعه بشكل ديناميكي ليتناسب مع محتوى الإعلان. للتعامل مع هذه الحالة، يمكنك تحديد Fluid
كحجم الإعلان في واجهة مستخدم "مدير إعلانات Google"، ما يشير إلى أنّه يتم تحديد حجم الإعلان في وقت التشغيل في التطبيق. توفّر حزمة تطوير البرامج (SDK) الثابت الخاص AdSize
، وهو FLUID
، للتعامل مع هذه الحالة.
يتم تحديد ارتفاع حجم الإعلان المرن ديناميكيًا استنادًا إلى العرض الذي يحدّده الناشر، ما يسمح لعرض الإعلان على المنصة بتعديل ارتفاعه ليتطابق مع ارتفاع تصميم الإعلان.
طلب سلس
استخدِم FluidAdManagerBannerAd
لطلب إعلان مرن:
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();
},
),
عرض الإعلان المرن
بعد تحميل إعلانك، استخدِم FluidAdWidget
لعرض الإعلانات السائلة. سيتم تعديل ارتفاعه ليتناسب مع طريقة عرض الإعلان على المنصة الأساسية:
FluidAdWidget(
width: <your-width>,
ad: fluidAd,
);
يمكنك الاطّلاع على مثال على تنفيذ حجم الإعلان المرن في "مدير إعلانات Google" في التطبيق النموذجي على Github.
إنّ محتوى هذه الصفحة مرخّص بموجب ترخيص Creative Commons Attribution 4.0 ما لم يُنصّ على خلاف ذلك، ونماذج الرموز مرخّصة بموجب ترخيص Apache 2.0. للاطّلاع على التفاصيل، يُرجى مراجعة سياسات موقع Google Developers. إنّ Java هي علامة تجارية مسجَّلة لشركة Oracle و/أو شركائها التابعين.
تاريخ التعديل الأخير: 2025-08-31 (حسب التوقيت العالمي المتفَّق عليه)
[null,null,["تاريخ التعديل الأخير: 2025-08-31 (حسب التوقيت العالمي المتفَّق عليه)"],[[["\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)."]]