Atributos del botón de suscripción
Obligatorio
En esta sección se explica cómo construir un elemento <div>
para un botón de suscripción. La lista a continuación explica los atributos obligatorios y opcionales del elemento. Los atributos opcionales te permiten controlar el diseño y el tema del botón, así como elegir si deseas mostrar el conteo de suscriptores del canal.
-
class
: establece el valor eng-ytsubscribe
. Esta clase identifica el elemento<div>
como el contenedor de un botón de suscripción y permite que YouTube modifique el tamaño del botón insertado de forma dinámica, como se explica en la siguiente sección. -
Debes especificar un valor para uno de los dos atributos a continuación:
data-channel
: el nombre del canal asociado con el botón. Valor de muestra:GoogleDevelopers
.data-channelid
: el ID del canal asociado al botón. Valor de muestra:UC_x5XG1OV2P6uZZ5FSM9Ttw
. Puedes recuperar el ID del canal en tu página Configuración de la cuenta de YouTube o a través de APIs Explorer al final de este documento. Obtén más información sobre cómo trabajar con los ID del canal.
Opcional
-
data-layout
: el formato para el botón. Los valores de los atributos válidos son:default
: muestra un ícono de botón de reproducción y la palabra "suscribirse" en el idioma del usuario, que se selecciona con la configuración de idioma del usuario o su ubicación.full
: muestra el avatar y el título del canal, además del botón estándar.
-
data-theme
: especifica el esquema de colores que deseas utilizar para el botón. Los valores válidos sondefault
ydark
. El temadark
está diseñado para las aplicaciones que colocan botones en un elemento de fondo más oscuro. -
data-count
: indica si el botón muestra la cantidad de suscriptores que tiene el canal. Mostrar el conteo de suscriptores es el comportamiento predeterminado del botón. Sin embargo, el conteo no se muestra en los canales pagos. Los valores válidos sondefault
yhidden
.
Procesamiento dinámico
Como alternativa al uso del código de inserción estándar de la herramienta de configuración, puedes procesar el Subscribe Button de forma dinámica. Este enfoque evita que el JavaScript de la API transfiera todo el DOM para localizar los botones, lo que puede mejorar el tiempo de procesamiento del botón.
Como parte de la Google+ JavaScript API, Subscribe Button es compatible con los métodos estándar go
y render
, que se pueden utilizar para procesar los botones de suscripción de forma dinámica. Por ejemplo, puedes utilizar estos métodos para procesar un botón que no está presente cuando el evento DOM ready
se activa, como en una página que se actualiza con AJAX.
Método | Descripción |
---|---|
gapi.ytsubscribe.go( |
Procesa todos los botones de suscripción en el contenedor especificado. Utiliza este método si los elementos del botón de suscripción que desees procesar ya existen. Por ejemplo, si tu aplicación envía una solicitud AJAX que devuelve el elemento <div> completo para Subscribe Button, invoca el método go() para procesar el botón.
|
gapi.ytsubscribe.render( |
Procesa Subscribe Button en el contenedor especificado. Utiliza este método si el elemento que contendrá Subscribe Button aún no existe y se debe crear.
|
Cómo procesar un botón con gapi.ytsubscribe.go
El ejemplo a continuación muestra el código que tendrías que utilizar para invocar el método gapi.ytsubscribe.render
para procesar un botón de forma dinámica cuando se hace clic en el vínculo.
Nota: La herramienta de configuración anterior también utiliza el método go
para procesar un botón nuevo cuando actualizas las opciones del botón o código
.
Cómo procesar un botón con gapi.ytsubscribe.render
El ejemplo a continuación muestra la forma para invocar el método gapi.ytsubscribe.render
para procesar de forma dinámica un botón cuando se hace clic en el vínculo.