الأنماط الأصلية

تتيح إعدادات نمط الإعلانات المدمجة مع المحتوى لـ "مدير إعلانات Google" معالجة عرض إعلاناتك المدمجة مع المحتوى استنادًا إلى أنماط الإعلانات المدمجة مع المحتوى التي تحدّدها ضمن المنتج. أولاً، حدِّد الحجم والاستهداف. بعد ذلك، أضِف HTML وCSS وJavaScript لتحديد الإعلانات المتجاوبة التي تعرض محتوى عالي الجودة على جميع الشاشات. لست بحاجة إلى تنفيذ أي عملية عرض، لأنّ "مدير إعلانات Google" يطبّق تلقائيًا نمط الإعلان الأصلي المناسب للموقع المقصود. يتم تنفيذ "الأنماط الأصلية" بالطريقة نفسها التي يتم بها تنفيذ إعلانات البانر، وذلك باستخدام GAMBannerView. ويمكن استخدامها مع حجم إعلان ثابت يتم تحديده مسبقًا، أو حجم إعلان مرن يتم تحديده في وقت التشغيل.

المتطلبات الأساسية

• الإصدار 7.14.0 أو إصدار أحدث من حزمة "SDK لإعلانات Google على الأجهزة الجوّالة"

يفترض هذا الدليل معرفة عملية بحزمة "SDK لإعلانات Google على الأجهزة الجوّالة". إذا لم يسبق لك إجراء ذلك، ننصحك بالاطّلاع على دليل البدء.

حجم ثابت

تتيح لك أنماط الإعلانات المدمجة مع المحتوى ذات الحجم الثابت التحكّم في عرض وارتفاع الإعلان المدمج مع المحتوى. لضبط حجم ثابت، اتّبِع الخطوات التالية:

1. أنشئ عنصرًا في واجهة مستخدم "مدير إعلانات Google" واختَر أحد الأحجام المحدّدة مسبقًا من القائمة المنسدلة في الحقل Size.

2. في Interface Builder، اضبط عرض وارتفاع GAMBannerView ليتطابقا مع الحجم المحدّد مسبقًا الذي اخترته في الخطوة 1. يمكنك الاطّلاع على قائمة بالأحجام وثوابتها المقابلة في قسم حجم البانر.GADAdSize

إنّ تنفيذ الأنماط المدمجة مع المحتوى ذات الحجم الثابت بسيط جدًا، إذ يكفي اتّباع التعليمات الواردة في طلب أول إعلان بانر، ولكنّك ستحصل على المرونة والتحكّم في HTML وCSS وJavaScript لمنح إعلان البانر مظهرًا مدمجًا مع المحتوى يبدو طبيعيًا في تطبيقك.

حجم السائل

في بعض الحالات، قد لا يكون الحجم الثابت مناسبًا. على سبيل المثال، قد تريد أن يتطابق عرض الإعلان مع محتوى تطبيقك، ولكن تحتاج إلى تعديل ارتفاعه بشكل ديناميكي ليتناسب مع محتوى الإعلان. للتعامل مع هذه الحالة، يمكنك تحديد Fluid كحجم الإعلان في واجهة مستخدم "مدير إعلانات Google"، ما يشير إلى أنّه يتم تحديد حجم الإعلان في وقت التشغيل في التطبيق. توفّر حزمة تطوير البرامج (SDK) الثابت الخاص GADAdSize، kGADAdSizeFluid، للتعامل مع هذه الحالة. يتم تحديد ارتفاع حجم الإعلان المرن بشكل ديناميكي استنادًا إلى العرض الذي يحدّده الناشر، ما يتيح GAMBannerView تعديل ارتفاعه ليتطابق مع ارتفاع تصميم الإعلان.

طلب سلس

على عكس أشكال الإعلانات الأخرى، لا يتضمّن حجم الإعلان kGADAdSizeFluid عرضًا محدّدًا مسبقًا، لذا احرص على ضبط عرض إطار البانر بشكل صريح في الرمز البرمجي أو في Interface Builder. في حال عدم تحديد عرض، تضبط حزمة تطوير البرامج (SDK) تلقائيًا ارتفاع البانر استنادًا إلى العرض الكامل للجهاز.

في حال تقديم طلب متعدد الأحجام يتضمّن kGADAdSizeFluid، سيتم دائمًا وضع الإعلان المعروض داخل حاوية مرنة وسيتصرف كإعلان مرن. في حال عرض تصميم إعلان غير مرن في هذه الحاوية المرنة، ستعمل حزمة SDK على توسيط الإعلان في الحاوية، وبالتالي لن تحتاج إلى تعديل قيود العرض في كل مرة يتم فيها عرض إعلان جديد.

إنّ عملية تنفيذ طلب مرن بحجم واحد وطلب مرن بأحجام متعددة متشابهة جدًا، والفرق الوحيد هو أنّه في طلب الأحجام المتعددة، عليك ضبط السمة validAdSizes لتحديد أحجام الإعلانات الصالحة لطلب الإعلان:

bannerView.validAdSizes = [nsValue(for: AdSizeFluid), nsValue(for: AdSizeBanner)]

_bannerView.validAdSizes = @[ NSValueFromGADAdSize(kGADAdSizeFluid),
                              NSValueFromGADAdSize(kGADAdSizeBanner) ];

في ما يلي الشكل الكامل للتنفيذ في الرمز البرمجي:

var bannerView: AdManagerBannerView!

override func viewDidLoad() {
super.viewDidLoad()
  // Create the GAMBannerView and set its width to a width that makes sense for your
  // app. In this example, the width is set to the width of the UIViewController's
  // root view.
  bannerView = AdManagerBannerView(adSize: AdSizeFluid)
  var frameRect = bannerView.frame
  frameRect.size.width = view.bounds.width
  bannerView.frame = frameRect

  // Uncomment this code for a multisize fluid request.
  // bannerView.validAdSizes = [nsValue(for: AdSizeFluid), nsValue(for: AdSizeBanner)]

  bannerView.adUnitID = "YOUR_AD_UNIT_ID"
  bannerView.rootViewController = self

  // Make the ad request.
  bannerView.load(AdManagerRequest())
}

GAMBannerView *_bannerView;

- (void)viewDidLoad {
  [super viewDidLoad];
  // Create the GAMBannerView and set its width to a width that makes sense for your
  // app. In this example, the width is set to the width of the UIViewController's
  // root view.
  _bannerView = [[GAMBannerView alloc] initWithAdSize:kGADAdSizeFluid];
  CGRect frameRect = _bannerView.frame;
  frameRect.size.width = CGRectGetWidth(self.view.bounds);
  _bannerView.frame = frameRect;

  // Uncomment this code for a multisize fluid request.
  // _bannerView.validAdSizes = @[ NSValueFromGADAdSize(kGADAdSizeFluid),
  //                               NSValueFromGADAdSize(kGADAdSizeBanner) ];

  _bannerView.adUnitID = @"YOUR_AD_UNIT_ID";
  _bannerView.rootViewController = self;

  // Make the ad request.
  [_bannerView loadRequest:[GAMRequest request]];
}

للاطّلاع على مثال على تنفيذ حجم الإعلان المرن في "مدير إعلانات Google"، نزِّل تطبيق iOS API Demo بلغة Swift أو Objective-C.

تنزيل العرض التوضيحي لواجهة برمجة التطبيقات

بروتوكول GADAdSizeDelegate

قد تحتاج إلى معرفة ارتفاع بانر قبل تغيير حجم الإعلان. يُرسِل adView:willChangeAdSizeTo: إشعارًا إلى العنصر المفوض قبل أن يتغيّر عرض البانر إلى GADAdSize الجديد. لتلقّي إشعار قبل أن يتغيّر عرض البانر إلى حجم الإعلان الجديد، يجب أن يتوافق صفك مع البروتوكول GADAdSizeDelegate.

في ما يلي نموذج لتنفيذ الدالة adView:willChangeAdSizeTo: التي تعرض كيفية الحصول على العرض والارتفاع الجديدَين للبانر:

// To be notified before the banner's ad size changes, your view controller class must
// conform to the GADAdSizeDelegate protocol.
bannerView.adSizeDelegate = self

// MARK: - GADAdSizeDelegate

func adView(_ bannerView: BannerView, willChangeAdSizeTo adSize: AdSize) {
  let height = adSize.size.height
  let width = adSize.size.width
}

// To be notified before the banner's ad size changes, your view controller class must
// conform to the GADAdSizeDelegate protocol.
_bannerView.adSizeDelegate = self;

#pragma mark - GADAdSizeDelegate

- (void)adView:(GADBannerView *)bannerView willChangeAdSizeTo:(GADAdSize)adSize {
  CGFloat height = adSize.size.height;
  CGFloat width = adSize.size.width;
}