W tym wpisie pokażę jak wstawić skrypt tłumacza Google na swoją stronę www. Wbrew pozorom to bardzo łatwe zadanie.
W miejscu gdzie chcemy umieścić przycisk do tłumaczenia wstawiamy tagi tag html:
<div id="google_translate_element"></div>Następnie przed zamykającym tagiem BODY dodajemy kod do ładowania biblioteki Google Translate:
<script src="https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>Skrypt ten po załadowaniu wykona nam funkcję googleTranslateElementInit() a więc dodajmy ją w kodzie przed nim wraz z kodem uruchamiającym przycisk do tłumaczenia:
<script>
function googleTranslateElementInit() {
new google.translate.TranslateElement({}, 'google_translate_element');
}
</script>Do funkcji google.translate.TranslateElement() jako pierwszy argument przekazujemy obiekt z ustawieniami a jako drugi ID tagu HTML który ma służyć jako przycisk wyboru języka / tłumaczenia. Domyślnie skrypt wykrywa język strony i pokazuje wszystkie możliwe języki.
W obiekcie możemy przekazać następujące wartości:
- pageLanguage – kod domyślnego języka strony
- layout – nazwę layoutu, przykładowo google.translate.TranslateElement.InlineLayout.SIMPLE
- includedLanguages – listę kodów języków po przecinku
Przykładowe wywołanie z ustawieniem języka strony na PL, layoutu inline simple i ze zdefiniowaną listą języków:
<script>
function googleTranslateElementInit() {
new google.translate.TranslateElement({pageLanguage: 'pl', layout: google.translate.TranslateElement.InlineLayout.SIMPLE, includedLanguages: 'en,de,uk,ru,cs,sk'}, 'google_translate_element');
}
</script>I to wszystko! Kod przykładu możesz zobaczyć na https://github.com/kamilwyremski/tlumacz-google