Reference Guide

السمات

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

السمات المطلوبة

• class: اضبط القيمة على g-ytsubscribe. يحدّد هذا الصف العنصر <div> كحاوية لزر الاشتراك ويتيح لـ YouTube تغيير حجم الزر المضمّن ديناميكيًا كما هو موضّح في القسم التالي.

• يجب تحديد قيمة لإحدى السمتَين التاليتَين:

  • data-channel: اسم القناة المرتبطة بالزر قيمة نموذجية: GoogleDevelopers.
  • data-channelid: معرّف القناة المرتبط بالزر قيمة نموذجية: UC_x5XG1OV2P6uZZ5FSM9Ttw. يمكنك استرداد معرّف قناتك في إعدادات حسابك على YouTube أو باستخدام APIs Explorer في نهاية هذا المستند. مزيد من المعلومات حول استخدام معرّفات القنوات

السمات الاختيارية

• data-layout: تمثّل هذه السمة تنسيق الزر. القيم الصالحة للسمات هي:

  • default: يعرض رمز زر التشغيل وكلمة "اشتراك" بلغة المستخدم، والتي يتم اختيارها باستخدام إعدادات اللغة أو الموقع الجغرافي للمستخدم.
  • full: يعرض صورة القناة الرمزية وعنوانها بالإضافة إلى الزر العادي.

• data-theme: يحدّد نظام الألوان الذي سيتم استخدامه للزر. القيم الصالحة هي default وdark. تم تصميم مظهر dark للتطبيقات التي تضع أزرارًا على عنصر خلفية داكنة.

• data-count: يشير إلى ما إذا كان الزر يعرض عدد المشتركين في القناة. السلوك التلقائي للزر هو عرض عدد المشتركين. القيم الصالحة هي default وhidden.

• data-onytevent – ملاحظة: تم إيقاف هذه السمة نهائيًا.

الفعاليات

ملاحظة: تم إيقاف الحدثَين subscribe وunsubscribe لزر "الاشتراك" نهائيًا. وبالمثل، تم إيقاف السمة data-ytonevent نهائيًا، والتي كان يمكن إضافتها سابقًا إلى عنصر التطبيق المصغّر لتحديد أداة معالجة لإشعارات الأحداث.

العرض الديناميكي

كبديل لاستخدام رمز التضمين العادي من أداة الإعداد، يمكنك عرض Subscribe Button ديناميكيًا. يمنع هذا الأسلوب JavaScript لواجهة برمجة التطبيقات من اجتياز DOM بالكامل لتحديد موقع الأزرار، ما يمكن أن يحسّن وقت عرض الأزرار.

كجزء من Google+ JavaScript API، يتيح Subscribe Button استخدام طريقتَي go وrender القياسيتَين، ويمكن استخدامهما لعرض أزرار الاشتراك بشكلٍ ديناميكي. على سبيل المثال، يمكنك استخدام هذه الطرق لعرض زرّ غير متوفّر عند تنشيط الحدث DOM ready، مثلاً على صفحة يتمّ تعديلها باستخدام AJAX.

الطريقة	الوصف
gapi.ytsubscribe.go(   opt_container )	تعرض هذه الطريقة جميع أزرار الاشتراك في الحاوية المحدّدة. استخدِم هذه الطريقة إذا كانت عناصر زر الاشتراك التي تريد عرضها متوفّرة. على سبيل المثال، إذا كان تطبيقك يرسل طلب AJAX يعرض عنصر <div> كاملاً لـ Subscribe Button، استخدِم طريقة go() لعرض الزر. opt_container عنصر HTML الذي يحتوي على أزرار الاشتراك المطلوب عرضها. حدِّد إما معرّف العنصر أو عنصر DOM نفسه. في حال حذف هذه المَعلمة، سيتم عرض جميع أزرار الاشتراك في الصفحة.
gapi.ytsubscribe.render(   container,   parameters )	تعرض هذه السمة Subscribe Button داخل الحاوية المحدّدة. استخدِم هذه الطريقة إذا لم يكن العنصر الذي سيحتوي على Subscribe Button موجودًا من قبل ويجب إنشاؤه. الحاوية تحدّد عنصر HTML الفارغ الذي سيتم عرض Subscribe Button فيه. حدِّد إما معرّف العنصر أو عنصر DOM نفسه. المعلمات كائن يحتوي على سمات زر الاشتراك كأزواج key:value، مثل {"channel": "GoogleDevelopers", "layout": "full"}

عرض زر باستخدام gapi.ytsubscribe.go

يعرض المثال أدناه الرمز الذي ستستخدمه لاستدعاء الطريقة gapi.ytsubscribe.go لعرض زر بشكل ديناميكي عند النقر على الرابط.

ملاحظة: تستخدم أداة الإعداد أعلاه أيضًا طريقة go لعرض زر جديد عند تعديل خيارات الزر أو رمزه.

عرض زر باستخدام gapi.ytsubscribe.render

يوضّح المثال أدناه كيفية استدعاء الطريقة gapi.ytsubscribe.render لعرض زر بشكل ديناميكي عند النقر على الرابط: