Dokümantasyon

İçeriği çevirme

Magic Translate 'in çevirmesini istediğiniz içeriği işaretleyin. Orijinal içerik, çeviri yüklenene kadar gösterilir.

<t> öğesi

Metni çevirmek için bir <t> öğesine koyun. HTML içerebilir:

<t>This content will be translated</t>


<t>Click <a href="/sale">here</a> to see <b>today's</b> deals.</t>

Özel bir öğe adı tercih ederseniz <mt-translate> da çalışır.

data-t özniteliği

Bir sarıcı öğesi ekleyemiyorsanız, içeriğini çevirmek için mevcut öğeye data-t ekleyin:

<title data-t>My online shop</title>


<select>
  <option data-t>Small</option>
  <option data-t>Large</option>
</select>

Öznitellikler

data-t-attrs 'de çevrilecek öznitelikleri boşluklarla ayrılmış olarak listeleyin:

<input placeholder="Search products" data-t-attrs="placeholder" />


<img src="team.jpg" alt="Our team" title="Say hi" data-t-attrs="alt title" />

Değişkenler

Bir ad veya sayım gibi değişen değerleri data-v içine JSON nesnesi olarak koyun ve bunları $name olarak referans alın:

<t data-v='{"name": "Bob", "count": 7}'>Hi $name, you have $count new messages</t>


<input placeholder="Search $count products" data-t-attrs="placeholder" data-v='{"count": 3}' />

Magic Translate, değerlerin etrafındaki metni bir kez Hi {0}, you have {1} new messages olarak çevirir ve değerleri sayfaya geri koyar. Çeviri önbelleğe alınır ve her isim ve her sayı için çalışır ve değerlerin kendileri asla Magic Translate 'a gönderilmez.

Yeni değerleri göstermek için data-v öğesini değiştirin. Önbelleğe alınan çeviri yeniden kullanılır ve herhangi bir istek yapılmaz:

element.dataset.v = JSON.stringify({ name: 'Bob', count: 8 });

Değerler ilk göründükleri sıraya göre numaralandırılır. Çeviri onları dilin ihtiyaç duyduğu yere taşıyabilir, örneğin {1} neue Nachrichten für {0}.

Birkaç kural:

  • Yalnızca data-v tuşları değiştirilir, bu nedenle $5 gibi metinler olduğu gibi kalır. count ve counts gibi iki tuş aynı şekilde başlarsa, en uzun anahtar kazanır.
  • Aynı isim birden fazla kez görünebilir.
  • Değerler metin olarak eklenir, HTML olarak asla eklenmez. Bunun yerine etraflarındaki metne işaretleme koyun: Hi <b>$name</b>.
  • İçerikte değişkenler href veya title gibi özniteliklerde değil, yalnızca metinde değiştirilir.
  • data-v geçerli bir JSON nesnesi değilse, metin çevrilmemiş bırakılır ve bir uyarı günlüğe kaydedilir. Metinde görünmeyen bir anahtar da bir uyarı kaydeder.
  • $name, komut dosyası yüklenene kadar görünür. Komut dosyasını sayfanın başlarında yükleyin veya bu öğeleri o zamana kadar gizleyin.

Seçenekler

Tek bir öğe için seçenekleri ayarlamak için şu nitelikleri kullanın:

ÖznitelikDeğerAçıklama
data-formalityinformal veya formalÇevirinin formalitesini ayarlar.
data-langbir dil koduSayfanın dilini geçersiz kılar.
data-t-idbir kimlikMetnin bu kullanımını kendi başına düzenlemenizi sağlar. data-t-attrs öğesinin içeriği için değil, öğenin içeriği için geçerlidir.
<t data-lang="fr" data-formality="formal">How are you?</t>

Değişen içerik

Sayfaya daha sonra eklenen veya komut dosyalarınız tarafından değiştirilen içerik de çevrilir. Bu, JavaScript tarafından oluşturulan içerik için çalışır, örneğin htmx veya jQuery ile.

Aynı anda talep edilen tüm çeviriler tek bir istekte API'ye gönderilir ve çeviriler önbelleğe alınır. İstediğiniz kadar öğeyi işaretleyebilirsiniz.

Sınırlamalar

Tek bir öğenin içeriği yaklaşık 5.000 karakter olan 10 KB'yi geçemez. İç içe geçmiş öğeler, ana <t> öğelerinin bir parçası olarak çevrilir.

ÖncekiJavaScriptSonrakiJavaScript API'si