Atribut
Bagian ini menjelaskan cara membuat elemen <div>
untuk tombol langganan. Daftar di bawah menjelaskan atribut wajib dan opsional elemen. Dengan atribut opsional, Anda dapat mengontrol tata letak dan tema tombol serta memilih apakah akan menampilkan jumlah subscriber channel atau tidak.
Atribut yang diperlukan
-
class
– Tetapkan nilai keg-ytsubscribe
. Class ini mengidentifikasi elemen<div>
sebagai penampung untuk tombol langganan dan memungkinkan YouTube mengubah ukuran tombol tersemat secara dinamis seperti yang dijelaskan di bagian berikutnya. -
Anda harus menentukan nilai untuk salah satu dari dua atribut berikut:
data-channel
– Nama channel yang terkait dengan tombol. Nilai contoh:GoogleDevelopers
.data-channelid
– ID saluran yang terkait dengan tombol. Nilai contoh:UC_x5XG1OV2P6uZZ5FSM9Ttw
. Anda dapat mengambil ID channel di setelan akun YouTube atau menggunakan APIs Explorer di akhir dokumen ini. Pelajari lebih lanjut cara menggunakan ID channel.
Atribut opsional
-
data-layout
– Format untuk tombol. Nilai atribut yang valid adalah:default
– Menampilkan ikon tombol putar dan kata 'subscribe' dalam bahasa pengguna yang dipilih menggunakan setelan bahasa atau lokasi pengguna.full
– Menampilkan avatar dan judul channel, selain tombol standar.
-
data-theme
– Menentukan skema warna yang akan digunakan untuk tombol. Nilai yang valid adalahdefault
dandark
. Temadark
ditujukan untuk aplikasi yang menempatkan tombol di atas elemen latar yang lebih gelap. -
data-count
– Menunjukkan apakah tombol menampilkan jumlah subscriber yang dimiliki channel. Perilaku default tombol adalah untuk menampilkan jumlah subscriber. Nilai yang valid adalahdefault
danhidden
. -
data-onytevent
– Catatan: Atribut ini tidak digunakan lagi.
Peristiwa
Catatan: Peristiwa subscribe
dan unsubscribe
pada Tombol Berlangganan sudah tidak digunakan lagi. Demikian pula, atribut data-ytonevent
, yang sebelumnya dapat ditambahkan ke elemen widget untuk menentukan pemroses notifikasi peristiwa, juga tidak digunakan lagi.
Rendering dinamis
Sebagai alternatif untuk menggunakan kode sematan standar dari alat konfigurasi, Anda dapat merender Subscribe Button secara dinamis. Pendekatan ini mencegah JavaScript API menjelajahi seluruh DOM untuk menemukan tombol, yang dapat meningkatkan waktu rendering tombol.
Sebagai bagian dari Google+ JavaScript API, Subscribe Button mendukung metode go
dan render
standar, yang dapat digunakan untuk merender tombol langganan secara dinamis. Misalnya, Anda dapat menggunakan metode ini untuk merender tombol yang tidak ada saat peristiwa DOM ready
aktif, seperti di halaman yang diperbarui dengan AJAX.
Metode | Deskripsi |
---|---|
gapi.ytsubscribe.go( |
Merender semua tombol langganan dalam penampung yang ditentukan. Gunakan metode ini jika elemen tombol langganan yang ingin dirender sudah ada. Misalnya, jika aplikasi Anda mengirim permintaan AJAX yang menampilkan elemen <div> lengkap untuk Subscribe Button, panggil metode go() untuk merender tombol.
|
gapi.ytsubscribe.render( |
Merender Subscribe Button dalam penampung yang ditentukan. Gunakan metode ini jika elemen yang akan berisi Subscribe Button belum ada dan perlu dibuat.
|
Merender tombol dengan gapi.ytsubscribe.go
Contoh di bawah menunjukkan kode yang akan Anda gunakan untuk memanggil metode gapi.ytsubscribe.go
guna merender tombol secara dinamis saat link diklik.
Catatan: Alat konfigurasi di atas juga menggunakan metode go
untuk merender tombol baru saat Anda memperbarui opsi atau kode tombol.
Merender tombol dengan gapi.ytsubscribe.render
Contoh di bawah menunjukkan cara memanggil metode gapi.ytsubscribe.render
untuk merender tombol secara dinamis saat link diklik: