Atrybuty
Z tej sekcji dowiesz się, jak utworzyć element <div>
dla przycisku subskrypcji. Poni��sze listy zawierają wymagane i opcjonalne atrybuty elementu. Za pomocą opcjonalnych atrybutów możesz decydować o układzie i motywie wizualnym przycisku i wybrać, czy ma być na nim pokazana liczba subskrybentów kanału.
Atrybuty wymagane
-
class
– ustaw wartość nag-ytsubscribe
. Ta klasa identyfikuje element<div>
jako kontener przycisku subskrypcji i umożliwia YouTube dynamiczną zmianę rozmiaru osadzonego przycisku zgodnie z opisem w następnej sekcji. -
Musisz podać wartość jednego z tych dwóch atrybutów:
data-channel
– nazwa kanału powiązanego z przyciskiem. Przykładowa wartość:GoogleDevelopers
.data-channelid
– identyfikator kanału powiązany z przyciskiem. Przykładowa wartość:UC_x5XG1OV2P6uZZ5FSM9Ttw
. Identyfikator kanału możesz znaleźć w ustawieniach konta YouTube lub korzystając z APIs Explorer na końcu tego dokumentu. Dowiedz się więcej o pracy z identyfikatorami kanałów.
Atrybuty opcjonalne
-
data-layout
– format przycisku. Prawidłowe atrybuty to:default
– wyświetla ikonę przycisku odtwarzania i słowo „subskrybuj” w języku użytkownika, który jest wybierany na podstawie ustawień językowych użytkownika lub jego lokalizacji.full
– oprócz standardowego przycisku wyświetla awatar i tytuł kanału.
-
data-theme
– określa schemat kolorów, który ma być używany w przypadku przycisku. Prawidłowe wartości todefault
idark
. Motywdark
jest przeznaczony dla aplikacji, w których przyciski są umieszczone na ciemniejszym tle. -
data-count
– określa, czy przycisk wyświetla liczbę subskrybentów kanału. Domyślnie jest to włączone. Prawidłowe wartości todefault
ihidden
. -
data-onytevent
– Uwaga: ten atrybut nie jest już używany.
Wydarzenia
Uwaga: zdarzenia subscribe
i unsubscribe
przycisku Subskrybuj nie są już używane. Podobnie atrybut data-ytonevent
, który można było wcześniej dodać do elementu widżetu, aby określić detektor powiadomień o zdarzeniach, został wycofany.
Dynamiczne renderowanie
Zamiast używać standardowego kodu do umieszczania z narzędzia do konfiguracji, możesz dynamicznie renderować element Subscribe Button. Dzięki temu JavaScript interfejsu API nie musi przeszukiwać całego elementu DOM w celu znalezienia przycisków, co może skrócić czas renderowania przycisków.
W ramach Google+ JavaScript API Subscribe Button obsługuje standardowe metody go
i render
, których można używać do dynamicznego renderowania przycisków subskrypcji. Możesz na przykład użyć tych metod do renderowania przycisku, który nie jest obecny, gdy wywoływane jest zdarzenie DOM ready
, np. na stronie aktualizowanej za pomocą AJAX.
Metoda | Opis |
---|---|
gapi.ytsubscribe.go( |
Renderuje wszystkie przyciski subskrypcji w podanym kontenerze. Z tej metody można skorzystać w sytuacji, gdy elementy przycisku subskrypcji, który ma być renderowany, już istnieją. Jeśli na przykład Twoja aplikacja wysyła żądanie AJAX, które zwraca kompletny element <div> dla elementu Subscribe Button, wywołaj metodę go() , aby wyrenderować przycisk.
|
gapi.ytsubscribe.render( |
Wyświetla element Subscribe Button w określonym kontenerze. Użyj tej metody, jeśli element, który będzie zawierać tag Subscribe Button, jeszcze nie istnieje i trzeba go utworzyć.
|
Renderowanie przycisku za pomocą gapi.ytsubscribe.go
Poniższy przykład pokazuje kod, którego możesz użyć do wywołania metody gapi.ytsubscribe.go
, aby dynamicznie renderować przycisk po kliknięciu linku.
Uwaga: powyższe narzędzie do konfiguracji również używa metody go
do renderowania nowego przycisku po zaktualizowaniu opcji lub kodu przycisku.
Wyświetlanie przycisku za pomocą gapi.ytsubscribe.render
Przykład poniżej pokazuje, jak wywołać metodę gapi.ytsubscribe.render
, aby dynamicznie renderować przycisk po kliknięciu linku: