Riferimenti

Attributi del pulsante di iscrizione

Attributi obbligatori

In questa sezione viene descritto come creare un elemento <div> per un pulsante di iscrizione. Nell'elenco seguente sono indicati gli attributi obbligatori e facoltativi dell'elemento. Gli attributi facoltativi ti permettono di controllare il layout e il tema del pulsante e di scegliere se mostrare o meno il numero di iscritti al canale.

  • class – Imposta il valore su g-ytsubscribe. Questa classe identifica l'elemento <div> come contenitore di un pulsante di iscrizione e permette a YouTube di ridimensionare in modo dinamico il pulsante incorporato, come illustrato nella sezione successiva.

  • Devi specificare un valore per uno dei seguenti attributi:

    • data-channel – Il nome del canale associato al pulsante. Valore di esempio: GoogleDevelopers.
    • data-channelid – L'ID del canale associato al pulsante. Valore di esempio: UC_x5XG1OV2P6uZZ5FSM9Ttw. Puoi recuperare l'ID del tuo canale nelle impostazioni dell'account YouTube o utilizzando APIs Explorer alla fine di questo documento. Ulteriori informazioni sull'utilizzo degli ID canale.

Attributi facoltativi

  • data-layout – Il formato del pulsante. I valori validi per l'attributo sono:

    • default – Consente di mostrare l'icona del pulsante di riproduzione e la parola "subscribe" nella lingua dell'utente, selezionabile mediante l'impostazione corrispondente o in base alla posizione dell'utente.
    • full – Consente di mostrare l'avatar e il titolo del canale, oltre al pulsante standard.

  • data-theme – Consente di specificare lo schema di colori da utilizzare per il pulsante. I valori validi sono default e dark. Il tema dark è destinato alle applicazioni in cui i pulsanti vengono posizionati su uno sfondo più scuro.

  • data-count – Indica se sul pulsante viene riportato o meno il numero di iscritti al canale. Per impostazione predefinita, il numero è riportato sul pulsante. Non è invece indicato per i canali a pagamento. I valori validi sono default e hidden.

Rendering dinamico

Anziché utilizzare il codice di incorporamento standard dello strumento di configurazione, puoi eseguire il rendering dell'elemento Subscribe Button in modo dinamico. Questo approccio impedisce al codice JavaScript dell'API di attraversare l'intero DOM per individuare i pulsanti, riducendo il tempo necessario per il rendering del pulsante.

L'elemento Subscribe Button della Google+ JavaScript API supporta i metodi standard go e render, che possono essere utilizzati per eseguire il rendering dinamico dei pulsanti di iscrizione. Ad esempio, puoi utilizzare questi metodi per eseguire il rendering di un pulsante che non è presente quando viene generato l'evento ready del DOM, ad esempio su una pagina caricata con AJAX.

Metodo Descrizione
gapi.ytsubscribe.go(
  opt_container
)
Consente di eseguire il rendering di tutti i pulsanti di iscrizione nel contenitore specificato. Usa questo metodo se i pulsanti di iscrizione su cui desideri eseguire il rendering esistono già. Ad esempio, se la tua applicazione invia una richiesta AJAX che restituisce l'elemento <div> completo di un Subscribe Button, chiama il metodo go() per eseguire il rendering del pulsante.
opt_container
L'elemento HTML che contiene i pulsanti di iscrizione di cui eseguire il rendering. Specifica l'ID dell'elemento oppure l'elemento DOM stesso. Se questo parametro viene omesso, il rendering viene eseguito su tutti i pulsanti di iscrizione nella pagina.
gapi.ytsubscribe.render(
  container,
  parameters
)
Consente di eseguire il rendering dell'elemento Subscribe Button all'interno del contenitore specificato. Usa questo metodo se l'elemento che conterrà Subscribe Button non esiste e deve essere creato.
container
Consente di identificare l'elemento HTML vuoto in cui verrà eseguito il rendering dell'elemento Subscribe Button. Specifica l'ID dell'elemento oppure l'elemento DOM stesso.
parameters
Un oggetto che include gli attributi del pulsante di iscrizione come coppie key:value, ad esempio {"channel": "GoogleDevelopers", "layout": "full"}.

Rendering di un pulsante con gapi.ytsubscribe.go

Nell'esempio seguente viene mostrato il codice da utilizzare per chiamare il metodo gapi.ytsubscribe.go per eseguire il rendering dinamico di un pulsante quando l'utente fa clic sul link.

Nota. Lo strumento di configurazione illustrato in precedenza utilizza anche il metodo go per eseguire il rendering di un nuovo pulsante quando aggiorni le opzioni o il codice del pulsante.

Rendering di un pulsante con gapi.ytsubscribe.render

Nell'esempio seguente viene illustrato come chiamare il metodo gapi.ytsubscribe.render per eseguire il rendering dinamico di un pulsante quando l'utente fa clic sul collegamento.