السمات
يوضح هذا القسم كيفية إنشاء عنصر <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( |
عرض جميع أزرار الاشتراك في الحاوية المحددة. استخدم هذه الطريقة إذا كانت عناصر زر الاشتراك التي تريد عرضها موجودة. على سبيل المثال، إذا أرسل تطبيقك طلب AJAX الذي يعرض العنصر <div> الكامل لـ Subscribe Button، يمكنك استدعاء طريقة go() لعرض الزر.
|
gapi.ytsubscribe.render( |
لعرض Subscribe Button داخل الحاوية المحددة. استخدم هذه الطريقة إذا كان العنصر الذي يحتوي على Subscribe Button غير موجود من قبل ويجب إنشاؤه.
|
عرض زر باستخدام gapi.ytsubscribe.go
يوضّح المثال التالي الرمز الذي ستستخدمه لاستدعاء الطريقة gapi.ytsubscribe.go
لعرض زر ديناميكيًا عند النقر على الرابط.
ملاحظة: تستخدم أداة التهيئة أعلاه أيضًا طريقة go
لعرض زر جديد عند تحديث خيارات الزر أو رمزه.
عرض زر باستخدام gapi.ytsubscribe.render
يوضح المثال أدناه كيفية طلب طريقة gapi.ytsubscribe.render
لعرض زر ديناميكيًا عند النقر على الرابط: