Reference Guide

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ść na g-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 to defaultdark. Motyw dark 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 to defaulthidden.

  • data-onyteventUwaga: 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 gorender, 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(
  opt_container
)
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.
opt_container
Element HTML, który zawiera przyciski subskrypcji do renderowania. Wymaga wskazania identyfikatora elementu lub samego elementu DOM. W razie pominięcia tego parametru renderowane są wszystkie przyciski subskrypcji na stronie.
gapi.ytsubscribe.render(
  container,
  parameters
)
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ć.
kontener
Określa pusty element HTML, w którym będzie renderowany element Subscribe Button. Wymaga wskazania identyfikatora elementu lub samego elementu DOM.
parametry
Obiekt zawierający atrybuty przycisku subskrypcji jako pary key:value, np. {"channel": "GoogleDevelopers", "layout": "full"}.

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: