JavaScript

Terjemahkan situs web apa pun dengan JavaScript biasa: tambahkan tag skrip dan tandai teks yang ingin Anda terjemahkan. Ini bekerja dengan HTML biasa, halaman yang dirender server, WordPress dan CMS lainnya, dan aplikasi yang dibangun dengan kerangka kerja apa pun.

Pengaturan dengan tag skrip

Tambahkan skrip Magic Translate ke halaman Anda:

<script
  src="https://cdn.jsdelivr.net/npm/@magic-translate/js@1/dist/magic-translate.min.js"
  data-api-key="<your-api-key>"
  data-language="de"
  defer
></script>

Jika Anda belum memiliki kunci API, daftar Magic Translate untuk mendap atkannya. Karena kunci adalah bagian dari halaman Anda, batasi ke domain Anda sendiri di bawah domain yang diizinkan.

Kemudian letakkan teks yang ingin Anda terjemahkan dalam elemen <t>:

<h1><t>Please translate me!</t></h1>

Itu saja. Situs web Anda sekarang dapat diterjemahkan ke lebih dari 70 bahasa.

Tinggalkan data-language untuk menerjemahkan ke dalam bahasa browser pengunjung.

Pengaturan dengan npm

Jika Anda menggabungkan JavaScript Anda, instal klien dari npm sebagai gantinya:

# using npm
npm i @magic-translate/js

# using yarn
yarn add @magic-translate/js

import { createMagicTranslate, Language } from '@magic-translate/js';

const magicTranslate = createMagicTranslate({
  apiKey: '<your-api-key>',
  language: Language.DE // any supported language
});

createMagicTranslate mulai menerjemahkan halaman segera.

Konfigurasi

Tag skrip menerima atribut ini:

Atribut	Deskripsi
`data-api-key`	Diperlukan. Kunci API Magic Translate Anda.
`data-language`	Bahasa yang diterjemahkan ke dalam konten Anda, misalnya `de`. Defaultnya adalah bahasa browser.
`data-source-language`	Bahasa yang digunakan halaman Anda ditulis. Ini terdeteksi secara otomatis, jadi hanya mengatur jika deteksi memberikan hasil yang salah.
`data-formality`	`formal` atau `informal`. Tidak didukung untuk semua bahasa.
`data-debug`	Mencatat permintaan ke konsol.

createMagicTranslate menerima opsi yang sesuai: apiKey, language, sourceLanguage, formality dan debug. Ini juga menerima root untuk membatasi terjemahan ke elemen tertentu. Secara default, ini menerjemahkan seluruh dokumen.

Mengubah bahasa

Panggil setLanguage untuk menerjemahkan halaman ke bahasa lain. Dengan tag skrip, instance tersedia sebagai window.magicTranslate:

<select onchange="magicTranslate.setLanguage(this.value)">
  <option value="en">English</option>
  <option value="de">Deutsch</option>
  <option value="fr">Français</option>
</select>

Saat Anda menggunakan tag skrip, pilihan bahasa pengunjung disimpan untuk pemuatan halaman berikutnya.

Contoh proyek

Anda dapat menemukan contoh proyek di GitHub dan melihatnya langsung.