Classroom'da Paylaş Düğmesi

Web sitenizin ihtiyaçlarını (ör. düğme boyutunu ve yükleme tekniğini değiştirmek) karşılamak için Classroom paylaşım düğmesini ekleyebilir ve özelleştirebilirsiniz. Web sitenize Classroom paylaşım düğmesini ekleyerek, kullanıcılarınızın içeriğinizi sınıflarıyla paylaşmasına ve sitenize trafik çekmesine olanak tanırsınız.

Kullanmaya başlama

Basit bir düğme

Sayfanıza bir Classroom paylaşım düğmesi eklemenin en kolay yolu, gerekli JavaScript kaynağını ve bir paylaşım düğmesi etiketi eklemektir:

<script src="https://apis.google.com/js/platform.js" async defer></script>
<g:sharetoclassroom url="http://url-to-share" size="32"></g:sharetoclassroom>

Komut dosyası, HTTPS protokolü kullanılarak yüklenmeli ve sayfanın herhangi bir yerine kısıtlama olmadan dahil edilebilir. Daha fazla bilgi için SSS bölümüne bakın.

Ayrıca, sınıf özelliğini g-sharetoclassroom olarak ayarlayıp herhangi bir düğme özelliğinin önüne data- ekleyerek bir HTML5 geçerli paylaşım etiketi de kullanabilirsiniz.

<div class="g-sharetoclassroom" data-size="32" data-url="..." ></div>

Varsayılan olarak, dahil edilen komut dosyası DOM'u aktarır ve paylaşım etiketlerini düğme olarak oluşturur. Sayfa içinde yalnızca tek bir öğeyi taşımak veya belirli bir öğeyi paylaş düğmesi olarak oluşturmak için JavaScript API'sını kullanarak büyük sayfalarda oluşturma süresini artırabilirsiniz.

onLoad ve komut dosyası etiketi parametreleriyle ertelenmiş yürütme

Düğme kodunun ne zaman çalıştırılacağını belirlemek için parsetags komut dosyası parametresini onload (varsayılan) veya explicit olarak ayarlayın. Komut dosyası etiketi parametrelerini belirtmek için aşağıdaki söz dizimini kullanın:

<script >
  window.___gcfg = {
    parsetags: 'onload'
  };
</script>
<script src="https://apis.google.com/js/platform.js" async defer></script>

Yapılandırma

Classroom'da paylaşılacak URL'yi ayarlama

Classroom'da paylaşılan URL, düğmenin url özelliğine göre belirlenir. Bu özellik, paylaşılacak hedef URL'yi açık bir şekilde tanımlar ve paylaş düğmesini oluşturabilmek için ayarlanmalıdır.

Komut dosyası etiketi parametreleri

Bu parametreler, platform.js komut dosyası yüklenmeden önce çalışması gereken bir <script /> öğesi içinde tanımlanır. Parametreler, web sayfasının tamamında kullanılan düğme yükleme mekanizmasını kontrol eder.

İzin verilen parametreler şunlardır:

yükleme

Sayfadaki tüm paylaşım düğmeleri, sayfa yüklendikten sonra otomatik olarak oluşturulur. Ertelenen yürütme yükleme örneğine bakın.

uygunsuz

Paylaşım düğmeleri yalnızca gapi.sharetoclassroom.go veya gapi.sharetoclassroom.render çağrılarıyla oluşturulur.

Açık yüklemeyi, sayfanızdaki belirli kapsayıcılara yönlendiren çağrı ve oluşturma çağrılarıyla birlikte kullandığınızda, komut dosyasının tüm DOM'dan geçiş yapmasını engellersiniz. Bu da düğme oluşturma süresini iyileştirebilir. gapi.sharetoclassroom.go ve gapi.sharetoclassroom.render örneklerini inceleyin.

Etiket özelliklerini paylaşma

Bu parametreler, her düğme için ayarları kontrol eder. Bu parametreleri, paylaş düğmesi etiketlerinde attribute=value çiftleri veya gapi.sharetoclassroom.render çağrısında JavaScript key:value çiftleri olarak ayarlayabilirsiniz.

Özellik	Değer	Varsayılan	Açıklama
body	string	null	Classroom'da paylaşılacak öğe gövde metnini ayarlar.
courseid	string	null	Belirtilirse bir kullanıcı paylaş düğmesini tıkladıktan sonra görüntülenen "Sınıf seç" menüsünde önceden seçmek için Kurs Kimliği'ni ayarlar. Kullanıcı, gerekirse önceden seçilen bu değeri değiştirebilir.
itemtype	announcement, assignment, material veya question	null	Kullanıcı bir kursu ilk kez seçtikten sonra (veya courseid de belirtilmişse hemen) oluşturma iletişim kutusu otomatik olarak gösterilir. Bir öğrenci sınıf seçerse veya öğretmen öğrenci olduğu bir sınıfı seçerse bu değer yoksayılır.
locale	RFC 3066 uyumlu dil etiketi	en-US	Erişilebilirlik amacıyla aria-label düğmesinin dilini ayarlar. Bu, kullanıcı düğmeyi tıkladığında görünen paylaşım iletişim kutusunun dilini etkilemez: Kullanıcının tarayıcı tercihlerinden etkilenir.
onsharecomplete	string	null	Belirtilirse kullanıcı, bağlantınızı paylaşmayı bitirdiğinde çağrılan genel ad alanındaki bir işlevin adını belirler. Bağımsız değişkenlerinizi parametreler üzerinden gapi.sharetoclassroom.render işlevine geçirirseniz bir işlevin kendisini de kullanabilirsiniz. Bu özellik Internet Explorer'da çalışmaz (aşağıya bakın)
onsharestart	string	null	Belirtilirse paylaşım iletişim kutusu açıldığında çağrılan genel ad alanındaki bir işlevin adını belirler. Bağımsız değişkenlerinizi parametreler üzerinden gapi.sharetoclassroom.render işlevine geçirirseniz bir işlevin kendisini de kullanabilirsiniz. Bu özellik Internet Explorer'da çalışmaz (aşağıya bakın).
size	int	null	Boyutu, paylaş düğmesinin piksel cinsinden ayarlar. Boyut çıkarılırsa düğme 32 değerini kullanır.
theme	classic, dark veya light	classic	Seçilen temanın düğme simgesini ayarlar.
title	string	null	Classroom'da paylaşılacak öğe başlığını belirler.
url	Paylaşılacak URL	null	Classroom'da paylaşılacak URL'yi ayarlar. Bu özelliği gapi.sharetoclassroom.render kullanarak ayarlarsanız URL'den çıkış yapmamalısınız.

Classroom paylaşım düğmesi yönergeleri

Classroom Paylaş düğmesinin gösterilmesi, min. maks. boyut yönergelerimize ve ilgili renk/düğme şablonlarına uygun olması gerekir. Düğme, minimum 32 piksel ile maksimum 96 piksel arasında çeşitli boyutları destekler.

Tema	Örnek
Klasik
Koyu renk
Açık renk

Özelleştirme

Simgeyi hiçbir şekilde değiştirmemenizi veya yeniden oluşturmamanızı tercih ederiz. Ancak, uygulamanızda birden fazla üçüncü taraf sosyal simge gösteriyorsanız Classroom simgesini uygulamanızın stiline uyacak şekilde özelleştirebilirsiniz. Bunu yaparsanız tüm düğmelerin benzer bir stil kullanılarak özelleştirildiğinden ve özelleştirmelerin Classroom markalama yönergelerine uygun olduğundan emin olun. Paylaş düğmesinin görünümünü ve davranışını tam olarak kontrol etmek isterseniz paylaşımı aşağıdaki yapının URL'si aracılığıyla başlatabilirsiniz: https://classroom.google.com/share?url={url-to-share}.

JavaScript API

Paylaşım düğmesi JavaScript'i, gapi.sharetoclassroom ad alanının altında iki düğme oluşturma işlevi tanımlar. Ayrıştırma etiketlerini explicit olarak ayarlayarak otomatik oluşturmayı devre dışı bırakırsanız bu işlevlerden birini çağırmanız gerekir.

Yöntem	Açıklama
gapi.sharetoclassroom.render( container, parameters )	Belirtilen kapsayıcıyı paylaş düğmesi olarak oluşturur. kapsayıcı Paylaş düğmesi olarak oluşturulacak kapsayıcı. Kapsayıcının kimliğini (dize) veya DOM öğesinin kendisini belirtin. Parametreler Etiket özelliklerini key=value çift olarak içeren bir nesne. Örneğin, {"size": "300", "theme": "light"}.
gapi.sharetoclassroom.go( opt_container )	Belirtilen kapsayıcıdaki tüm paylaş düğmesi etiketlerini ve sınıfları oluşturur. Bu işlev yalnızca parsetags, explicit olarak ayarlanmışsa performans nedeniyle kullanılabilir. opt_container Oluşturulacak paylaş düğmesi etiketlerini içeren kapsayıcı. Kapsayıcının kimliğini (dize) veya DOM öğesinin kendisini belirtin. opt_container parametresi atlanırsa sayfadaki tüm paylaş düğmesi etiketleri oluşturulur.

Örnekler

Temel sayfa

<html>
  <head>
    <title>Classroom demo: Basic page</title>
    <link href="http://www.example.com" />
    <script src="https://apis.google.com/js/platform.js" async defer>
    </script>
  </head>
  <body>
    <g:sharetoclassroom size=32 url="http://google.com"></g:sharetoclassroom>
  </body>
</html>

Etiketleri DOM alt kümesinde açıkça yükleme

<html>
  <head>
    <title>Demo: Explicit load of a Classroom share button</title>
    <link href="http://www.example.com" />
    <script>
      window.___gcfg = {
        parsetags: 'explicit'
      };
    </script>
    <script src="https://apis.google.com/js/platform.js">
    </script>
  </head>
  <body>
    <div id="content">
      <div class="g-sharetoclassroom" data-size="32" data-url="..." ></div>
    </div>
    <script>
      gapi.sharetoclassroom.go("content");
    </script>
  </body>
</html>

Uygunsuz oluşturma

<html>
  <head>
    <title>Demo: Explicit render of a Classroom share button</title>
    <link href="http://www.example.com" />
    <script>
      window.___gcfg = {
        parsetags: 'explicit'
      };
      function renderWidget() {
        gapi.sharetoclassroom.render("widget-div",
            {"url": "http://www.google.com"} );
      }
    </script>
    <script src="https://apis.google.com/js/platform.js">
    </script>
  </head>
  <body>
    <a href="#" onClick="renderWidget();">Render the Classroom share button</a>
    <div id="widget-div"></div>
  </body>
</html>

Sık sorulan sorular

Aşağıdaki SSS bölümünde teknik hususlar ve uygulama ayrıntıları ele alınmaktadır. Ek kaynaklar için genel SSS bölümünü inceleyin.

Classroom paylaşım düğmesi entegrasyonumu nasıl test edebilirim?

Entegrasyonunuzdan Classroom ile paylaşımı test etmek için Classroom test hesapları talep edebilirsiniz.

Tek bir sayfaya, farklı URL'leri paylaşan birden fazla düğme yerleştirebilir miyim?

Evet. Classroom'da paylaşılacak URL'yi belirtmek için paylaşım etiketi parametrelerinde belirtilen url özelliğini kullanın.

Paylaş düğmesini sayfalarımda nereye yerleştirmeliyim?

Sayfanızı ve kullanıcılarınızı en iyi siz tanırsınız, bu nedenle düğmeyi en etkili olacağını düşündüğünüz yere koymanızı öneririz. Ekranın üst kısmında, sayfa başlığının yanında ve bağlantıların paylaşılmaya yakın kısmı genellikle iyi bir konumdur. Paylaş düğmesini, oluşturulan bir içeriğin hem sonuna hem de başına yerleştirmek de etkili olabilir.

Sayfadaki <script> etiketinin konumundan herhangi bir gecikme etkisi oluyor mu?

Hayır, <script> etiketinin yerleştirilmesinin neden olduğu önemli bir gecikme etkisi yoktur. Bununla birlikte, etiketi dokümanın en altına, </body> kapanış etiketinin hemen öncesine yerleştirerek sayfanın yüklenme hızını artırabilirsiniz.

<script> etiketinin paylaşım etiketinden önce eklenmesi gerekir mi?

Hayır, <script> etiketi sayfanın herhangi bir yerine eklenebilir.

Başka bir <script> etiketi JavaScript API bölümündeki yöntemlerden birini çağırmadan önce <script> etiketinin eklenmesi gerekir mi?

Evet, JavaScript API yöntemlerinden herhangi birini kullanırsanız <script> yöntemini ekledikten sonra bu yöntemlerin sayfaya yerleştirilmesi gerekir. async defer yöntemini de JavaScript API yöntemlerinin hiçbiriyle birlikte kullanamazsınız.

url özelliğini kullanmam gerekir mi?

url özelliği zorunludur. url politikası açıkça ayarlanmadığında paylaşım düğmesi oluşturulmaz. Daha fazla bilgi için hedef URL'yi paylaşma bölümüne bakın.

Bazı kullanıcılarım, paylaş düğmesi bulunan sayfaları görüntülerken bir güvenlik uyarısı alıyor. Bu sorun nasıl önlenir?

Paylaş düğmesi kodu, Google sunucularından bir komut dosyası gerektirir. http:// aracılığıyla komut dosyasını https:// aracılığıyla yüklenen bir sayfaya ekleyerek bu hatayı alabilirsiniz. Komut dosyasını eklemek için https:// kullanmanızı öneririz:

<script src="https://apis.google.com/js/platform.js" async defer></script>

Hangi web tarayıcıları desteklenir?

Classroom paylaşım düğmesi, Classroom web arayüzü ile aynı web tarayıcılarını (Chrome, Firefox®, Internet Explorer® veya Safari® gibi) destekler. Not: onsharestart ve onsharecomplete için belirtilen işlevler Internet Explorer kullanıcıları için çağrılmaz.

Classroom paylaş düğmesini tıkladığınızda hangi veriler Classroom'a gönderilir?

Paylaş düğmesini tıklayan bir kullanıcıdan Eğitim için G Suite hesabıyla oturum açması istenir. Kimlik doğrulamasından sonra, yayını tamamlamak için kullanıcı hesabı ve url özelliği Classroom'a gönderilir.