أحجام الإعلانات

يجب أن تحدد كل شريحة إعلانية تحدّدها أحجام الإعلانات المؤهّلة للعرض في تلك الشريحة. تختلف طريقة تحديد أحجام الإعلانات باختلاف نوع الإعلانات بالإضافة إلى حجم الخانات الإعلانية ومرونتها.

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

يمكن العثور على الرمز الكامل للأمثلة المضمّنة في هذا الدليل في الإعلان مقاسات مختلفة.

الإعلانات ذات الحجم الثابت

يمكنك تحديد شريحة إعلانية بحجم ثابت واحد.

googletag
  .defineSlot("/6355419/Travel/Europe/France/Paris", [300, 250], "fixed-size-ad")
  .addService(googletag.pubads());

في هذا المثال، لن يتم عرض سوى تصاميم الإعلانات ذات الحجم 300x250.

نقطة أساسية: عند التعامل مع الإعلانات ذات الحجم الثابت، ننصحك بشدة تحديد حجم العنصر <div> الذي سيتمّ عرض تصميم الإعلان فيه منذ غالبًا ما يتم عرض تصميمات الإعلانات بشكل غير متزامن، فقد يتسبب ذلك في ظهور عناصر أخرى على الصفحة المطلوب نقلها إذا لم يتم تخصيص مساحة كافية لهم.

الإعلانات متعددة الأحجام

إذا كان الإعلان يدعم أحجامًا متعددة، قدِّم قائمة بالأحجام المدعومة في حال: في تحديد الشريحة الإعلانية

googletag
  .defineSlot(
    "/6355419/Travel/Europe",
    [[300, 250], [728, 90], [750, 200], "fluid"],
    "multi-size-ad",
  )
  .addService(googletag.pubads());

في هذا المثال، يمكن أن تكون تصميمات الإعلانات ذات الأحجام 300x250 و728x90 و750x200 يراعي "مدير إعلانات Google" فقط تصاميم الإعلانات التي تتطابق مع هذه الأحجام. خلال عملية اختيار الإعلان.

إذا لم يتم تحديد الأبعاد للشريحة الإعلانية <div> في CSS، يُعيِّن جدول تقسيم المعرّف الفريد العمومي الأبعاد المساوية للأقصر تلقائيًا الارتفاع المعلن وأوسع العرض الذي يزيد عن 1 بكسل عند استدعاء display(). وفي هذه الحالة، ستكون القيمة 750x90. ومع ذلك، قد يحدث هذا الحجم بعد تحميل محتوى آخر على الصفحة، مما أدى إلى تبديل المحتوى. لتجنُّب متغيّرات التصميم، واحجز مساحة باستخدام CSS كما هو موضّح في تقليل متغيّرات التصميم

عند العمل مع الإعلانات متعددة الحجم، تأكد من أن التخطيط مرن بما يكفي تسمح بإعلان بأكبر حجم محدد. سيؤدي ذلك إلى تجنب عرض التصميمات التي يتم اقتصاصها عن غير قصد.

الإعلانات المرنة

ليس للإعلانات المرنة بحجم ثابت، وإنما تتكيّف بحيث تتناسب مع محتوى تصميم الإعلان العرض. الإعلانات المدمجة مع المحتوى هي حاليًا الإعلان المرن الوحيد والنوع الذي يستند إليه "مدير الإعلانات"

عند التعامل مع الإعلانات المرنة، قد يتم تحديد حجم fluid مخصّص.

googletag
  .defineSlot("/6355419/Travel", ["fluid"], "native-ad")
  .addService(googletag.pubads());

في هذا المثال، سيكون عرض حاويتها الرئيسية بالخانة الإعلانية تغيير حجم ارتفاعه ليلائم المحتوى الإبداعي خطوات GPT المطلوبة لتغيير حجم الشريحة الإعلانية على النحو التالي:

  1. تم تلقي استجابة الإعلان.
  2. تمت كتابة محتوى تصميم الإعلان في إطار iframe، مع ضبط الارتفاع الأولي على 0px وتم ضبط العرض على 100%
  3. بعد الانتهاء من تحميل جميع الموارد في إطار iframe، يتم إنشاء المواد الإبداعية. مرئية من خلال تعيين ارتفاع iframe على مساوٍ لارتفاع عنصر <body> في إطار iframe

الإعلانات المتجاوبة

تعمل الإعلانات المتجاوبة على توسيع الإعلانات متعددة الأحجام وتسمح لك بتحديد حجم التي سيتم عرضها استنادًا إلى حجم إطار عرض المتصفح طلبك. يمكن استخدام هذه الوظيفة للتحكّم في حجم تصاميم الإعلانات المعروضة. على أنواع مختلفة من الأجهزة (أجهزة الكمبيوتر المكتبي أو الأجهزة اللوحية أو الأجهزة الجوّالة أو غير ذلك).

ويتم تحقيق ذلك من خلال تحديد تعيين بين حجم إطار العرض وحجم الإعلان، ثم ربط هذا التعيين بشريحة إعلانية.

const responsiveAdSlot = googletag
  .defineSlot(
    "/6355419/Travel/Europe",
    [
      [300, 250],
      [728, 90],
      [750, 200],
    ],
    "responsive-ad",
  )
  .addService(googletag.pubads());

const mapping = googletag
  .sizeMapping()
  .addSize(
    [1024, 768],
    [
      [750, 200],
      [728, 90],
    ],
  )
  .addSize([640, 480], [300, 250])
  .addSize([0, 0], [])
  .build();

responsiveAdSlot.defineSizeMapping(mapping);

في هذا المثال، يحدد التعيين ما يلي:

  • عندما يكون إطار العرض >= 1024x768، يمكن عرض الإعلانات بحجم 750x200 أو 728x90.
  • عندما يكون 1024x768 > إطار العرض >= 640x480، يمكن عرض الإعلانات بحجم 300x250.
  • عندما يكون إطار العرض < 640x480، لا يمكن عرض أي إعلانات.

سيكتشف جدول تقسيم المعرّف الفريد العمومي حجم إطار عرض المتصفح الذي ينشئ الطلب واستخدام أكبر تعيين مناسب. لتحديد أكبر يراعي تعيين GPT أولاً العرض، ثم الارتفاع (أي [100, 10] [10, 100]). في حال حدوث خطأ في التعيين أو إذا كان إطار العرض لا يمكن تحديد المقاس، وسيتم استخدام المقاسات المحدّدة في defineSlot().

ثم يتم ربط التعيين بشريحة إعلانية من خلال استدعاء Slot.defineSizeMapping(). هذه الطريقة تقبل صفيفة من عمليات الربط بالتنسيق التالي:

[
  [
    [viewport-width-1, viewport-height-1],
    [[ad-width-1, ad-height-1], [ad-width-2, ad-height-2], ...]
  ],
  [
    [viewport-width-2, viewport-height-2],
    [[ad-width-3, ad-height-3], [ad-width-4, ad-height-4], ...]
  ],
  ...
]

يحدِّد ترتيب أحجام إطار العرض ضمن هذه المصفوفة أولويتها. تشير رسالة الأشكال البيانية تم استخدام SizeMappingBuilder في المثال أعلاه هو طريقة ملائمة لإنشاء صفيف من هذا التنسيق، مع ترتيب المقاسات تلقائيًا من الأكبر إلى الأصغر. في ذلك، مثال، ناتج نطاق SizeMappingBuilder.build():

[
  [[1024, 768], [[750, 200], [728, 90]]],
  [[640, 480], [[300, 250]]],
  [[0, 0], []]
]