Reference Guide

Atributos

Nesta seção, explicamos como criar um elemento <div> para um botão de assinatura. As listas abaixo explicam os atributos obrigatórios e opcionais do elemento. Os atributos opcionais permitem controlar o layout do botão e o tema, além de escolher se a contagem de inscritos no canal será exibida.

Atributos obrigatórios

  • class: defina o valor como g-ytsubscribe. Essa classe identifica o elemento <div> como um contêiner para um botão de inscrição e permite que o YouTube redimensione dinamicamente o botão incorporado, conforme explicado na próxima seção.

  • Você deve especificar um valor para um dos dois atributos a seguir:

Atributos opcionais

  • data-layout: o formato do botão. Os valores de atributos válidos são:

    • default: mostra um ícone de botão de reprodução e a palavra "inscrever-se" no idioma do usuário, que é selecionado usando a configuração de idioma ou a localização do usuário.
    • full: mostra o avatar e o título do canal, além do botão padrão.

  • data-theme: especifica o esquema de cores a ser usado no botão. Os valores válidos são default e dark. O tema dark é destinado a aplicativos que colocam botões sobre um elemento de plano de fundo mais escuro.

  • data-count: indica se o botão mostra o número de inscritos do canal. O comportamento padrão do botão é exibir a contagem de inscritos. Os valores válidos são default e hidden.

  • data-onytevent: observação: esse atributo foi descontinuado.

Eventos

Observação:os eventos subscribe e unsubscribe do botão "Inscrever-se" foram descontinuados. Da mesma forma, o atributo data-ytonevent, que antes podia ser adicionado ao elemento de widget para especificar um listener de notificações de eventos, também foi descontinuado.

Renderização dinâmica

Como alternativa ao uso do código de incorporação padrão da ferramenta de configuração, você pode renderizar dinamicamente o Subscribe Button. Essa abordagem impede que o JavaScript da API percorra todo o DOM para localizar botões, o que pode melhorar o tempo de renderização deles.

Como parte do Google+ JavaScript API, o Subscribe Button oferece suporte aos métodos padrão go e render, que podem ser usados para renderizar dinamicamente botões de assinatura. Por exemplo, é possível usar esses métodos para renderizar um botão que não está presente quando o evento DOM ready é disparado, como em uma página atualizada com AJAX.

Método Descrição
gapi.ytsubscribe.go(
  opt_container
)		 Renderiza todos os botões de inscrição no contêiner especificado. Use este método se os elementos do botão de inscrição que você deseja renderizar já existem. Por exemplo, se o aplicativo enviar uma solicitação AJAX que retorne o elemento <div> completo de um Subscribe Button, chame o método go() para renderizar o botão.
opt_container
O elemento HTML que contém os botões de assinatura a serem renderizados. Especifique o ID do elemento ou o próprio elemento do DOM. Se este parâmetro for omitido, todos os botões de inscrição na página serão renderizados.
gapi.ytsubscribe.render(
  container,
  parameters
)		 Renderiza o Subscribe Button no contêiner especificado. Use esse método se o elemento que vai conter o Subscribe Button ainda não existir e precisar ser construído.
contêiner
Identifica o elemento HTML vazio em que o Subscribe Button será renderizado. Especifique o ID do elemento ou o próprio elemento do DOM.
parâmetros
Um objeto que contém atributos do botão de inscrição como pares key:value, como {"channel": "GoogleDevelopers", "layout": "full"}.

Renderizar um botão com gapi.ytsubscribe.go

O exemplo abaixo mostra o código que você usaria para chamar o método gapi.ytsubscribe.go e renderizar dinamicamente um botão quando o link for clicado.

Observação:a ferramenta de configuração acima também usa o método go para renderizar um novo botão quando você atualiza as opções ou o código dele.

Renderizar um botão com gapi.ytsubscribe.render

O exemplo abaixo demonstra como chamar o método gapi.ytsubscribe.render para renderizar dinamicamente um botão quando o link é clicado: