Referans

Abonelik düğmesinin özellikleri

Gerekli

Bu bölümde, bir abonelik düğmesi için nasıl <div> öğesi oluşturulacağı açıklanmaktadır. Aşağıdaki liste, öğenin gerekli ve isteğe bağlı özelliklerini açıklamaktadır. İsteğe bağlı özellikler, düğmenin düzeni ve temasını kontrol etmenizin yanı sıra kanalın abone sayısının gösterilip gösterilmeyeceğini seçmenizi de sağlar.

  • class – Değeri g-ytsubscribe olarak ayarlayın. Bu sınıf, <div> öğesini bir abonelik düğmesi için kapsayıcı olarak tanımlar ve YouTube'un yerleştirilmiş düğmeyi sonraki bölümde açıklandığı şekilde dinamik olarak yeniden boyutlandırmasını sağlar.

  • Aşağıdaki iki özellikten biri için bir değer belirtmeniz gerekir.

    • data-channel – Düğmeyle ilişkilendirilen kanalın adıdır. Örnek değer: GoogleDevelopers.
    • data-channelid – Düğmeyle ilişkilendirilen kanal kimliğidir. Örnek değer: UC_x5XG1OV2P6uZZ5FSM9Ttw. YouTube hesap ayarlarınızda veya bu belgenin sonundaki APIs Explorer'ı kullanarak kanal kimliğinizi alabilirsiniz Kanal kimlikleriyle çalışma hakkında daha fazla bilgi edinin.

İsteğe bağlı

  • data-layout – Düğmenin biçimidir. Geçerli özellik değerleri şunlardır:

    • default – Bir oynat düğmesi simgesini ve "abone ol" ifadesini kullanıcının dilinde gösterir ve bu dil, kullanıcının dil ayarı ya da konumu kullanılarak seçilir.
    • full – Standart düğmeye ek olarak kanalın avatarını ve kanal başlığını görüntüler.

  • data-theme – Düğme için kullanılacak renk düzenini belirtir. Geçerli değerler, default ve dark değerleridir. dark teması, düğmeleri daha koyu bir arka plan öğesine yerleştiren uygulamalara yöneliktir.

  • data-count – Düğmenin kanalın sahip olduğu abone sayısını görüntüleyip görüntülemediğini belirtir. Düğmenin varsayılan davranışı, abone sayısını görüntülemek şeklindedir. Ancak ücretli kanallar için sayı görüntülenmez. Geçerli değerler default ve hidden değerleridir.

Dinamik oluşturma

Yapılandırma aracından standart yerleştirme kodunu kullanmaya alternatif olarak Subscribe Button öğesini dinamik olarak da oluşturabilirsiniz. Bu yaklaşım, API'nın JavaScript'inin düğmelerin yerini belirlemek için tüm DOM öğesinde gezinmesini önler, bu da düğme oluşturma süresini iyileştirebilir.

Google+ JavaScript API parçası olan Subscribe Button, standart go ve render yöntemlerini destekler. Bu yöntemler, abonelik düğmelerini dinamik şekilde oluşturmak için kullanılabilir. Örneğin, DOM ready etkinlikleri tetiklendiğinde mevcut olmayan, AJAX ile güncellenmiş bir sayfadaki gibi bir düğme oluşturmak için bu yöntemleri kullanabilirsiniz.

Yöntem Açıklama
gapi.ytsubscribe.go(
  opt_container
)
Belirtilen kapsayıcıdaki tüm abonelik düğmelerini oluşturur. Oluşturmak istediğiniz abonelik düğmesi öğeleri zaten varsa bu yöntemi kullanın. Örneğin, uygulamanız bir Subscribe Button için eksiksiz <div> öğesini döndüren bir AJAX isteği gönderiyorsa düğmeyi oluşturmak için go() yöntemini kullanın.
opt_container
Oluşturulacak abonelik düğmelerini içeren HTML öğesidir. Öğenin kimliğini veya DOM öğesinin kendisini belirtin. Bu parametre eklenmezse sayfadaki tüm abonelik düğmeleri oluşturulur.
gapi.ytsubscribe.render(
  container,
  parameters
)
Belirtilen kapsayıcıda Subscribe Button oluşturur. Subscribe Button içerecek öğe mevcut değilse ve oluşturulması gerekiyorsa bu yöntemi kullanın.
container
Subscribe Button öğesinin oluşturulacağı boş HTML öğesini tanımlar. Öğenin kimliğini veya DOM öğesinin kendisini belirtin.
parameters
Abonelik düğmesi özelliklerini {"channel": "GoogleDevelopers", "layout": "full"} gibi key:value çiftleri halinde içeren bir nesnedir.

gapi.ytsubscribe.go ile düğme oluşturma

Aşağıdaki örnekte, bağlantı tıklandığında dinamik olarak bir düğme oluşturmak üzere gapi.ytsubscribe.go yöntemini çağırmak için kullanacağınız kod gösterilmektedir.

Not: Yukarıdaki yapılandırma aracı düğme seçeneklerini veya kodu güncellediğinizde yeni bir düğme oluşturmak için go yöntemini kullanır.

gapi.ytsubscribe.render ile düğme oluşturma

Aşağıdaki örnekte, bağlantı tıklandığında bir düğmeyi dinamik olarak oluşturmak için gapi.ytsubscribe.render yönteminin nasıl kullanılacağı gösterilmektedir.