Referencia

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 en g-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:

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 son default y dark. El tema dark 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 son default y hidden.

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(
  opt_container
)
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.
opt_container
El elemento HTML que contiene los botones de suscripción para procesar. Especifica el ID del elemento o el elemento DOM en sí. Si se omite este parámetro, se procesan todos los botones de suscripción en la página.
gapi.ytsubscribe.render(
  container,
  parameters
)
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.
container
Identifica el elemento HTML vacío en el que se procesará Subscribe Button. Especifica el ID del elemento o el elemento DOM en sí.
parameters
Un objeto que contiene atributos del botón de suscripción como pares key:value, tales como {"channel": "GoogleDevelopers", "layout": "full"}.

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.