Reference Guide

ویژگی های

این بخش نحوه ساخت عنصر <div> را برای دکمه اشتراک توضیح می دهد. لیست های زیر ویژگی های مورد نیاز و اختیاری عنصر را توضیح می دهند. ویژگی‌های اختیاری به شما امکان می‌دهند طرح‌بندی و موضوع دکمه را کنترل کنید و همچنین انتخاب کنید که آیا تعداد مشترکان کانال نمایش داده شود یا خیر.

ویژگی های مورد نیاز

  • class – مقدار را روی g-ytsubscribe قرار دهید. این کلاس عنصر <div> را به‌عنوان محفظه‌ای برای دکمه اشتراک شناسایی می‌کند و یوتیوب را قادر می‌سازد تا اندازه دکمه تعبیه‌شده را همانطور که در بخش بعدی توضیح داده شد، به صورت پویا تغییر دهد.

  • شما باید یک مقدار برای یکی از دو ویژگی زیر مشخص کنید:

    • 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 به صورت پویا رندر کنید. این رویکرد از عبور جاوا اسکریپت API از کل DOM برای مکان یابی دکمه ها جلوگیری می کند، که می تواند زمان رندر دکمه را بهبود بخشد.

به عنوان بخشی از Google+ JavaScript API ، Subscribe Button از روش‌های استاندارد go and render پشتیبانی می‌کند که می‌تواند برای رندر کردن پویا دکمه‌های اشتراک استفاده شود. به عنوان مثال، می‌توانید از این روش‌ها برای رندر کردن دکمه‌ای استفاده کنید که هنگام فعال شدن رویداد ready DOM وجود ندارد، مانند صفحه‌ای که با AJAX به‌روزرسانی شده است.

روش شرح
gapi.ytsubscribe. go (
opt_container
)		 همه دکمه های اشتراک را در ظرف مشخص شده رندر می کند. اگر عناصر دکمه اشتراکی که می خواهید رندر کنید از قبل وجود داشته باشد از این روش استفاده کنید. به عنوان مثال، اگر برنامه شما یک درخواست AJAX ارسال می کند که عنصر <div> کامل را برای Subscribe Button برمی گرداند، متد go() را برای رندر کردن دکمه فراخوانی کنید.
opt_container
عنصر HTML که حاوی دکمه های اشتراک برای رندر است. شناسه عنصر یا خود عنصر DOM را مشخص کنید. اگر این پارامتر حذف شود، تمام دکمه های اشتراک در صفحه نمایش داده می شوند.
gapi.ytsubscribe. render (
container ,
parameters
)		 Subscribe Button در ظرف مشخص شده رندر می کند. اگر عنصری که حاوی Subscribe Button است از قبل وجود نداشته و نیاز به ساخت دارد از این روش استفاده کنید.
container
عنصر خالی HTML را که در آن Subscribe Button نمایش داده می شود، مشخص می کند. شناسه عنصر یا خود عنصر DOM را مشخص کنید.
parameters
یک شی حاوی ویژگی‌های دکمه اشتراک به‌عنوان جفت‌های key:value ، مانند {"channel": "GoogleDevelopers", "layout": "full"} .

یک دکمه با gapi.ytsubscribe.go رندر کنید

مثال زیر کدی را نشان می دهد که برای فراخوانی متد gapi.ytsubscribe.go برای رندر پویا یک دکمه هنگام کلیک روی پیوند استفاده می کنید.

توجه: ابزار پیکربندی بالا همچنین از روش go برای ارائه یک دکمه جدید هنگام به‌روزرسانی گزینه‌ها یا کدها استفاده می‌کند.

یک دکمه با gapi.ytsubscribe.render رندر کنید

مثال زیر نحوه فراخوانی متد gapi.ytsubscribe.render را برای رندر پویا یک دکمه هنگام کلیک روی پیوند نشان می دهد: